简要介绍 Lighthouse 是一个网站质量测评工具，它是由 Google 开源的一个自动化工具，内嵌在 Chrome 开发者工具里面。它能够对 PWA 或网页多维度的效果指标进行审计，并给出对应缺陷的修复意见和一些最佳实践的调整建议，以帮助开发者改进网站的整体质量，包括但不限于：[^1] 性能：如内存占用，CPU/GPU 使用率，Worker 线程调度等 响应：加载速度，资源缓存等 安全性：CSP，SSL 等 易使用性：页面色彩对比度，图标大小，元素间隔，残障用户操作友好等 SEO: 搜索引擎优化 测评完成后，它会生成一个有关页面性能的报告。通过该报告，我们就可以知道需要采取哪些措施来改进应用的性能和体验。就像 TDD 测试驱动开发一样，根据反馈，红黄或绿，调整策略，优胜劣汰，迭代优化，臻於至善。[^2] [...]
问题背景 昨天在写为什么这么设计系列文章时，心血来潮在 , , 等标题标签中加上了色彩鲜明的 Emoji，增强标题区的对比度。 写作时——开两个窗口，边撰写边实时预览——一切都正常显示，但是一经发布，在电脑端的 Chrome 浏览器中就发现了个诡异现象，正文和目录中的表情显示正常，但是在标题中渲染成了一副傻大黑粗的模样🌑，五颜六色，惨遭剥离，独留黑白，茕茕孑立，形影相吊，不忍直视。 [...]