为什么重建
旧版网站用 Next.js 搭建,存在几个问题:
- 太重了 — 一个个人主页不需要完整的 React 运行环境
- 构建慢 — 每次部署 CI 要跑好几分钟
- 过度工程 — SSR 对于一个静态博客来说完全多余
为什么选 Astro
零 JS 输出是最大亮点。首页、关于页、联系页都是纯静态 HTML,没有一行 JavaScript。博客部分只在需要交互的地方按需加载。
技术栈最终确定:
- Astro 5 — 静态站点生成
- MDX — 博客内容管理
- OKLCH 色彩 — 感知均匀的色彩空间
- View Transitions API — 原生页面过渡动画
部署方案
静态文件直接部署到 Nginx,加上 Cloudflare CDN。构建时间从 3 分钟降到了 15 秒。
整个站点的 JS bundle 不到 5KB(gzip 后),PageSpeed Insights 四页全绿。
后续计划加入更多互动元素——比如一个会跟着鼠标转眼睛的图图 🐶