VER 0.9.3 | BUILD SYX | MODE ONLINE | STACK ASTRO / CSS | LOCAL --:--:--

关于

一张写在互联网上的明信片,寄给路过的人。

你好,我是知雨 Chiyu。

这里没什么正经内容,主要用来放我自己。喜欢动漫,喜欢科幻, 喜欢那种画面里带一点未来感的静;游戏也打,主要是二游。 平时会写点代码,也会做点别的,谈不上多厉害,但做出来的东西自己看着高兴。

目前处在自由状态,时间比较完整,所以终于把这个想了很久的个人站做出来了。 如果你是从朋友那里知道这个地址的,那大概知道我是什么样的人; 如果你只是偶然点进来,那这一页就是我全部想说的了。

#1

平时会碰的东西

SKILLS // 10

#2

最近的状态

NOW · 最后更新 2026-09

在看

  • 没有在追的番,刷短视频、看时政新闻居多

在玩

  • LOL、FGO、明日方舟,偶尔 WOWS
  • 要约打 FPS 的话,请做好接纳一个菜鸡的准备

在听

  • 李荣浩金曲回响

在做

  • 目前在做这个网站
#3

一路走过来

TIMELINE

  1. 现在

    把这个站一点点补完

    门面做得差不多了,接下来往里放真东西 —— 写下真实经历过的事,而不是摆一个好看的壳。

  2. 最近

    从做作品转向做自己

    以前做的多是给别人看的东西,现在想留一块只属于自己的地方。

  3. 更早

    写代码,也看点别的

    喜欢动漫与科幻,喜欢那种画面里带一点未来感的静。谈不上多厉害,做出来的东西自己看着高兴。

#4

LINKS // 05

#5

这个站改了什么

CHANGELOG // 52

  1. v0.9.3

    碧蓝航线封面换成九周年官方主视觉 + 文档目录归位

    变更

    • 书影音里《碧蓝航线》那张封面换成日服 9 周年官方主视觉 —— 上一版用的是活动 KV,官方 logo 缩到卡片尺寸只有十几像素、看不出是什么品牌;这次换的图 logo 占比大,小卡片上也认得出

    工程

    • 五份说明与教程文档从根目录移进 docs/(BUG 报告 / 准备工作 / 部署指南 / Waline 部署指引 / 教程-需要你操作的部分),根目录只留 README、AGENTS、UPDATALOG 三个入口
    • 新增 docs/README.md 作为全部文档的分类索引;根 README 的文档导航从 25 行收到 4 行
  2. v0.9.2

    书影音配图更新:游戏 7 张换成带官方 logo 的官方素材,书籍 2 张换成真实书封

    变更

    • 书影音的游戏 7 张封面全部更新,每张都带对应游戏的官方 logo:原神(六周年主视觉,底部标志)、明日方舟(官方插画 + 「明日方舟」字标)、碧蓝航线(官方 KV 正面角色群像)、明日方舟:终末地(角色半身立绘 + 「终末地」标志)、崩坏:星穹铁道(列车大厅角色群像)、鸣潮(角色立绘 + 2024 版标志)、洛克王国:世界(官方月度壁纸 + 「洛克王国」字标)
    • 书籍 2 张从 AI 原创插画换成真实书封:《三体》三部曲(重庆出版社 2018 精装合订本)、《东方快车谋杀案》(新星出版社 2013「阿加莎·克里斯蒂作品 04」)
    • 九张图统一按卡片容器裁成 3:4(480×640 WebP q80),页面版式与容器一行未改

    修复

    • 书影音页头图的图像描述写的是另一张插画(「窗边矮几、书、耳机与热杯」),与实际画面(飘窗读书角)不符 —— 已改成与图一致的描述,页内 alt 与社交分享卡的 og:image:alt / twitter:image:alt 三处同步

    工程

    • 开发工作区收敛:Agent 的临时目录一度堆到 4.9 GB(其中 61 个无头浏览器配置目录占 4.19 GB,还会残留进程锁住文件,导致本地启动报 EBUSY)—— 现已清到 57 MB,并把这类目录排除出文件监听
