MiniBlog v1.0 → v1.3.13 汇总 Changelog
对比 miniblog1.0里程碑.zip 与 miniblog1.3.13-清空失焦与双页footer联系我遮罩.zip
涵盖 2026-07-28 ~ 2026-07-29 全部改动（v1.1 ~ v1.3.13）
一、文件结构变化
| 操作 |
文件 |
说明 |
| 删除 |
.htaccess |
Apache 安全配置（禁止访问 .md/.json、documents 禁 PHP 执行、sitemap.xml 伪静态），不再依赖 |
| 新增 |
lib/articles.php |
文章缓存模块：扫描 documents 生成 cache.json，按 slug 匹配真实路径，首页/文章页/sitemap 三处复用 |
| 新增 |
public/contact.js |
"联系我"全屏遮罩共享脚本，首页与文章页分别引入 |
| 新增 |
CHANGELOG.md |
完整变更日志（v1.1 ~ v1.3.13 逐版记录） |
| 新增 |
Documents/PUT_YOUR_ARTICLE_HERE.txt |
空目录占位提示 |
| 未变 |
lib/Parsedown.php |
MD5 哈希完全一致，无改动 |
| 改动 |
article.php |
3,361 → 8,554 字节（+154%） |
| 改动 |
index.php |
2,411 → 5,751 字节（+139%） |
| 改动 |
sitemap.php |
1,690 → 1,573 字节（-7%，逻辑简化） |
| 改动 |
public/search.js |
457 → 3,314 字节（+626%） |
| 改动 |
public/style.css |
5,189 → 21,853 字节（+321%） |
| 改动 |
public/highlight.css |
224 → 1,953 字节（+771%） |
二、架构级变化
2.1 文章缓存系统（v1.3.1 引入）
- v1.0：首页每次请求都
glob('documents/*.md') 扫描目录；文章页直接拼 documents/{slug}.md 定位文件
- v1.3.13：新增
lib/articles.php，以"目录 + 各一级子目录 + 所有 .md 文件的最近修改时间最大值"作为签名 sig，生成站点根目录 cache.json；documents 变动时签名变化→自动重扫，平时直接读缓存
- 文章页按
?a=slug 在缓存 map 中匹配真实 path 与 assets，彻底去掉 ?cat= 参数依赖——搜索引擎已收录的不带 cat 的旧 URL 也能正确解析
2.2 文章分类（v1.3.0 引入）
- v1.0：无分类概念，仅扫描
documents/*.md 顶层文件
- v1.3.13：扫描
documents 一级子目录（排除 .assets）作为分类；桌面端左侧 sticky 吸顶栏 .cat-nav，移动端右上角"分类 ☰"按钮 + 右侧滑入浮层；分类切换为纯前端 filter（不重写 DOM），与搜索共用 applyFilter()；通过 history.replaceState 把 ?cat= 写入 URL
2.3 禁用开发缓存（v1.1.1+ 引入）
- v1.0：无 Cache-Control 头
- v1.3.13：首页与文章页均添加
Cache-Control: no-cache, must-revalidate, max-age=0（保留 bfcache，不丢失回退滚动位置）
三、逐文件详细差异
3.1 article.php
| # |
改动点 |
v1.0 |
v1.3.13 |
| 1 |
缓存模块 |
无 |
require lib/articles.php，按 slug 匹配缓存 map 中的 path/assets |
| 2 |
资源路径修正 |
基于 $slug 拼 documents/{slug}.assets/ |
基于缓存 $assets 路径，且空白字符转 %20（修复含空格 slug 图片不渲染） |
| 3 |
目录生成 |
DOMDocument + DOMXPath（会吞掉 <video>/<iframe>） |
preg_replace_callback 正则提取 h2/h3（保留原生标签） |
| 4 |
代码块行号 |
无 |
围栏代码块逐行包裹 <span class="line"><span class="ln">…</span></span> |
| 5 |
表格滚动容器 |
无 |
每个 <table> 自动包 <div class="table-wrap"> |
| 6 |
viewport |
width=device-width, initial-scale=1 |
增加 maximum-scale=1, user-scalable=no, viewport-fit=cover |
| 7 |
color-scheme |
无 |
<meta name="color-scheme" content="light dark"> |
| 8 |
header 状态 |
统一 .topbar |
文章页始终紧凑 .topbar-article |
| 9 |
返回链接 |
内联 style="font-weight:bold;" |
.back-link class + 智能返回 history.back()（来源是首页时触发 bfcache 恢复滚动） |
| 10 |
footer |
无 |
新增 <footer class="site-footer">（与首页一致） |
| 11 |
联系我遮罩 |
无 |
新增 .contact-overlay 全屏遮罩 HTML（居中 qrcode.png + ✕ 关闭） |
| 12 |
回到顶部 |
无 |
新增 #toTop 悬浮按钮 + SVG 上箭头（滚动 >400px 显示） |
| 13 |
F5 滚动恢复 |
无 |
history.scrollRestoration = 'manual'（F5 一律回顶部） |
| 14 |
目录点击外部收起 |
无 |
document 点击监听，点击目录浮窗外区域自动收起 |
| 15 |
引入脚本 |
无 |
<script src="public/contact.js"></script> |
| 16 |
CSS 版本号 |
style.css?v={mtime} |
保持（v1.0 已有） |
3.2 index.php
| # |
改动点 |
v1.0 |
v1.3.13 |
| 1 |
缓存模块 |
内联 glob('documents/*.md') |
require lib/articles.php，读 mbGetArticleCache() |
| 2 |
文章分类 |
无 |
扫描分类子目录，渲染 .cat-nav 导航（桌面端左栏 / 移动端浮层） |
| 3 |
布局结构 |
<main class="index-wrap"> 直接平铺 |
包入 .layout flex 容器（左栏分类导航 + 右栏内容） |
| 4 |
文章卡片 |
urlencode($a['title']) |
urlencode($a['slug'])，卡片加 data-cat 属性 |
| 5 |
搜索框 |
裸 <input> |
.search-wrap 包裹 + #searchClear × 清空按钮 |
| 6 |
viewport |
同 article.php v1.0 |
同 article.php v1.3.13 |
| 7 |
color-scheme |
无 |
同 article.php v1.3.13 |
| 8 |
highlight.css |
未引入 |
首页也加载语法高亮 |
| 9 |
footer |
内联样式 sitemap.xml 死链 |
.site-footer class + sitemap.php 正确链接 + "联系我"链接 |
| 10 |
联系我遮罩 |
无 |
同 article.php |
| 11 |
浮动搜索按钮 |
无 |
#searchFab + SVG 搜索图标（滚动 >400px 与 #toTop 同步出现） |
| 12 |
回到顶部 |
无 |
同 article.php |
| 13 |
沉浸式滚动 |
无 |
topbar 滚动 >40px 添加 .compact class |
| 14 |
scrollRestoration |
无 |
同 article.php |
| 15 |
浮动搜索行为 |
无 |
点击→平滑滚顶→350ms 后聚焦原位搜索框 |
| 16 |
引入脚本 |
仅 search.js |
search.js + contact.js + 内联滚动/搜索脚本 |
3.3 sitemap.php
| # |
改动点 |
v1.0 |
v1.3.13 |
| 1 |
文章来源 |
glob('documents/*.md') 仅顶层 |
复用 mbGetArticleCache() 全量文章（含分类） |
| 2 |
URL 格式 |
article.php?a={title} |
article.php?a={slug}（无 cat 参数） |
3.4 search.js
| # |
改动点 |
v1.0 |
v1.3.13 |
| 1 |
过滤逻辑 |
仅标题搜索 input→display:none/'' |
applyFilter() 统一函数：分类 ∩ 搜索关键字联合过滤 |
| 2 |
分类交互 |
无 |
分类点击→过滤+高亮+syncUrl()写入?cat=+移动端收起浮层 |
| 3 |
URL 同步 |
无 |
syncUrl() 把当前分类写入 URL（不刷新），首屏读 ?cat= 自动套用 |
| 4 |
清空按钮 |
无 |
toggleClear() 按输入内容切换显隐；点击清空+input.blur()失焦 |
| 5 |
分类浮层 |
无 |
开关 + 点击外部收起 |
3.5 style.css（从 5.2KB 扩展到 21.9KB）
新增模块：
- CSS 变量扩充：
--code-bg、--quote-border、--quote-bg、--table-stripe、--code-fg、--pre-radius、--hr-color 等
- color-scheme：
color-scheme: light dark（修复暗色模式表单闪烁）
- scrollbar-gutter：
stable（防筛选导致滚动条消失时布局抽动）
- View Transitions API：
@view-transition { navigation: auto }（跨页过渡）
- 沉浸式导航栏：毛玻璃
blur(16px) saturate(180%)、env(safe-area-inset-top) 刘海适配、.compact 收缩态、.topbar-article 文章页始终紧凑
- Markdown 渲染美化（全新）：标题层次与分割线、行内代码、引用块、表格（圆角+斑马纹+hover）、列表、分割线、图片/视频阴影、任务列表
- 代码块行号系统：
.line flex 布局 + counter(linenum) + min-height: 1.3em（统一序号行与折行间距）
- 表格滚动容器：
.table-wrap + min-width: max-content（窄表填满/宽表滚动）
- 分类导航：
.cat-nav / .cat-btn / .cat-close（与目录同形态）
- 搜索框清空按钮：
.search-wrap / .search-clear（display:block 修复 ✕ 垂直错位）
- 回到顶部 FAB：
.to-top 69px 圆形 + right: max(1.25rem, calc(50% - 550px)) 大屏对齐文章右缘
- 浮动搜索按钮：
.search-fab（位于 toTop 上方 85px）
- 页脚统一：
footer / .site-footer
- 联系我遮罩：
.contact-overlay / .contact-qr / .contact-close
- 字体栈扩充：PingFang SC / Hiragino Sans GB / Microsoft YaHei 等
- 响应式增强：768px / 480px 双断点细化（移动端导航栏、代码块、表格等独立调整）
3.6 highlight.css（从 224B 扩展到 1.9KB）
- v1.0：6 条规则，仅 light 模式基础 token
- v1.3.13：完整重写为 GitHub 风格 light/dark 双主题，覆盖 20+ token 类型（keyword、string、number、title、variable、type、tag、regexp 等），
@media (prefers-color-scheme: dark) 完整暗色配色
四、按功能维度汇总
4.1 新功能
- 文章分类系统（v1.3.0）：分类扫描 + 导航 + 前端 filter + URL 同步
- 文章缓存系统（v1.3.1）：
cache.json 签名失效策略，三处复用
- 回到顶部悬浮按钮（v1.2.0）：69px FAB，大屏对齐文章右缘，滚动 >400px 显示
- 浮动搜索按钮（v1.3.3 ~ v1.3.9）：滚动后浮现，点击滚顶+聚焦原位搜索框（经历了浮窗→遮罩→回退简化→最终定为滚顶激活原位框）
- 搜索框清空按钮（v1.3.11 ~ v1.3.13）：× 按钮，有文字时显示，点击清空+失焦
- "联系我"全屏遮罩（v1.3.13）：双页 footer 统一 + qrcode.png 弹窗 + Esc/点空白关闭
- 文章页 footer（v1.3.13）：与首页统一
.site-footer
4.2 Bug 修复
- DOMDocument 吞标签（v1.1.1）：改用正则提取目录，
<video>/<iframe> 不再丢失
- 暗色模式搜索框闪烁（v1.1.1）：
color-scheme: light dark
- 代码块幽灵空行（v1.1.4）：移除
</span></span> 后拼接的 \n
- 行号列宽溢出（v1.1.3）：
width 从 0.5em 改为 1.6em
- 移动端表格右侧空白（v1.1.7）：改用
.table-wrap 滚动容器包裹
- 含空格 slug 资源失效（v1.3.10）：空白字符转
%20
- F5 恢复滚动位置（v1.3.10）：
scrollRestoration = 'manual'
- 清空按钮垂直错位（v1.3.12）：
.search-box 加 display: block
- 收录 URL 404（v1.3.1）：去掉
?cat= 参数依赖，旧 URL 也能解析
- sitemap 死链（v1.3.1）：
sitemap.xml → sitemap.php，且收录分类文章
4.3 体验优化
- 沉浸式导航栏（v1.1）：毛玻璃 + safe-area + 滚动收缩
- 页面过渡（v1.1）：View Transitions API
- Markdown 渲染美化（v1.1 ~ v1.1.7）：代码块行号/行距、标题分割线、引用块、表格、图片阴影
- 移动端禁缩放（v1.3.2）：
maximum-scale=1, user-scalable=no
- 滚动条防抽动（v1.3.2）：
scrollbar-gutter: stable
- 智能返回（v1.1.1+）：来源是首页时
history.back() 触发 bfcache 恢复滚动
- 代码块超长行换行（v1.1.2）：
pre-wrap + overflow-wrap: anywhere
五、版本时间线
| 版本 |
日期 |
核心改动 |
| v1.0 |
— |
里程碑基线（8 文件，裸 PHP + 基础 CSS） |
| v1.1 |
07-28 |
沉浸式导航栏 + Markdown 渲染美化 + View Transitions |
| v1.1.1 |
07-28 |
移除 DOMDocument + color-scheme + 智能返回 + 目录点击外部收起 |
| v1.1.2 |
07-28 |
代码块行号 + 超长行换行 |
| v1.1.3 |
07-28 |
代码块行距收紧 + 行号列宽修正 |
| v1.1.4 |
07-28 |
修复代码块幽灵空行 |
| v1.1.5 |
07-28 |
H1 去分割线 + H2 分割线改文字宽度 |
| v1.1.6 |
07-28 |
H2 余量 + 移动端表格填充 |
| v1.1.7 |
07-28 |
表格滚动容器方案（彻底修复右侧空白） |
| v1.2.0 |
07-28 |
回到顶部 FAB |
| v1.2.1 |
07-28 |
FAB 放大 150% + 桌面端对齐文章右缘 |
| v1.3.0 |
07-28 |
文章分类系统 |
| v1.3.1 |
07-28 |
缓存系统 + 去除 cat 参数 + sitemap 修复 |
| v1.3.2 |
07-29 |
移动端禁缩放 + 滚动条防抽动 |
| v1.3.3 |
07-29 |
浮动搜索按钮 + 顶部搜索浮窗 |
| v1.3.4 |
07-29 |
搜索浮窗加遮罩 + 锚定原位框 |
| v1.3.5 |
07-29 |
去滚动绑定 + 遮罩仅误点取消 |
| v1.3.6 |
07-29 |
遮罩随框内字反转 + 浮窗移到底部 |
| v1.3.7 |
07-29 |
浮窗上移 5% + 有字时点击元素同时关浮窗 |
| v1.3.8 |
07-29 |
弹出浮窗自动激活输入框（rAF 延迟聚焦） |
| v1.3.9 |
07-29 |
回退：移除搜索浮窗/遮罩，改为滚顶激活原位框 |
| v1.3.10 |
07-29 |
修复含空格 slug 资源失效 + 关闭 F5 恢复滚动 |
| v1.3.11 |
07-29 |
搜索框清空按钮 × |
| v1.3.12 |
07-29 |
修正清空按钮 ✕ 垂直错位 |
| v1.3.13 |
07-29 |
清空按钮失焦 + 双页 footer + 联系我遮罩 |
六、统计概览
- 版本跨度：v1.0 → v1.3.13（24 个版本迭代）
- 时间跨度：2026-07-28 ~ 2026-07-29（2 天）
- 文件数：8 → 11（+3 新增，-1 删除）
- 总代码量：~63KB → ~46KB（PHP/JS/CSS，Parsedown 不变；核心代码从 ~14KB 增长到 ~46KB）
- 最大单文件增长：style.css +321%（5.2KB → 21.9KB）
