背景
这是当前个人博客的自建改造项目。保留 Astro 静态生成、现有中英文内容与文章地址，让网站围绕技术文章、项目记录和学习笔记持续更新。
问题
原首页主要介绍服务与接单方式，文章和项目不够突出；每次更新需要直接编辑文件，图片、草稿与内容预览也缺少统一入口。视觉升级还需要兼顾阅读稳定性，不能让动效成为正文的负担。
实现与取舍
- 用内容集合统一文章与项目字段，首页从真实内容中读取精选文章、最近更新与项目，让内容变化直接反映到页面。
- 沿用中英文目录与同名文件约定，用相同 slug 关联翻译；文章、项目详情与语言切换共享这套地址规则。
- 接入 Decap CMS 本地文件模式，在网页中编辑正文、上传图片和保存草稿，内容仍然保留为项目里的 Markdown 与静态资源。
- 资料先在对话中交给 agent，或放入 materials/inbox；由 agent 核实来源、整理为 Markdown 草稿，再在网页中校对配图并决定发布。
- 把玻璃材质限制在导航背景与独立研究画布。鼠标只扰动材质层，导航文字和正文保持稳定；触屏与减少动效设置使用静态表现。
- 为 Canvas 设置像素预算与运动停止阈值，在离开可视区域、页面隐藏和组件移除时暂停或清理，避免让装饰持续占用渲染资源。
结果
当前代码已经包含双语文章与项目页面、内容驱动的首页、本地网页编辑入口和独立玻璃研究组件。日常更新可以沿用同一套内容字段，界面样式也能单独迭代。这份记录以本地实现与设计取舍为范围，部署与线上写作认证按实际使用环境配置。
改版先从内容顺序开始
个人博客需要回答的第一个问题是：这里有什么值得读的内容。
因此，首页先展示一篇实际存在的精选文章，再列出最近的技术文章、学习笔记和项目。个人介绍缩短为一行，让读者更快进入具体的问题。服务相关内容仍可以有自己的位置，首页的主要任务则是帮助读者发现内容。
文章和笔记共用一个内容集合，通过 type 区分。标题、摘要、主题、封面、发布日期和草稿状态保持统一，列表可以使用同一套数据，后续新增页面也不用复制正文。
资料交给 agent，成稿留在文件中
后续更新从资料开始：可以在对话里给 agent 发链接、笔记和文件，也可以放到 materials/inbox/。agent 先梳理问题与来源，核对技术细节，再生成 Markdown 草稿。没有依据的经历或数据不补写，仍待核实的问题留在整理记录里。
这一步发生在当前项目的对话中。网页后台负责校对、配图和发布；它读取同一份文件，不需要再复制一遍正文。项目里的整理约定供后续 agent 延续这套流程。
本地写作使用 Decap CMS。开发入口会同时启动 Astro 与本地文件代理，编辑器里的文章、项目和图片最终写回当前项目。新建内容默认是草稿，写完并关闭草稿标记后，才会进入公开页面的数据集合。
这条路径仍然保留 Markdown 的直接可读性。需要批量修订、检查差异或迁移编辑器时，内容并不依赖某个专有数据库。图片上传到 public/uploads，正文保存站内资源路径。
上图是实现流程示意。网页编辑是本地文件的另一种入口；保存内容、生成站点与部署发布是不同的步骤。线上写作涉及的仓库、认证与部署环境仍需要按实际使用方式配置。
翻译共用标识，正文分别维护
同一篇内容在 en 与 zh 目录下使用同名文件。例如，这份项目记录的两种语言都使用 personal-blog 作为 slug。网站据此寻找对应翻译，生成语言切换与语言互链。
这种做法让两种语言可以独立修订。翻译尚未完成时，也不需要为了凑齐页面而发布占位内容。文章地址、标题和日期属于内容维护的一部分，改版时应当一起检查。
玻璃效果的边界
材质研究放在一个独立的 Canvas 组件里：背景纹理由代码生成，玻璃表面改变局部采样坐标，鼠标移动为表面带来短暂涟漪。组件作为独立界面实验出现，首页精选仍然使用文章集合中的实际内容。
导航采用更轻量的实现。装饰背景层根据鼠标位置产生小幅弹性位移和高光变化，链接文字留在原位置，点击区域也保持稳定。文章正文继续使用平面排版与统一的明暗主题。
动效采用按需渲染：鼠标触发更新，弹簧与涟漪收敛后停止请求下一帧。组件离屏、页面隐藏或组件被移除时停止工作；开启减少动效后展示静态材质。像素密度与总像素数都有上限，避免高分屏把计算量直接放大。
后续通过真实更新继续验证
这个项目会随着博客本身继续变化。接下来的判断标准很具体：新增一篇文章是否顺畅，旧内容能否轻松修订，图片和双语链接是否可靠，阅读时是否需要绕过多余装饰。
项目封面与本文两张图均为代码绘制的结构示意，用于说明页面组成和实现边界，并非线上截图。