一、PageSpeed Insights
PageSpeed Insights 能够针对移动设备和桌面设备生成网页的实际性能报告，并能够提供关于如何改进相应网页的建议。
在线工具：https://developers.google.cn/speed/pagespeed/insights/
二、Chrome 开发者工具
Chrome 开发者工具是一套内置于Google Chrome中的Web开发和调试工具，可用来对网站进行迭代、调试和分析。
使用文档：https://developers.google.cn/web/tools/chrome-devtools/
三、使用 Lighthouse 审查网络应用
Lighthouse 是一个开源的自动化工具，用于改进网络应用的质量。 您可以将其作为一个 Chrome 扩展程序运行，或从命令行运行。 您为 Lighthouse 提供一个您要审查的网址，它将针对此页面运行一连串的测试，然后生成一个有关页面性能的报告。
使用文档：https://developers.google.cn/web/tools/lighthouse/
四、Putteteer
您可以在浏览器中手动执行的大多数操作都可以使用Puppeteer完成！以下是一些可以帮助您入门的示例：
- 生成页面的屏幕截图和PDF。
- 抓取SPA并生成预渲染内容（即“SSR”）。
- 自动化表单提交，UI测试，键盘输入等。
- 创建最新的自动化测试环境。使用最新的JavaScript和浏览器功能直接在最新版本的Chrome中运行测试。
- 捕获站点的时间线跟踪，以帮助诊断性能问题。
- 测试Chrome扩展程序。
使用文档：https://developers.google.cn/web/tools/puppeteer/
五、Workbox
JavaScript库，用于为Web应用程序添加离线支持，Workbox是一组库和节点模块，可以轻松缓存资产并充分利用用于构建Progressive Web Apps的功能。
为何选择Workbox？
Workbox是一个库，它结合了一组最佳实践，并删除了每个开发人员在与服务工作者一起工作时编写的样板文件。
- 预缓存
- 运行时缓存
- 策略
- 请求路由
- 背景同步
- 有用的调试
- 比sw-precache和sw-toolbox具有更大的灵活性和功能集
使用文档：https://developers.google.cn/web/tools/workbox/