外观
3.1 指标采集
约 668 字
性能指标
本页对应「三、操作步骤」的 3.1,完成固定页面在固定环境下的性能采样,得到可对比的指标数据与原始报告。返回上级:性能检测。
前置条件
- 已确定采集清单:首页
https://cdn.example.com/、一个列表页、一个内容页,共 3 个 URL。 - 机器已安装 Node.js,可通过
npx调用 Lighthouse;浏览器为 Chrome 且版本记录在案。 - 采集期间不使用代理,出口 IP 与上次采集一致。
- 已确认采集清单与上次一致,页面集合没有增删。
- 机器的电源模式已固定为高性能,节能模式会限制 CPU 并拉高 TBT。
操作步骤
- 建立结果目录,避免多次采集互相覆盖:
mkdir -p /srv/axis/metrics/2026-02-10
node -v && npx lighthouse --version- 对首个页面执行采集,固定类别与输出路径,关闭无关类别以缩短耗时:
npx lighthouse "https://cdn.example.com/" \
--only-categories=performance,accessibility \
--preset=desktop \
--output=json \
--output-path=/srv/axis/metrics/2026-02-10/home.json \
--chrome-flags="--headless --no-sandbox"- 对同一页面连续采集 3 次,文件名加序号,用于判断波动:
for i in 1 2 3; do
npx lighthouse "https://cdn.example.com/" \
--only-categories=performance --preset=desktop \
--output=json \
--output-path="/srv/axis/metrics/2026-02-10/home-$i.json" \
--chrome-flags="--headless --no-sandbox" --quiet
done- 提取核心指标,写入汇总表:
for f in /srv/axis/metrics/2026-02-10/home-*.json; do
jq -r --arg f "$f" '[ $f,
(.audits["largest-contentful-paint"].numericValue|tostring),
(.audits["cumulative-layout-shift"].numericValue|tostring),
(.audits["total-blocking-time"].numericValue|tostring) ] | @tsv' "$f"
done结果确认
- 每个页面得到 3 份 JSON,文件大小不为 0,
jq能正常解析。 - LCP、CLS、TBT 三项均有数值,未出现
null。 - 同页 3 次的 LCP 差异不超过 15%,中位数可作为该页基线。
- 汇总表已记录采集时间、浏览器版本、设备类型与出口 IP。
注意事项
- 移动端采集需另跑一轮,加上
--preset=mobile或对应的设备模拟参数,不要与桌面端混算。 - 采集时不要同时执行构建、下载或视频,这类任务会显著拉高 TBT。
- JSON 报告保留原始文件,后续复核需要回到原始审计项而不是汇总数字。
- 每轮采集记录浏览器版本与设备参数,浏览器升级后同一页面的数值会变化,跨版本对比要在报告中注明。
- 采集顺序固定为先首页后内页,避免前一页的缓存与连接复用影响后一页的首次加载数据。
- 报告目录按日期分目录存放,文件名保持
页面-序号.json,便于脚本批量提取与回溯。