Lighthouse 与已移除的 PWA 类别

Lighthouse 是 Chrome 的开源审计工具，可从 DevTools、命令行、Node 模块或 PageSpeed Insights 运行，按 Performance、Accessibility、Best Practices 与 SEO 给 URL 打分。它不再有 PWA 类别：2024 年 5 月随 Chrome 126 发布的 Lighthouse 12.0 移除了它，因为那些检查复述的是 Chrome 的可安装性标准，而 Chrome 已经放宽了这些标准，该类别衡量的东西浏览器不再执行。

工作原理

Lighthouse 在受控的 Chrome 实例中加载页面，施加模拟节流，并运行按类别分组的审计；每个类别的得分是其审计项的加权和（Lighthouse overview，developer.chrome.com）。DevTools 面板运行随该版 Chrome 捆绑的版本；CLI 和 Node 模块需要本机 Chrome，并允许 CI 固定版本。

PWA 类别为何消失

PWA 审计项（可安装的 manifest、带 fetch 处理函数的 Service Worker、启动画面、主题色地址栏、离线的起始 URL）是 Chrome 安装提示要求的翻版。Chrome 在 Android 108 和桌面 112 中取消了菜单安装对 fetch 处理函数的要求（Update on the installability criteria，developer.chrome.com），此时这些审计检查的是浏览器已不再适用的规则。Lighthouse 团队在 issue 15535 中跟踪移除并在 12.0 发布：类别、manifest 和 Service Worker 的采集器，以及 JSON 输出中的 pwa 键都已消失（Remove PWA Category，github.com）。PageSpeed Insights 及其 API 于 2024-05-10 切换到 12.0，带来同样的破坏性变更。

用什么替代

可安装性由浏览器在运行时检查，信号可以直接观察：Chromium 中的 beforeinstallprompt 事件、DevTools 的 Manifest 面板及其可安装性错误，以及浏览器自己的安装菜单项。离线能力的测试方法是在 Application > Service workers 面板勾选 Offline 后重新加载。这些都不产生分数，而这正是重点：PWA 要么在该平台上能安装，要么不能。

运行平台

DevTools 面板存在于 Chrome 和其他 Chromium 浏览器中，CLI 与 Node 模块通过 DevTools 协议驱动本机 Chrome，所以 Lighthouse 审计的是 Chrome 眼中的页面；没有 Firefox 或 Safari 的运行。PageSpeed Insights 在 Google 的服务器上运行同一引擎，并在源流量足够时加入 CrUX 现场数据。

其余类别对 PWA 说明了什么

Performance 测量实验室加载，对重复访问的 PWA 而言主要取决于 Service Worker 的缓存策略；Lighthouse 以冷配置运行，除非配置成热运行，报告的是首次访问的数字。Best Practices 包含 HTTPS，而 Service Worker 需要它。Accessibility 与 SEO 不受安装影响。

示例

一个示例在 CI 中固定工具版本；另一个替代工具不再运行的那项审计。

在 CI 中以固定版本运行 CLI

固定包版本，这样 Lighthouse 升级（它会改变评分）不会单凭自身弄红构建。JSON 输出不再有 categories.pwa 键；读取它的脚本得到 undefined。

npm install --save-dev lighthouse@12
npx lighthouse https://example.com --output=json --output-path=./report.json --only-categories=performance,best-practices
node -e "const r=require('./report.json'); console.log(r.categories.performance.score, r.categories.pwa)"

最后一行打印一个 0 到 1 之间的性能得分，以及 pwa 的 undefined，这是确认流水线运行的是哪个大版本的最快方法。

改在运行时检查可安装性

Chromium 判定页面可安装时触发 beforeinstallprompt。处理函数显示安装控件并把提示推迟到点击；它不触发不算失败，因为 Safari 和 Firefox 没有实现该事件（BCD api.Window.beforeinstallprompt_event）。

let deferredPrompt = null;
const installButton = document.querySelector('#install');

if ('onbeforeinstallprompt' in window) {
  window.addEventListener('beforeinstallprompt', (event) => {
    event.preventDefault();
    deferredPrompt = event;
    installButton.hidden = false;
  });
  installButton.addEventListener('click', async () => {
    await deferredPrompt?.prompt();
    deferredPrompt = null;
    installButton.hidden = true;
  });
} else {
  installButton.hidden = true; // 该引擎没有此事件：浏览器提供自己的安装界面
}

默认隐藏按钮可以避免 Firefox 和 Safari 用户看到一个什么都不做的控件；完整流程见安装提示。

实测

Chrome 126 及之后版本的 Chrome DevTools Lighthouse 面板列出四个类别复选框：Performance、Accessibility、Best practices 与 SEO，而 Chrome 125 还显示 Progressive Web App；面板捆绑的版本报告为 Lighthouse 12.0.0（What’s New in DevTools (Chrome 126)，developer.chrome.com）。12.x CLI 的 JSON 报告在 categories 下有四个键：performance、accessibility、best-practices 与 seo，categories.pwa 读作 undefined，这就是 PageSpeed Insights 为 2024-05-10 切换到 12.0 所公告的破坏性变更。

另请参阅

• Lighthouse overview（developer.chrome.com）
• Update on the installability criteria（developer.chrome.com）
• Remove PWA Category (GoogleChrome/lighthouse issue 15535)（github.com）
• 可安装性标准
• 安装提示
• Core Web Vitals（LCP、INP 与 CLS）

规范

规范	状态
无。