定義
Web パフォーマンスを計測していると複数の数値が出てくるが、「この数値が一体何を表す値なのか」を見分けることがこの記事のテーマだ。異なる計測を同じものと勘違いすると、見当違いの場所を最適化してしまう。
見分けるべき三つ:
- Lighthouse Performance スコア(0–100): Google のパフォーマンス計測ツール Lighthouse が複数の指標を一つに合成して付ける総合スコア。
- カテゴリ audit(A11y/SEO/BP): 同じ Lighthouse が付けるアクセシビリティ(A11y)・検索最適化(SEO)・ベストプラクティス(Best Practices)スコア。パフォーマンスとは別項目だ。
- Chrome Performance trace の LCP・CLS: ブラウザの開発者ツールでページを一度記録(trace)したときに出る生の計測値。LCP(Largest Contentful Paint — 最も大きなコンテンツが画面に描画されるまでの時間、ms)と CLS(Cumulative Layout Shift — 画面がどれだけずれたかの度合い、無次元)を実際のミリ秒・数値で示す。
この三つはツールも集計方式も異なるため、1:1 で対応しない。
なぜ必要か
問題の状況: 「audit で SEO 100点」と「trace で LCP 900ms」をひとまとめに「パフォーマンス良好」と読むと、最適化の優先順位がずれる。SEO スコアが高くても実際のロードは遅いことがあるからだ。
原理的に異なるからだ。Performance スコアは、LCP・CLS・TBT(Total Blocking Time — メインスレッドが入力に応答できず塞がっていた合計時間)・FCP(First Contentful Paint — 最初のコンテンツが描画された時点)・SI(Speed Index — 画面がどれだけ速く埋まったか)といった複数の指標を重み付きで合成した、ラボ(lab — 制御された環境で一台の機器で再現する計測)スコアだ。一方 trace の ms 値は**その一度のページ遷移(navigation)**で観測した単一の値だ。
さらに、環境(開発用 dev ビルドか実 production ビルドか、ネットワーク速度を人為的に落とす throttle の有無、キャッシュなしの初回実行 cold start か)を固定しないと、同じコードでも正反対の結論が出る。だから「何を測る数値か + どんな環境で測った数値か」を常に併せて見る必要がある。
動作原理
| 計測 | 単位 | 意味 |
|---|---|---|
| Trace LCP/CLS/TTFB | ms / 無次元 | 今回の reload の lab CWV |
| Lighthouse Performance | 0–100 | 複数メトリクスの log-normal mapping 後の加重平均 |
| Lighthouse A11y/SEO/BP | 0–100 | 該当カテゴリ audit ルールの合格率 |
LCP ms を減らしても TBT が悪ければ Performance スコアに上限が生じることがある。逆に SEO 100 でも LCP ms は別途見る必要がある。
比較ルール:
- 同一 URL・同一 auth・同一 build・同一 throttle を固定。
- 単一 trace 禁止 — lab-performance-measurement-variance のように N 回の median。
- dev median と production median の絶対値比較禁止 — 環境ごとの before/after のみ。
実務適用
- 開発中: Chrome Performance trace reload → LCP/CLS/TTFB ms、3× median。
- カテゴリ回帰: Lighthouse A11y/SEO/BP audit。
- リリースゲート:
build && start後に同一プロトコル。 - headline に outlier run を記録しない。
トレードオフ
| 選択 | 利得 | コスト |
|---|---|---|
| trace ms 中心 | 実装 iteration に敏感 | Lighthouse スコアと直感が不一致になりうる |
| Lighthouse Performance のみ | 単一の数値 | LCP ms の原因分解が難しい |
| RUM(field) | 実ユーザー分布 | lab 再現・デバッグとは別 |
使ってはいけない場合
- SEO audit スコアだけで LCP SLA 達成を主張する場合。
- dev cold run 一つで production パフォーマンスを代表すると言う場合。
よくある間違い
- 「Lighthouse 100 = LCP 最高」(カテゴリに Performance が含まれないこともある)。
- LCP ms だけ改善したのに Performance スコアが上がらない理由を TBT/CLS 未確認。
- 異なる build・auth 状態の trace を一つのタイムラインに並べて悪化/改善を断定。
関連概念
- lab-performance-measurement-variance — N 回の median・outlier
- largest-contentful-paint — LCP の構成・改善
- critical-rendering-path — TTFB・render パイプライン