做网页性能优化时，最怕的是“测不准、复现难、改完又回退”。下面这份清单把常用工具按“审计打分（找方向）—瀑布图与请求分析（找原因）—长期监控与告警（防回退）”串起来，适合设计/前端/产品一起用一套指标把体验问题讲清楚。
工具地址：https://developer.chrome.com/docs/lighthouse/overview/
免费商用：Chrome/CLI 自动化审计，适合做性能基线与回归对比，报告可直接落到 LCP/CLS/INP 等关键指标与建议项。
工具地址：https://pagespeed.web.dev/
免费商用：把 Lighthouse 实验室数据与 CrUX 真实用户数据放在同一页，适合快速判断“是本地问题还是线上真实慢”。
工具地址：https://developer.chrome.com/docs/crux/
免费商用：以来源维度查看真实用户体验（Core Web Vitals 分布），适合做站点级体验健康度跟踪与竞品对比。
工具地址：https://www.webpagetest.org/
需看协议：多地域/多设备测速 + 瀑布图 + 关键渲染路径分析，排查首屏慢、第三方脚本拖慢、资源优先级问题非常直观。
需看协议：快速生成性能报告与瀑布图，适合把主要问题点（请求数、缓存、图片、JS 体积）整理成可执行清单。
工具地址：https://tools.pingdom.com/
需看协议：一键测速 + 请求瀑布，适合做“改前/改后”对比截图，帮助和非技术同事对齐问题位置。
工具地址：https://www.debugbear.com/
需看协议：把 Lighthouse 跑成持续监控，支持定时测试、趋势图与告警，适合做性能回归预警与版本发布前检查。
需看协议：性能监控 + RUM（真实用户监控）一体化，适合把体验指标和业务节点（转化、跳出）一起看，做可解释的优化优先级。
需看协议：可配置的性能预算（Performance Budget）与团队协作工作流，适合把“性能红线”落进 CI/发布流程。
免费商用：从 DOM 复杂度、JS 事件、第三方与图片等角度做“页面健康检查”，适合抓出结构性问题（不是单个资源慢）。
工具地址：https://www.sitespeed.io/
免费商用：开源的性能测试与报告工具，可自建跑多页面、出趋势报告，适合有自动化与自托管需求的团队。
工具地址：https://github.com/GoogleChrome/lighthouse-ci
免费商用：把 Lighthouse 集成进 CI，针对分支/PR 做分数与关键指标对比，适合在合并前拦住明显的性能回退。
