zqlit/blog

0 Fork 0

Files

T

- 删除20个优化相关文档
- 已整理到 docs/性能优化文档/ 文件夹
- 保留 README.md 和 archetypes/post.md

2026-06-03 13:37:53 +08:00

3.7 KiB

Raw Permalink Blame History

12-字体优化测试指南

创建日期： 2026-06-03
版本： v1.0
适用范围： 字体子集化优化测试

🧪 测试步骤

步骤1：重新构建Hugo

cd E:\GitHub\blog
hugo --cleanDestinationDir
hugo server -D

访问：http://localhost:1313

步骤2：检查字体加载

打开DevTools（F12）
切换到 Network 面板
刷新页面
筛选 woff2 或 woff

预期结果：

✅ 看到 zql-v2-subset.woff2 被加载
✅ 文件大小：~757KB（而不是1.2MB）
✅ 无404错误

步骤3：视觉检查

中文字符测试

导航菜单中文正常
文章标题中文正常
文章内容中文正常
深色模式下中文正常

英文字符测试

英文字母正常（A-Z, a-z）
数字正常（0-9）
常用符号正常（@#$%）

标点符号测试

中文标点正常（，。！？、；：""''）
英文标点正常（,.!?;:'"）
括号正常（（）【】《》）

不同页面测试

首页字体正常
文章详情页字体正常
友链页面字体正常
归档页面字体正常
移动端字体正常

步骤4：深色模式测试

点击头像或主题切换按钮
检查深色模式下：
- 所有文字正常显示
- 字体颜色正确
- 无闪烁或异常

📊 性能验证

Network面板数据记录

文件	优化前	优化后	减少
zql-v2.woff2	1.2MB	____KB	____%
zql-v2.woff	1.2MB	____KB	____%
总字体大小	2.4MB	____KB	____%

Lighthouse测试（可选）

使用Chrome DevTools的Lighthouse面板测试

预期指标：

Performance得分：75-85
无字体相关警告
FCP：改善20-30%

🔍 验证子集化效果

检查字符覆盖

你的子集字体包含 2,485个字符，包括：

基本字符：

✅ 英文字母（A-Z, a-z）
✅ 数字（0-9）
✅ 常用标点符号

中文字符：

✅ 常用汉字（根据网站内容提取）
✅ 中文标点符号
✅ CJK符号

🐛 故障排除

问题1：字符显示为方块（□）

解决方案A：重新运行子集化

python scripts/subset-font-safe.py

解决方案B：保留原始字体作为fallback

@font-face {
    font-family: 'zql';
    src: url('../font/zql-v2-subset.woff2') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'zql-full';
    src: url('../font/zql-v2.woff2') format('woff2');
    font-display: swap;
}

body {
    font-family: 'zql', 'zql-full', serif;
}

问题2：字体文件404错误

解决方案：

确认文件存在：ls themes/Ying/static/font/zql-v2-subset.*
检查CSS路径是否正确
清理Hugo缓存：hugo --cleanDestinationDir

🔄 回滚方案

如果优化后出现问题

# 恢复原始字体
cp themes/Ying/static/font/zql-v2.woff2.backup themes/Ying/static/font/zql-v2.woff2
cp themes/Ying/static/font/zql-v2.woff.backup themes/Ying/static/font/zql-v2.woff

# 恢复CSS
git checkout themes/Ying/assets/css/main.css

✅ 测试通过标准

功能标准（必须全部通过）

✅ 所有页面正常显示
✅ 中文字符正常（常用汉字、标点）
✅ 英文字符正常（字母、数字、符号）
✅ 深色模式正常
✅ 响应式布局正常
✅ 无Console错误

性能标准（至少达到一项）

✅ 字体大小减少30%+（1.2MB → 757KB ✅ 已达成）
✅ 加载时间减少20%+
✅ Lighthouse无字体警告

字体优化测试指南完成！ 🎉

测试通过后即可提交代码！

3.7 KiB Raw Permalink Blame History Unescape Escape