更早的 50 条记录
  1. v0.9.1

    路线一 F:上线与线上验收(预览 + 生产两步走)

    上线

    • 部署脚本新增 --preview:只发预览部署,不写 production target、不绑域名,先看再发
    • 生产已更新到本路线的最新版本;线上全部路由 200(不存在页正确返回 404),HTML 走 Brotli
    • ⚠️ 本机连不上 github.com,所以先直连发了线上 —— 仓库需要站主补一次 git push 才与线上一致

    线上验收

    • 无障碍 100 / 最佳实践 100(首页与文章页);文章页 LCP 2.28–2.52s、CLS 0;实验室 TBT 0ms
    • 预取(prefetch)实测:首访 189KB,回访/站内跳转时其它页面 HTML 预取约 62KB —— 在可接受范围内
    • 本站到 Vercel 的网络抖动明显(同一页两次可差一倍),Performance/SEO 的最终判定交给 PageSpeed Insights 的字段数据
  2. v0.9.0

    路线一 E:无障碍收口 + 版本号门禁 + 抽出 Seo 组件

    无障碍

    • 页脚时区文字原来用的是描边色当正文色,对比度不达标 —— 改成正文色板里的那一档
    • 播放器队列按钮的可访问名与可见文字(曲目数)不一致,补上曲目数
    • 文章页标签胶囊的点击区不足 24×24,用内距撑到合规(WCAG 2.5.8)
    • 留言板(第三方 Waline)在亮色下的 6 处低对比度:用自托管样式覆盖修掉,不 fork vendor 文件;它自己标记里那处 aria-label 用法改不了,记为已知第三方限制
    • 移动端 Lighthouse 无障碍:首页 96 → 100、文章页 87 → 100

    工程

    • 新增版本号双源门禁:package.json 与更新日志顶部的版本号必须一致,不一致直接拦发布(已用"改坏一侧"的方式验证过它会拦)
    • 把 <head> 里的 SEO 标签抽成独立组件,主布局只留页面骨架;搬家时抓到一个真 bug(JSON-LD 被输出两遍),并给自检加了"一页只许一段 JSON-LD"的守卫
    • README 补上 docs/ 下四份路线一报告的入口
  3. v0.8.1

    路线一 D:结构化数据补齐(面包屑、列表页、sitemap 日期)

    SEO

    • 文章页补 BreadcrumbList(首页 → 博客 → 本文),与原来的 BlogPosting 同处一个 @graph
    • 博客列表页补 Blog 结构(含每篇的标题 / 链接 / 发布时间),书影音与作品页补 CollectionPage
    • sitemap 的 lastmod 不再全是"构建当天":文章用自己的发布时间 / 更新时间(搜索引擎更愿意信这个字段)
    • 核对确认:og:image:alt / 尺寸 / locale / site_name,以及 RSS 的 lastBuildDate、guid **本来就已经是齐的**,这一轮没有重复改

    工程

    • 发布前自检里的 JSON-LD 检查从"能解析"升级为"结构对得上":必查 @context、按类型查必备字段,文章页少了面包屑直接判失败(已用故意改坏数据的方式验证过它会拦)
  4. v0.8.0

    路线一 C:首屏减重(留言板懒加载、CSS 内联)

    性能

    • 文章页的留言板改成「滚动到评论区附近才加载」:以前每篇文章首屏都要下 257KB 的 Waline 客户端 + 22KB 样式,现在不滚到那儿就不下 —— 文章页首屏脚本 302KB → 45KB、可交互时间 5.7s → 3.0s、整页下载少 280KB
    • 占位是个真按钮:想立刻看评论点一下就行,键盘也能触发;浏览器不支持 IntersectionObserver 时退回"立即加载"(与改动前一致)
    • CSS 跟着 HTML 一起下发(内联),首屏不再多一次阻塞渲染的样式往返:首页 FCP 2.4s → 2.0s、Performance 89 → 90、文章页 92 → 93;压缩后总字节基本不变(首页 25KB → 25KB),代价是 prefetch 的背景流量每页多约 8KB
    • 试过把首屏文字的入场动画从 JS 改成纯 CSS(想让 LCP 提前),A/B 实测反而更慢(LCP 中位 3.1s → 4.8s、Performance 90 → 81),已回退 —— 结论记在 docs/性能优化报告.md,别再重复试
    • 手机壁纸影片降到 200k(从源片重跑):夜间版 716KB → 550KB;顺手修掉壁纸脚本里 xfade 后误用分号的滤镜链 bug(ffmpeg 9 下"重跑壁纸"本来是坏的)
    • 文章封面与首屏立绘改出 AVIF(保留 webp 兜底):封面 600w 23KB → 12KB、立绘 64KB → 37KB
    • 清掉 9 条没人用的装饰 CSS(.hud-stat / .gauge / .tech-tag--dim 系列)

    无障碍

    • 文章页 Accessibility 87 → 92:留言板那 257KB 的客户端不再在首屏注入元素,它自带的对比度/ARIA 问题也就不计入首屏了
  5. v0.7.0

    路线一 B:Astro 升级、类型收口、发布前自检加类型门禁

    升级

    • astro `7.3.2 → 7.3.5`(同一条 7.3.x patch 线),只动版本范围与锁文件,**没有新增任何依赖**
    • 升级前核实了包来源:registry 元数据指向官方仓库 `withastro/astro`(monorepo 的 packages/astro)、MIT、无安装期脚本;官方源与镜像源给出的 tarball 完整性哈希完全一致 —— 确实是官方包,不是 fork 或包装包
    • 移除了两个从没被用到的 devDependency(`@fontsource/baloo-2`、`@fontsource/orbitron`):实测把它们连同字体缓存一起挪走,构建照样产出 6 个 woff2 与 2 条 preload —— 字体是构建期从 Fontsource 取数据后自托管的,本地包并不参与。顶层依赖 5 → 3

    修复

    • 类型错误 **112 → 0**:全部是同一个问题 —— 组件脚本里 `querySelector()` 的返回值被当具体元素用(`Element` 上没有 `dataset` / `style` / `currentTime` / `value`)。修法是补类型实参与全局声明(新增 `src/types.d.ts`),**只加类型、没动任何运行逻辑**,类型语法在构建时被完整剥掉
    • 清掉 Astro 侧弃用:`z` 不再从 `astro:content` 取(Astro 8 会移除),改为官方建议的 `astro/zod`
    • 顺手删掉 4 处没用到的导入

    工程

    • 发布前自检新增**类型门禁**:以 `astro check --minimumSeverity error` 运行,有类型错误就不允许发布(已用"故意写错一个类型"双向验证过它会拦)
    • 静态边界复核:无 adapter、`output: static` 未变、无 actions / middleware / session,产物里 0 个站外脚本或样式
  6. v0.6.2

    路线一优化:先给全站做了一次体检

    审计

    • 只读审计,没有改动站点代码:测了构建耗时(4.45s)、产物(176 文件 / 12.92MB)、15 条路由、Lighthouse 四项分数、LCP/CLS、首屏网络明细、SEO 与结构化数据覆盖、无障碍缺陷清单
    • 审计结论:底子扎实(纯静态边界干净、零第三方脚本、图片与字体都已现代化、title 与 description 全站唯一),差距集中在三处 —— 文章页无条件加载的 257KB 留言板脚本、78KB 全量阻塞 CSS、以及 3 处自家无障碍缺陷
    • 三份文档进了仓库:`docs/基线审计报告.md`、`docs/升级与优化计划.md`、`docs/风险与回滚方案.md`
  7. v0.6.1

    新文章:人生第一个 VST 形象

    新增

    • 新文章《人生第一个 VST 形象,做完了》—— 把「豆包抽母图 → seethrough 拆层 → PS 与 Psd2live 微调 → 导出成 VST 能接收的格式」这条流水线记了一遍,以及手搓装饰品的那一小块
    • 正文第一次内嵌 Markdown 插图(全身立绘):Astro 的图片管线会连同封面一起优化成 webp,配图不再只能挂在 frontmatter 的 cover 上
  8. v0.6.0

    社交链接统一成一套版式:三个图标、一种手感

    改进

    • B站 / 网易云音乐 / GitHub 改成同一套版式(图标 + 文字、同一字号、同一块圆角点击区)—— 以前一个是图标链接、另外两个是带边框的文字按钮,并排放着像两种物种
    • 三个图标的**光学重量**对齐:官方图形的墨迹范围各不相同(B站 20×18、音符 18.7×19.3、GitHub 圆盘 24×23.4,单位是 24 的视框),直接放进同一个尺寸里 GitHub 会大一圈。现在按"墨迹高度统一到 12.2px"缩放,实测三个都是 12.1~12.3px
    • 网易云音乐与 GitHub 补上图标(GitHub 用官方章鱼猫,网易云用一枚联梁音符 —— 它的官方图标是红底白音符,单色场景下简成音符更干净)
    • 悬浮反馈统一:文字转品牌色(B站粉 / 网易云红 / GitHub 墨色)并垫一层玻璃底,与顶栏导航项同源;亮色主题下三个品牌色各压深一档,保证浅底上也看得清
    • 按位置分三档:顶栏只留图标(带无障碍标签)、首屏用短名、页脚与关于 / 联系页用全名

    整理

    • 删掉 BilibiliLink 与 SocialPills 两个旧组件 —— 同一个链接不该有两种样子
    • 页脚的链接行规则合并成一条(原来同一个类名在文件里定义了两遍),邮箱与 RSS 跟进社交链接的圆角点击区形状,整行手感一致
    • 页头指标块的间距收进 global.css,博客页与作品页不再各抄一份
  9. v0.5.0

    第三轮代码审查:令牌清淤、CSP 收紧、类型检查接上了

    修复

    • RSS 的链接不再带尾斜杠(站点配置是 trailingSlash: false,带斜杠会让阅读器先吃一次跳转),并补上署名、去掉无标签时残留的空行
    • 修掉 3 处把 /* 注释 */ 写在 JSX 属性列表里的问题 —— 注释会被当成属性传给组件
    • Tilt3D 的滚动缓存注册表从 WeakMap 改成 Set:WeakMap 没有 forEach 也不可枚举,之前一滚动就抛未捕获异常,而且卡片坐标缓存永远失效不了(滚动后倾斜计算用的是旧坐标)
    • 顺手修了 6 个真实类型错误:文章页与标签页缺 Props 声明、封面类型没收口、视频属性名大小写、webkitAudioContext 的类型

    清理

    • 删掉 16 个已经没人引用的设计令牌(背景 3D 的网格 / 光球 / 脉冲,旧描边体系,以及从没被用过的 --grad-text),两套主题共 30 行
    • 首页的玻璃高光脚本改用统一的 onReady,全站每页的内联脚本从 22KB 降到 0.26KB(只剩主题引导那一段)

    安全

    • CSP 的 script-src 去掉 'unsafe-inline',改成只允许主题引导脚本的哈希 —— 内联脚本不再能随便执行
    • 新增 npm run sync:csp:按产物重算哈希写回 vercel.json;忘了跑时 check-release 会让构建失败

    工程

    • 发布前自检新增"设计令牌一致性"检查:引用了却没定义、且没兜底值的变量会直接判失败(这类问题浏览器不报错),定义了却没人用的会给提醒
    • 接入 astro check(npm run check),类型错误从 296 条收敛到 111 条,剩下的都是组件里手写 JS 的 DOM 定型问题,留作后续
  10. v0.4.10

    第二轮代码审查:状态栏时钟修好了,内联脚本再降一档

    修复

    • 状态栏上的时间在站内换页后会冻住 —— 换页把节点换成了新的,每秒还在写已经被卸载的那一个(页脚时钟因为常驻,一直是对的,于是这个 bug 藏了很久)
    • 滚动进度条有同样的隐患:换页后它写的是旧节点,进度条静默失效 —— 一起修了
    • 页头的"现在是第几页加载"判据换成看有没有真的换过页:页面还没加载完就点站内链接时,那次换页不会再被漏掉

    性能

    • 壁纸、滚动进度、状态栏时钟、音频频谱四个脚本改走统一的页面生命周期 —— 从"每页内联"变成可缓存的模块:单页内联脚本 5.6KB → 0.26KB(只剩防闪烁的主题引导)
    • 壁纸的切后台 / 断点监听从"每次换页各挂一份"收成模块级一份(换页不再堆积监听)
    • 书影音、作品、博客三个列表页的页头图改为即时加载:它就是那一页最大的那张图,懒加载等于让它白等

    变更

    • 书影音分类的英文副行(ANIME / GAMES / …)写进分类数据里,不再靠页面里"按序号对应"的平行数组
    • 窄屏断点统一成 47.99rem(打字机那句原来写 48rem,正好在 768px 与桌面断点重叠)
  11. v0.4.9

    修掉一轮代码审查指出的问题(性能与正确性)

    修复

    • 留言板在首屏被初始化了两次(Astro 首屏也会派发一次换页事件),而且旧实例一直没销毁 —— 现在统一走公共的页面生命周期模块,并在重建前 destroy() 掉旧实例
    • 时钟换页后只刷新时间、不刷新"睡/醒"状态,会停在上一次的读数
    • 更新日志为空时,首页构建会直接崩掉 —— 补上兜底

    性能

    • 播放器、频谱条、页脚时钟三个脚本从"每页内联的未压缩脚本"改为可缓存的模块:单页 HTML 缩小约 28KB(首页 80KB → 52KB)
    • 播放器曲目改成从 DOM 读,不再把曲目 JSON 注入脚本里(顺带堵掉"数据里出现脚本结束标记会截断标签"的隐患)
    • 卡片流光离开视口时暂停 —— 一屏六七张卡同时转,看不见的部分不再占合成器
    • 播放进度不再每 250 毫秒全量重绘一遍播放器,只更新进度环
    • 立体倾斜的滚动/缩放监听从"每张卡各挂两个"收成一份共享注册表(首页 16 个监听 → 2 个,且不再长期持有被换掉的节点)

    变更

    • 页面生命周期的 ready() 原本在 13 个文件里各抄了一份(写法还略有出入)—— 收敛成 src/scripts/lifecycle.ts 一个模块
    • 站主署名、状态栏上的 BUILD / MODE / STACK 收进 src/data/site.ts,页面里不再散着字符串
  12. v0.4.8

    把"发之前该看一眼"的事交给脚本,顺手统一了图标

    新增

    • 发布前自检:一条命令查完断链、图标、sitemap、RSS、体积、无障碍,构建与部署都会自动跑一遍,不通过就不发
    • 站点图标整套统一 —— 标签页、iOS 主屏、安卓主屏现在是同一张脸(安卓那两个之前还是旧雨滴图标)
    • 分享图兜底卡片换成暗色主题配色,右侧用竖幅立绘,随手分享出去和站内是一套观感

    修复

    • 首页有两个同 id 的星空画布,其中一个从来没被初始化过 —— 删掉多余的,留下真正在画的那个
    • 首页"从这里继续"这一块的区域说明指向了不存在的元素,读屏软件读不出来
    • 装饰用的头像不再占一个没有名字的 Tab 停留点
    • B 站链接在白天主题下的品牌粉对比度偏低(约 2.9:1 → 4.2:1)

    变更

    • 安卓 / PWA 图标改为调色板量化(512 那张从 660KB 降到 147KB,图标尺寸下看不出差别)
  13. v0.4.7

    修掉两处和现状对不上的文案

    修复

    • 音乐播放器上一句"进入站点自动播放"是旧的 —— 现在曲子要点播放(或点曲目)才会下载播放
    • 播放器首屏不再闪一下"曲目筹备中":有曲目时直接显示"点播放就响:曲名",没有曲目才说筹备中
    • 作品页那句"修完顺手记成了博客第一篇文章"指向的文章已经下线,改成描述当时踩到的现象
  14. v0.4.6

    内容诚实化:站上只留站主自己写的东西

    变更

    • 下线四篇由小助手代写的文章(博客 6 篇 → 3 篇),留下的都是站主本人写的
    • 文章页支持署名:作者不是站主时会在标题下显示「撰文:…」,结构化数据同步
    • 补上 RSS 的入口 —— 页头加了订阅声明,页脚加了 RSS 链接(之前源是有的,但没有任何地方能点到)
    • 留言板加了一行隐私提示:留言会公开显示,邮箱只用于收回复通知

    新增

    • 《小助手笔记》—— 一篇署名「小助手」的文章,讲讲这个站是怎么被搭起来的
    • 《教程-需要你操作的部分.md》—— 需要站主本人做的事(推仓库、搜索引擎收录、留言板服务端、待填表单)集中在这一份里
  15. v0.4.4

    书影音排得更紧凑了

    变更

    • 书影音卡片收小:封面上限从 9rem 降到 5rem 左右,卡片内距与列表行距各压一档
    • 宽屏改成三列(≥72rem),中等屏两列,窄屏单列 —— 之前固定两列、封面又大,翻起来很累
    • 结果是同样一屏能看到的条目大约翻了一倍
  16. v0.4.3

    书影音配图补齐:游戏全都有封面了

    新增

    • 游戏 8 条全部配上封面:在原来 3 条的基础上,补上 FGO、碧蓝航线、原神、鸣潮、洛克王国:世界
    • 音乐 3 条补齐专辑封面:Take Me Hand、Lifeline、Where are you

    变更

    • 书影音 20 条现在全部带图了(番剧 7 / 游戏 8 / 书籍 2 / 音乐 3)
  17. v0.4.2

    书影音开始有封面了:先把番剧那一组补齐

    新增

    • 书影音条目配上封面:番剧 7 条用动画海报,游戏先补上明日方舟、明日方舟:终末地、崩坏:星穹铁道三条
    • 书影音的卡片封面改成竖版(3:4)—— 海报与立绘本来就是竖的,横着裁会切掉主角

    变更

    • 这批图用的是作品官方海报与立绘(之前那三张是 AI 原创插画,也还在用)
    • 剩下 5 条游戏与 3 条音乐暂时留空,等补齐
  18. v0.4.1

    两篇新文章:这个站为什么长这样,以及我在怎么学东西

    新增

    • 《为什么我要做一个"不喜欢的人也不会来"的站》—— 从两年前那个没做成的群机器人,到现在的门面;也写了不想要的三样东西:拘束、无趣、空洞
    • 《自由状态下,我学东西的方式变了》—— 三点睡十点起的日子、问答式的学法、搭 Bot 的动机,还有"没人给反馈"这件事

    变更

    • 博客现在 6 篇;两篇新文章各配了一张插画封面(原是书影音那边没用上的素材,正好对得上内容)
  19. v0.4.0

    内容换血:书影音 20 条、近况与常去的链接全部更新

    新增

    • 书影音清单更新到 20 条:番剧 7、游戏 8、书籍 2、音乐 3,评分与短评都是自己的主观评价
    • 每条多了「进度」小标签:看完 / 正在玩 / 弃坑 —— 一眼能看出这条还在不在列表里
    • 社交链接补上网易云音乐与 GitHub,页脚、关于页、联系页三处同步出现

    变更

    • 「最近的状态」换成真实近况:不追番、刷短视频看时政、玩 LOL / FGO / 明日方舟 / 偶尔 WOWS、在听李荣浩、在做这个站
    • 「常去的地方」换成真正会去的:B站、DeepSeek 网页版、藏经阁(原来那条指向 github.com 首页的链接下线)
    • 关于页自我介绍补了一句"游戏也打,主要是二游",其余语气保持不变
    • 配图只保留与内容对得上的三张(芙莉莲 / 三体 / 东方快车谋杀案),其余条目走纯文字卡片
  20. v0.3.4

    媒体减重:手机首屏少下 0.7MB,桌面少下 1MB

    变更

    • 四支壁纸影片按目标码率重新压过:手机版 1.3MB / 1.6MB → 0.63MB / 0.72MB,桌面版 2.1MB / 2.8MB → 1.1MB / 1.7MB
    • 壁纸首帧海报从 jpg 换成 webp:75–138KB → 59–117KB
    • 两首曲子从 mp3 换成 AAC(96kbps):3.7MB / 3.9MB → 1.9MB / 2.0MB;点了播放才开始下载,所以这是"想听歌的人才付"的那份流量
    • 壁纸处理脚本改为按目标码率两趟编码(桌面 700k、手机 300k),并且自己能找到 winget 装的 ffmpeg —— 以后重出片子不会又长回去
  21. v0.3.3

    分享出去不再长得一样:每个页面都有自己的预览图

    新增

    • 每篇文章、每个列表页现在都有一张专属的分享预览图(1200×630)—— 把链接发到微信 / QQ / B站时,看到的是那一页自己的插画,而不是全站同一张图
    • 页面对搜索引擎的结构化描述:首页说明这是一个「人 + 一个站」,关于页说明这个人是谁,文章页说明这是一篇文章(含发布时间、作者与正文地址)

    变更

    • 标签聚合页(/blog/tags/…)不再进搜索结果 —— 那里只是同一批文章的另一种排列,属薄内容页;链接照常可点、权重照常传递
    • 站点地图随之从 18 条收到 10 条,只留给真正的页面
  22. v0.3.2

    音乐改成点了才响,顺手给首访省下一份流量

    变更

    • 音乐不再进站就播:曲子要等点了播放(或点了曲目 / 上下一首)才开始下载。单曲 3.7MB,自动播放等于给每位首访者白发一次流量
    • 首屏连音频地址都不下发 —— 没点播放之前,一个字节的音频都不会拉
    • 删掉了"等第一次点击再起播"那套逻辑:现在播放只可能发生在真实手势里,音频上下文不会再被起成挂起态,顺带少了一类"进度条在走却没声音"的毛病
    • 壁纸首帧(影片没就绪时先顶画面的那张图)重新压过一遍,四张各小一档
    • 状态文案改为三态:点播放就响 / 正在播放 / 已暂停

    修复

    • 本机开发服务器(npm run dev)复核后已能正常使用,之前"一启动就崩"的现象不再复现;文档里的相关说明同步更正
  23. v0.3.1

    内容的收口:把筹备期留下的说明清掉

    变更

    • 作品页只保留一件真实条目("这个站本身"),其余当初用来试版式的条目全部下线;只有一类时筛选栏本来就会自动隐藏
    • 四篇文章末尾各有一段起初写给作者自己的编排说明,它不该出现在读者面前,现已删除
    • 首页入口卡与关于页时间线上几处已经过时的说法,改成与现状一致的描述

    修复

    • 《深夜写代码时我在听什么》摘要里的一个繁体字改回简体
    • 删掉两个已经没人引用的旧组件和它们的样式,构建产物更干净
  24. v0.3.0

    音乐相关的四件小事,加一处图标缓存问题

    新增

    • 进入站点会主动尝试播放音乐;被浏览器的自动播放策略拦下时不再装作没事,而是把提示换成"点击页面任意处开始播放",并在第一次点击/按键时立刻起播
    • 右下角的迷你播放器可以拖动:左侧新增一个六点手柄,按住它或整条空白处即可拖到任意位置,位置自动限制在视口内

    变更

    • 音乐播放器整体缩小一号:卡片内边距、黑胶唱片、按钮、控件间距与频谱高度各降一档
    • 版本号收敛为单一来源 —— 状态栏的 VER 改为直接读 package.json,不再手抄(以前两处必须一起改,漏改就显示不一致)

    修复

    • 音乐频谱"光柱"从来没显示过:组件脚本在页面解析途中就去找播放器里的 audio 元素,而那一刻元素还不存在,整段逻辑直接退出(不报错、画布停在默认尺寸)。改为等 DOM 就绪后再解析,并在换页后重新检查
    • 自动播放场景下音频上下文可能停在挂起状态(表现为进度条在走却没有声音),补上恢复逻辑
    • 书影音封面显示不正常:封面容器被布局拉伸,高度跟着卡片文字行数走,同一排的封面比例忽高忽低;改为按素材比例固定,并顺带消除原来 17% 的横向裁切
    • 背景影片循环播放:显式打开循环,并补上"片尾兜底"与"加载出错重试"两道保险;同时把性能看门狗的阈值从 46ms 放宽到 58ms,避免中端设备被误判停机
    • 浏览器图标改了却不生效:图标文件是新的,但 URL 没变,浏览器与 CDN 一直命中旧缓存;给图标链接加上版本查询串强制刷新
    • 页面大图(书影音/博客/作品三个页头)补上更大尺寸的档位,高分屏不再把图放大到发虚
  25. v0.2.2

    昼夜动态特效系统:夜里星空,白天白云和风铃

    新增

    • 夜空特效:一百多颗星各自按自己的节奏闪烁,偶尔有一颗流星斜着划过、拖着渐隐的尾迹,同时最多两颗 —— 天上大多时候是安静的
    • 最亮的几颗星带四向星芒,星星整体与音乐鼓点联动:鼓点越重,星空越亮
    • 白天特效:四朵白云以不同速度、不同高度横穿画面,云的软边是多层径向渐变直接画出来的,不靠实时模糊
    • 白天特效:一串玻璃质感的风铃从视口顶垂下来,悬线、铃身、铃舌、短册四段各自摆动、周期互质,鼓点越重摆得越开
    • 夜幕改成深蓝渐变:靛蓝从画面顶部浇下来、向下渐透明 —— 纯黑压出来的夜是灰的,深蓝才是夜

    变更

    • 版本号方案切换:网站还在测试阶段,版本从 0.x 起算(2.2.0 → 0.2.2,历史条目保留旧编号)
    • 压暗纱的颜色改成令牌(--wall-dim-rgb),夜间从纯黑换成深蓝黑

    修复

    • 星空的颜色改读 --fx-star-* 令牌并缓存,切换主题时跟着换色,不再每帧去问一次样式
    • 减少动态效果下:星空改画一帧静态星图(motion = none 不等于内容消失),白云钉在画面里,风铃静止但保留形态
  26. v2.2.0

    背景换成了会动的影片,标签页图标换成一颗雨滴

    新增

    • 背景改成全屏循环的影片 —— 夜晚是紫粉的合成器浪潮城市,白天是柠檬树下的动漫画面,昼夜各一支
    • 每支影片都从 4K 原片裁一段、做成无缝循环(把开头挪到结尾再交叉溶解),接缝看不出来
    • 影片分桌面 1600×900 与手机 720×1280 两版,手机版是竖屏中心裁切,不浪费流量;各配一张首帧静帧,影片没到之前先把画面顶住
    • 浏览器标签页图标换成一颗雨滴:浅色标签栏与深色标签栏各有一套底板,跟着系统的明暗自动切换;PWA 与苹果桌面图标一并重画并补了 192/512 两档
    • 新增 npm run wallpaper 脚本 —— 喂一段视频进去,自动裁段、做无缝循环、出桌面/手机两版与海报
    • 新增「音乐节奏 → CSS 变量」的独立组件,把 --beat / --energy 写到页面根上供各处取用

    变更

    • 撤掉了背景里那一整套 3D 元素(WebGL 光线步进场景、CSS 立体方块、透视网格地面)—— 太抢戏,跟画面打架
    • 背景的模糊度从 5~6px 大幅降到 1px,画面基本是清晰的
    • 压暗强度重新调过:暗色从 0.62 降到 0.42;亮色的白纱从 0.42 降到 0.24,改成"按版面定向铺"—— 首屏左栏(文案那一侧)单独加厚,往右在 80% 处收干净,让立绘两侧的素材保持鲜亮
    • 亮色主题的两档次要文字色各压深一级,把背景变亮后丢掉的对比度补回来
    • 影片只在需要时才加载 —— 减少动态效果、省流量或 2G 网络下完全不加载影片,切到后台自动暂停

    修复

    • 背景槽位的昼夜显隐规则在构建后被 Astro 的样式作用域附上了组件属性,条件永远不成立 —— 表现为影片确实在播,画面上却什么都没有
    • 播放器那圈随鼓点涨落的光环原本依赖背景的 3D 组件写变量,组件删掉后会静默失效(光环一直不亮且不报错),已把分析逻辑抽出来独立成一环
    • 播放器样式里的节奏变量补上兜底值,避免分析组件未启动时整条声明按无效值处理
    • 首屏文字在亮色主题下对比度偏低:白纱改成按版面定向铺之后,正文从 4.6:1 提到 5.9:1,手机端从 3.8:1 提到 5.1:1
  27. v2.1.0 改进

    背景真的立体起来了:一层真三维 + 会跟着鼠标倾斜的卡片

    新增

    • 背景多了一层真三维场景:用 WebGL 实时算出来的立体几何体,有真实的受光面、高光、边缘光和远近衰减,不是把平面摆成透视
    • 整个场景是手写的一小段着色器,没有引入任何 3D 引擎,产物只有几 KB
    • 三维场景会跟着鼠标轻轻转视角,播放音乐时随鼓点微微起伏
    • 卡片可以跟着鼠标立体倾斜了,卡里的封面、标题、箭头会浮在不同的高度上,有厚度
    • 导航栏站标和各分区标题前面多了一枚慢慢自转的小立方体
    • 顶部多了一条跟着阅读位置推进的进度线
    • 手机、"减少动态效果"、省流量模式或设备跑不动时,会自动退回原来那套轻量的 CSS 立体方块

    变更

    • 分区标头抽成了一个组件,原本在「关于」和「书影音」两页各手写了一遍,以后改一处就够
    • 卡片的悬停抬起改走独立的位移属性,把变换让给 3D 倾斜,两边不再互相覆盖
    • 白天主题下的三维物体压得更淡一些,保证正文在浅底上的对比度
    • 更新日志支持按「新增 / 变更 / 修复」分类列出,并可以标注版本号

    修复

    • 三维场景的相机基叉乘顺序写反,导致整个画面左右镜像(画面看起来很正常,只有照着版面留白摆的物体才暴露)
    • 入口卡原有的裁切与毛玻璃背景会让卡片强制塌平成平面,卡内分层视差因此完全失效
    • 入场动画原本会静默压掉卡片悬停时的位移,改成独立位移属性后两者不再打架
  28. 改进

    会跟着音乐动的几何体、玻璃画像、翻新的播放器

    • 背景里的立体方块补成了真正的封闭六面体 —— 以前只画了看得见的三面,转过去就露馅
    • 方块开始听歌了:鼓点打上来时会轻轻鼓动、边缘泛起光晕,曲子安静下来就慢慢收回去
    • 首屏的竖幅画像外面罩了一层玻璃,鼠标划过时会有一道反光跟着走,移开就缓缓收掉
    • 音乐播放器换了样子:唱片外面多了随节奏脉动的光环,进度条变成发光的渐变色
    • 以上动效都会在系统开启"减少动态效果"时自动停用
  29. 改进

    动态光效与随主题变化的边框

    • 首页背景加了三束缓慢漂移的极光,外加一道斜扫过的光,都是纯 CSS 画的,不占图片体积
    • 卡片边框不再是单色:白天是青绿到天青的渐变描边配淡青投影,夜晚是品红、紫、落日橘的三色渐变描边配霓虹发光
    • 部分卡片边框上有一道沿边跑动的流光,速度各不相同,避免整页一起闪
    • 光效与边框的颜色全部走主题变量,以后换配色不用改组件代码
  30. 改进

    昼夜两个主题:白天清新天青,夜晚合成器浪潮

    • 网站从此有两套并行的样子,跟着明暗开关一起换:白天是清爽的青绿动画风景,夜晚是紫粉霓虹的电子夜
    • 壁纸也分昼夜两张 —— 白天那张是蓝天白云的光,夜晚那张是赛博城市的天际线
    • 加了真正会转的立体几何块:浮在壁纸里缓慢自转,白天是青绿色、夜晚是品红色
    • 卡片鼠标悬停时会跟着轻微倾斜,像浮起来一样
    • 给每个区块加了等宽字的小标注(如「博客 // 05」),像在看一块仪器面板
    • 统计数字改成仪表盘样式:大号数字配细竖线分隔
    • 四角装饰由两个角补全成四个角,更像一块被框住的屏幕
    • 顺带修掉一个隐藏很久的问题:部分卡片的圆角因为引用了不存在的变量而失效
  31. 改进

    换色:从冷蓝科技感改成合成器浪潮的霓虹紫粉

    • 主色由天青换成「品红 / 紫罗兰 / 落日橘」的落日霓虹调,更贴动漫与科幻的调性
    • 按钮、选中的筛选项换成斜向渐变(品红 → 紫),是页面上最抓眼的色块
    • 玻璃面板加厚:底色更实、模糊更强、多了一层内高光,像块厚玻璃板浮在壁纸上
    • 降级背景重做成合成器浪潮的经典画面 —— 条纹落日 + 紫红渐变天空 + 透视网格
    • 频谱条与首页星空的颜色改为跟着主题色走,以后换主色不用再改代码
    • 顺带修掉一个老问题:头像被放大到盖住旁边的名字与简介(图片选档的 sizes 写死了)
  32. 改进

    换成科幻风:全屏壁纸打底,卡片变成磨砂玻璃

    • 全站铺了一层全屏壁纸打底,页面内容浮在上面 —— 壁纸会做模糊与压暗处理,保证文字始终看得清
    • 所有卡片、顶栏、页脚换成半透明「磨砂玻璃」:背后的壁纸能透出来并被化开,不再是一块块实色板
    • 给区块加了科幻界面感的装饰:标题左侧的青色竖线、四角细线、分区标题条
    • 首页重做:自我介绍、三组统计数字、最新更新、六个入口卡片都收进玻璃面板里
    • 还没配图的位置统一先留出空位,图准备好之后直接替换即可
    • 不支持磨砂效果的浏览器会自动退回接近不透明的底色,不会出现文字与背景打架的情况
    • 换成浅色主题时压暗层与文字颜色会自动反转,两套主题都能用
  33. 内容

    装上了第一张全屏壁纸

    • 铺上一张城市夜景壁纸(赛博紫夜),霓虹会从玻璃面板下方透出来
    • 壁纸在构建时会自动压成 16:9 并转成 webp,1900 像素宽的大图最终只占 225KB
  34. 改进

    每篇文章都有了配图,首页首屏也收紧了

    • 四篇文章各配了一张原创插画(深夜书桌、星空旷野、耳机与小木屋),画面按每篇的气质设计,不含角色与文字
    • 博客列表改成「图左字右」的横排:一屏从两篇变成四篇,扫列表时靠图就能认出是哪篇
    • 文章页顶部也会显示自己的配图,宽度与正文对齐
    • 顺带修掉一个老问题:列表页顶部那张氛围插画被撑到 750px 高,把整屏都吃了,现在按 16:7 正常裁切
    • 首页首屏的竖幅插画原来占掉半个屏幕,收窄成原来的三分之一;手机上把文字排到前面 —— 进来先读到「这是什么」,而不是先看到一张大图
  35. 改进

    站点瘦身:导航收成 5 项,页面合并,卡片统一

    • 导航从 9 项精简到 5 项:首页 / 关于 / 作品 / 博客 / 书影音,联系入口移到页脚
    • 近况、更新日志、站外链接三块内容并进「关于」页,不再是三个各自单薄的小页面
    • 原来的导航页(/hub)删掉了,常用链接直接列在关于页里
    • 博客 / 作品 / 书影音三处的卡片、筛选按钮、顶部插画统一成同一套样式,看起来是同一个站了
    • 老链接不会失效:/now、/log、/hub 自动跳到关于页
  36. 功能

    留言板上线

    • 文章页底部可以留言了 —— 服务端部署在 Vercel,数据存在 Neon 数据库
    • 服务地址绑了自己的子域名 comments.chiyukyumi.cn,比默认的 vercel.app 域名在国内更稳定
    • 加载做了兜底:网络不通时只留一句提示,不会卡住页面
    • 评论框的脚本放在站内自己加载,不依赖任何国外 CDN,国内访问更稳
    • 评论框自动跟随站点的明暗主题
  37. 功能

    博客与作品页正式上线

    • 博客换成 Markdown 内容库,写一篇 .md 放进 src/content/blog/ 就能上线,列表/详情/标签/RSS 全自动
    • 首发了 4 篇文章:换页脚本踩坑、做这个站的初衷、看完芙莉莲的那个晚上、深夜写代码听什么
    • 作品页改成卡片网格,加了类型筛选(那会儿还没有真实作品可放)
    • 博客与作品页都加了顶部氛围插画
    • 文章页接入留言板 —— 服务端在 Vercel,已在同日晚些时候部署完成并启用
  38. 内容

    书影音清单配上插画

    • 番剧、游戏、书、音乐每个条目都配了一张插画,不再是一整片文字
    • 插画是专门为这个站生成的原创图,风格统一:日式动画背景画风,不含角色形象
    • 画面按每部作品的"气质"来设计,而不是随便配张风景照
    • 图片做了响应式与懒加载,手机上不会白白消耗流量
  39. 修复

    修复换页后按钮失效、背景消失等一批问题

    • 修复站内跳转后明暗切换按钮点不动、点头像没反应的问题
    • 修复回到首页后星空背景整片消失、首屏引语不再逐字打出的问题
    • 修复入场动画只在首屏生效、换页后不再出现的问题
    • 修复迷你悬浮播放器在播放中仍显示「播放」图标、不切换成暂停的问题
    • 修复手机上播放列表被压成一竖条、曲名看不清的问题
  40. 修复

    修复换页后主题被重置、页脚误列 404

    • 修复切换页面后明暗主题被强制重置为暗色的问题(此前切成亮色,一换页就变回去)
    • 页脚站点地图移除 404 链接 —— 它是错误页,不该当成正常页面列出来
  41. 功能

    Konami 彩蛋,以及两处显示问题修复

    • 依次按 ↑↑↓↓←→←→BA 会触发一次全屏特效(输入框里按键不会误触发)
    • 修复打字机文案在手机上折行后被裁掉第二行的问题
    • 清掉源码注释被输出到页面里的隐患
  42. 功能

    音乐跨页不中断,新增近况 / 书影音 / 导航三页

    • 启用客户端路由:站内跳转不再整页重载,正在播放的音乐不会被打断
    • 新增近况页,记录最近在看什么、玩什么、听什么
    • 新增书影音清单,带主观评分
    • 新增导航页,收集常去的地方,支持即时搜索
    • 页脚加入完整的页面索引;首页入口卡片补上三个新页面
  43. 功能

    页脚时钟、技能标签云、时间线

    • 页脚显示中国时间与「大概醒着 / 大概在睡觉」的粗略状态(按小时推断,不接任何服务)
    • 关于页新增技能标签云,标签会缓慢漂浮,悬停放大
    • 关于页新增时间线,左右交错的发光节点
    • 修正一处隐患:时区标识写错时时钟脚本会崩溃,现在会安静降级
  44. 改进

    播放列表改为下拉浮层

    • 播放列表不再占据播放器卡片版面,改为点按钮在播放器上方浮出的下拉面板
    • 列表按钮放在传输控件旁边,显示曲目数量
    • 键盘可达,按 Esc 可关闭;选完曲目自动收起
  45. 功能

    音频频谱与头像素材整理

    • 播放时播放器顶部显示随节奏跳动的频谱条,暂停即停
    • 头像改为独立素材:圆形头像用专门的方形成品,首屏与关于页用竖幅插画
    • 修正首屏插画被当成圆形头像处理、导致被裁成正方形的问题
  46. 功能

    入场动画与头像互动

    • 页面内容滚动进入视口时依次淡入上滑,不再是一下子全冒出来
    • 点头像会晃一下(键盘按回车或空格也可以);系统开启"减少动态效果"时不晃
    • 入场动画在禁用 JavaScript 时完全不生效,页面照常完整显示
  47. 功能

    播放器增强:黑胶唱片、播放列表、迷你悬浮条

    • 封面改为黑胶唱片样式,播放时缓慢旋转、暂停即停(系统开启"减少动态效果"时不转)
    • 新增可折叠播放列表,标出当前曲目
    • 播放器滚出视口后,右下角浮出迷你播放条;手机上收成一个圆形按钮加进度环
    • 修正上一版播放列表缺少样式、曲名与作者挤成一整行的问题
    • 状态文字区分「待播放 / 正在播放 / 已暂停」,不再一进页面就说"正在播放"
  48. 功能

    首页动效:星空粒子与打字机

    • 首页背景加入缓慢漂浮的星点,鼠标移动时有轻微视差;移动端自动减少粒子数
    • 首屏引语改为终端式逐字打出,带闪烁光标
    • 更新日志页面(就是这个页面)
  49. 功能

    音乐播放器接上真实曲目

    • 加入两首曲子:永不栖落的鸟、氤氲之森
    • 修正播放器曲目配置格式,播放器由空壳转为可用
  50. 里程碑

    站点上线

    • 首页、关于我、联系、博客与作品集入口页、404 页
    • 暗色 / 亮色主题切换(默认跟随系统)
    • B站链接、邮箱一键复制、站点图标与社交分享图
    • 部署到 Vercel,绑定域名 chiyukyumi.cn

音乐

点播放就响:永不栖落的鸟 — Youzee Music

0:00 / 0:00
2

播放列表