- 搭建 Astro 项目基础结构
- 配置 TypeScript、ESLint、Prettier 等开发环境
- 添加 Cursor 规则,提升 AI 编程体验
- 更新到 Astro 5.x 及相关的最新插件版本
- 配置 TailwindCSS 与项目集成
- 本地开发环境搭建与测试
- 实现 Markdown/MDX 内容管理
- 设置内容集合(Content Collections)管理博客文章
- 实现文章发布控制(可标记文章为未发布状态)
- 实现 RSS 订阅功能
- 创建 RSS 样式表 (XSL)
- 自定义 RSS 页面样式
- 相对路径图片资源处理
- 实现 rehype 插件转换 markdown 中的相对路径图片链接
- 使用 vite-plugin-static-copy 确保图片资源能正确访问
- 迁移布局组件
- 迁移导航组件
- 迁移页脚组件
- 迁移博客组件
- 实现分页组件
- 实现主题切换组件
- 实现 SEO 相关组件
- FloatingImage 迁移
- 分析旧项目浮动图片功能实现逻辑
- 创建图片链接查找工具函数
- 创建 Astro 版本的浮动图片组件
- 开发 rehype 插件自动为图片链接添加标识
- 在博客文章布局中集成浮动图片功能
- 添加响应式设计和视觉增强样式
- 新版首页
- 移植 Perlin Noise 动画作为首页背景
- 完成内容排版填充
- 优化性能,修复卡顿问题
- 迁移博客列表页
- 迁移博客详情页
- 迁移关于页面
- 迁移归档页面
- 迁移标签页面
- 迁移 404 页面
- 迁移全局样式与主题变量
- 迁移排版(Typography)样式
- 迁移响应式布局设计
- 迁移主题系统(深色/浅色模式)
- 初步将组件级样式从 SASS 迁移到 Tailwind CSS
- 实现新的表格样式
- 为
<mark>元素添加自定义样式支持 - 优化移动端布局和交互
- 实现 Giscus 评论系统集成
- 优化 giscus 评论区样式与主题联动
- 创建自定义 giscus 主题 CSS
- 实现主题切换时评论区主题同步变化
- 优化评论区在移动设备上的显示
- 完善 giscus 主题色彩系统
- 优化深色/浅色模式下的显示效果
- 增强评论区视觉一致性
- Markdown 图片优化
- 配置 Astro 图片优化选项
- 优化图片尺寸和加载性能
- 实现图片懒加载和响应式处理
- 外部链接在新窗口打开
- 使用 rehype 插件自动处理外部链接
- 提升用户体验和网站留存
- 使用 Astro 静态站点生成(SSG)
- 优化资源加载顺序与关键路径渲染
- 使用 Astro 的 client 指令按需加载 JavaScript
- 使用 Astro
组件,优化图片加载
- 图标库优化
- 解决 Astro 5.0 中图标库导致的构建时间问题
- 创建自定义图标组件系统
- 提升构建性能
- Flow Field 性能优化
- 优化首页背景动画性能
- 减少 CPU 和内存占用
- 字体文件加载加速
- 将 google fonts 文件下载到本地
- 调整字体引用方式
- 接入 umami
- 统计出站跳转点击
- 统计部分按钮点击
- 全面测试并优化所有已迁移页面和组件的响应式设计
- 测试首页在不同设备尺寸下的表现
- 测试博客文章页在不同设备尺寸下的表现
- 测试归档和标签页在不同设备尺寸下的表现
- 确保跨浏览器兼容性
- 确保 Lighthouse 评分达标