为什么要拆
这个博客虽然只是我的个人记录站点，但我仍然希望它“干净、轻、稳定”，尤其是：
- 首屏少加载不必要的东西
- 阅读页尽量保持流畅
- 代码高亮、TOC 这类“非必须”功能可以晚一点到
加载策略：先轻后重
1) 路由级懒加载
BlogList / BlogDetail 都是通过 React.lazy 分包。
只有用户真正进入 Blog 时，才加载博客相关代码。
2) 数据层：列表只拿元信息
列表页只需要标题、摘要、分类、发布时间等元信息，
文章正文只有进入详情页才取。
我在 loader 里加了缓存，避免重复解析 Markdown。
3) 详情页的“选择性加载”
详情页会先渲染结构与文章头部，
正文内容（Markdown 渲染器）再异步加载：
react-markdown/remark/rehype被延迟加载- 代码高亮组件
react-syntax-highlighter只有遇到代码块才加载 - TOC 解析（
extractTOC）也放到动态 import 中执行
这样主内容更快到达，重资源更晚到达。
渲染策略：轻渲染、重效果
Markdown 渲染
- 内容由
ReactMarkdown渲染 remark-gfm支持表格/任务列表rehype-slug生成标题锚点，方便 TOC
代码块
代码块渲染会触发高亮组件加载。
如果高亮还没加载好，就先给一个基础 pre 样式，让读者不等。
图片
图片走统一组件处理，并默认 lazy/async，
让正文渲染不被图片阻塞。
我关心的不是“快”，而是“可控”
我不追求极限性能分数，但我希望：
- 首屏可控
- 渲染路径清晰
- 体验不会突然变慢
所以这次优化更像是一种“秩序”，而不是单纯的压缩与优化。
小结
这套策略的核心就是一句话：
能晚一点加载的，先晚一点加载；能按需加载的，就按需加载。
它更适合个人站点，也符合我的偏好。