用途:提供 Core Web Vitals 的测量、诊断与改进参考,围绕 LCP、INP、CLS 三项指标对照 Google 阈值评估页面表现。
主要能力:三项稳定 Core Web Vitals 均在真实页面加载的第 75 百分位测量,并区分移动端与桌面端。LCP 衡量加载,Good ≤ 2.5 s、Needs Improvement 2.5–4.0 s、Poor > 4.0 s;INP 衡量交互,Good ≤ 200 ms、200–500 ms、Poor > 500 ms;CLS 衡量视觉稳定性,Good ≤ 0.1、0.1–0.25、Poor > 0.25。三者全部达到 Good 才通过。诊断指标包括 FCP、TTFB、TBT。资料还提供工具矩阵(CrUX、PageSpeed Insights、Search Console CWV、DevTools、Lighthouse)、指标生命周期说明(INP 于 2024 年 3 月取代 FID),以及各指标对应的参考文件读取时机。
使用方式:安装 web-vitals 库后调用 onCLS、onINP、onLCP,回调参数为 { name, value, rating, delta, id, navigationType },rating 为 good、needs-improvement 或 poor;该库处理 bfcache、预渲染、iframe 聚合等边缘情况。也可用 scripts/visualize.py 生成可视化报告,支持手动指标值或 Lighthouse JSON 输入,仅需 Python 3 标准库。命令示例:npm install web-vitals;python3 SCRIPT_PATH/visualize.py --lcp 2.1 --inp 180 --cls 0.05 --url https://example.com;python3 SCRIPT_PATH/visualize.py --lighthouse lighthouse-report.json;python3 SCRIPT_PATH/visualize.py --lcp 3.8 --inp 420 --cls 0.12 --output cwv-report.html --no-open。脚本路径随安装范围不同,需用 find 或 ls 定位。
适用场景:需要对照阈值评估页面性能、排查慢加载或交互延迟、分析布局偏移,以及搭建字段监控或生成报告时使用。
限制:Lighthouse 以 TBT 作为 INP 的实验室代理,不能替代字段测量;TBT 与 INP 相关但不等同。稳定指标变更按年度节奏并提前通知。其余功能、收费或平台信息暂未提供。