您可能听说过渐进式 Web 应用 (PWA) 技术可以为您的网站带来诸多好处。您可能会想在不改进网站性能基础的情况下添加 PWA 功能。但无论 PWA 功能有多强大，都无法解决 JavaScript 阻塞和图片过大的问题。
相反，您首先需要进行网站审核，客观地评估哪些方面效果良好，哪些方面有待改进。
审核网站或应用有助于您打造稳定且高性能的体验。 此外，还要突出显示只需少量审批即可实现的“速赢”目标。审核可为数据驱动型开发奠定基础。某项更改是否改善了情况？您的网站与竞争对手相比如何？您可以获得用于确定工作优先级的指标，并在改进后获得可用于炫耀的具体证据。
只有 5 分钟
在首页上运行 Lighthouse 并保存报告数据。您将获得量化的基准和待办事项列表，其中包含有关如何改进性能、无障碍功能、安全性和 SEO 的建议。
只有 30 分钟
Lighthouse 可能仍然是最好的起点，但如果有更多时间，您还可以记录其他工具的结果：
- Chrome 开发者工具的“安全”面板：HTTPS 使用情况。
- Chrome 开发者工具“网络请求”面板：加载时间；HTML、CSS、JavaScript、图片、字体和其他文件所占的资源大小和请求数量。
- Chrome 任务管理器：如果您的网站经常使用大量 CPU 或比其他应用更多的内存，您可能需要修复内存泄漏、任务运行或资源加载问题。
- WebPagetest：缓存、首字节时间、CDN 使用情况。
- PageSpeed Insights：加载性能、数据费用和资源使用情况，包括 Chrome 用户体验报告数据，其中突出显示了实际性能统计信息。
请务必以初次访问者的身份测试您的网站。在无痕式（私密）窗口中打开该网站，或使用浏览器工具停用缓存并清除存储空间。这样可确保从网络而非本地缓存中检索每个资源，从而准确了解首次加载性能。
没有什么比实际测试更有效。请务必在具有代表性的用户设备和网络连接上测试您的网站，并记录您的主观体验。
如果您对工具感到困惑
请参阅我们的指南：如何考虑速度工具。
如果其他方法都无效，请使用 Lighthouse 检查以下内容：
- HTTPS：每个网站都应通过 HTTPS 传送所有资源。
- 服务器设置：您的 Web 服务器或 CDN 应正确使用压缩、使用 HTTP/2，并包含适当的标头，以使浏览器能够缓存资源。
- 可以移至网页底部或具有 async 或 defer 属性的脚本元素。
- 可以移除的 JavaScript 和库。
- 未使用的代码，例如 CSS 和 JavaScript 库。
- 可缩减的图片像素大小。
- 可减小图片大小的文件格式更改，例如将 PNG 更改为 JPG。
受众群体、利益相关方、背景
重构的优先级取决于您的受众群体、内容和功能。 谁在访问您的网站？他们为何使用该功能？以及如何使用？您的性能预算是多少？
您的利益相关方是谁？他们的优先事项是什么？这会影响您构建、呈现和分享审核数据的方式。
如果您无法审核整个网站，请查看网页分析，了解应重点关注哪些方面。高跳出率、低网页停留时间和意外的退出网页可以很好地指示从何处开始着手。同样，业务指标（例如托管费用、广告点击次数和转化次数）也是如此。从利益相关者那里大致了解他们认为哪些数据重要。
测试、记录、修复、重复
记录网站在进行任何更改之前的状态，以便发现问题并为改进或回归设置起点。这样一来，您就可以获得数据来证明和奖励开发工作。
测试您网站内的多种网页类型。对于单页应用，请测试组件、路由和用户体验流程，而不仅仅是首次加载体验。