更新日志 | Isdert's Blog

🤖 提示：本篇更新日志由 AI 编程助手 Antigravity 整理生成，记录了近期博客在性能调优、排版布局、阅读体验以及内容归档等方面的完整系统升级。

全站图片极速瘦身：
- 对全站所有图片进行高画质智能保真压缩，总体积从接近 20MB 降至 1.66MB（缩减 91.7%）。
- 最大尺寸约束为 1600px，全量开启 Progressive JPEG 渐进式多轮扫描渲染，显著改善 Cloudflare CDN 访问速度。
现代化懒加载引擎重构：
- 彻底停用依赖 scroll 事件与 500ms 防抖停滞的旧版插件，改用浏览器底层驱动的 IntersectionObserver 原生异步监听，实现 0ms 滚动检测。
- 配置 rootMargin: '350px' 提前预载机制，图片进入屏幕前 350px 即静默下载，滑动即见。
Frame 专属微光骨架屏 (Shimmer)：
- 弃用生硬的静态占位符，定制契合 Frame 主题暖色纸感（#F8F6F0 至 #EDE8DC）的流动呼吸微光。
- 图片数据就绪后通过 0.45s 平滑贝塞尔淡入呈现，杜绝内容闪烁与生硬跳出。

竖屏手机截图自适应约束：
- 解决正文 width: 100% 导致 9:20 竖屏长图纵向膨胀至 1500px+ 霸占多屏的排版问题。
- 自动识别长宽比，将竖屏截图统一约束在 520px 限高 范围内，并赋予 14px 手机仿真圆角、轻量边框与悬浮拟物阴影。
多图展台栅格 (.phone-grid)：
- 引入手机三联屏多列展示布局，多张截图在桌面端整齐并列排布，移动端自适应折叠为单列。

双重交互入口：
- 头部元信息栏：在文章标题与发布日期旁增设「双栏模式」切换按钮。
- 悬浮操作胶囊 (Float Action Dock)：页面向下滚动超过 240px 后，右下角平滑浮现协同快捷栏，包含 [ ⬆ 顶部 ] 与 [ ◫ 双栏模式 ]。
报刊级排版效果：
- 切换双栏时，阅读容器展开至 1180px 宽屏视野，正文拆分为左右两栏对齐排版，中间附带 1px 细线分隔；一级/二级标题自动通栏跨列，代码块与长图防截断。
柔和溶解微动效 (Soft Dissolve & Bloom)：
- 规避浏览器重排两栏断点时的文字剧烈跳动，切换时正文快速淡出遮蔽重排（120ms），排版就绪后轻盈回弹绽放（220ms）。
阅读位置动态智能锚定：
- 自动计算读者视口所处的相对阅读百分比，切换单/双栏后自动平滑对齐视线，杜绝高度折半导致的跳视。
状态持久化：
- 用户的阅读栏数偏好实时保存在 localStorage 中，全站文章无缝延续。

归档页双栏选项卡 (/archives/)：
- [ 文章列表 ]：默认仅展示未过时的活跃博文，主线内容保持清晰整洁。
- [ 已归档 ]：分流收录早期已停止维护、版本过旧的技术文章与项目（如《基于flutter开发的课程表应用》）。
- 支持 /archives/#archived 锚点直达。
极简书卷手记风格：
- 去除厚重卡片与弹窗色块，回归 Frame 主题标志性的左侧细标线与浅灰提示文字。
文章内页防误导提示：
- 访问归档博文时，标题下方轻量嵌入纸质邮戳样式的状态栏与归档原因，提供返回归档列表的快速入口。
便捷文章标记：
- 在文章 Front-Matter 中声明 archived: true 与 archive_reason 即可一键归档。