Lighthouse 是一款网站审核工具,可帮助开发者发掘机会和进行诊断,从而改善网站的用户体验。
Lighthouse 9.0 可立即通过命令行、Chrome Canary 和 PageSpeed Insights 使用。它将在 Chrome 98 中纳入 Chrome 稳定版。
API 变更
在此版本中,大多数用户应该不会遇到任何破坏工作流程的破坏性更改。如果您运行自定义 Lighthouse 审核或使用依赖于 Lighthouse 报告 JSON 深层详细信息的工具,则可能需要注意 9.0 中的一些破坏性更改。
如需查看完整的更改列表,请参阅 9.0 更新日志。
适用于用户流的 Lighthouse
Lighthouse 提供新的用户流 API,可让您在页面生命周期中的任何时间点进行实验室测试。
Puppeteer 用于为网页加载编写脚本并触发合成用户互动,并且可以多种方式调用 Lighthouse,以便在这些互动期间捕获关键的数据分析。也就是说,您可以在网页加载期间和与网页互动期间衡量效果。
如需了解详情,请参阅 Lighthouse 用户流教程和代码示例。
报告刷新
我们更新了 Lighthouse 报告,以提升可读性,使报告的来源及其运行方式更清晰。
我们已在报告顶部嵌入了最终屏幕截图,以一目了然地看出测试网页能否正确加载且采用了预期的格式。
报告底部的摘要信息也经过重新设计,以便更好地说明 Lighthouse 的运行方式和报告收集方式。
要查看新报告的实际应用,请试用 Lighthouse 9.0 或访问此示例报告。
相关的无障碍功能元素
常见的无障碍功能问题是,页面中本应具有唯一性的内容却不一致,例如,aria-labelledby
属性中引用的 ID 用于多个元素。
Lighthouse 一直针对这种情况发出警告,但只会列出具有重复 ID 的元素的第一个实例,这往往会造成混淆,因为有些用户会认为它显示了导致出现问题的所有元素。由于 Lighthouse 仅显示一个元素,因此他们会假设这是一个错误,导致单个元素被标记为重复项。
在 Lighthouse 9.0 中,现在会列出共用该 ID 的所有元素:
这个“相关节点”功能由 axe-core
提供,因此可能也会出现在其他无障碍功能审核中。
如需了解详情,请参阅收集用户报告时遇到的问题和实现拉取请求。
正在运行的 Lighthouse
Lighthouse 可在 Chrome 开发者工具、npm(作为 Node 模块和 CLI)以及浏览器扩展程序(在 Chrome 和 Firefox 中)中使用。Google 为许多 Google 服务(包括 web.dev/measure 和 PageSpeed Insights)提供支持。
如需试用 Lighthouse Node CLI,请使用以下命令:
npm install -g lighthouse
lighthouse https://www.example.com --view
与 Lighthouse 团队联系
如要讨论新功能、9.0 版本中的更改或与 Lighthouse 相关的任何其他内容,请执行以下操作:
- 在 Lighthouse GitHub 问题跟踪器中报告问题或提交反馈。
- 在 Lighthouse GitHub 论坛中提问。
- 请在 Twitter 上与 Lighthouse 团队联系:@____lighthouse。