Lighthouse 3.0 がリリースされました。3.0 では、監査の高速化、ばらつきの軽減、新しいレポート UI、新しい監査などの機能が追加されました。
3.0 に更新する方法
- CLI。
npm install -g lighthouse@nextを実行します。 - ノード:
npm install lighthouse@nextを実行します。 - Chrome 拡張機能。拡張機能は 3.0 に自動更新されます。
- Chrome DevTools。Lighthouse 3.0 は Chrome 69 で利用可能になります。
監査の迅速化と分散の軽減
Lighthouse 3.0 では、いくつかの変更点により、監査がより迅速に完了し、実行間のばらつきが少なくなります。
- スロットリングのシミュレート。実際、Lighthouse では実際に監査を実施する前にページの調整が行われていました。Lighthouse では、「Lantern」というコードネームの新しい内部監査エンジンが使用されました。このエンジンは、通常のネットワークと CPU の設定で監査を実行し、モバイル環境でのページ読み込みにかかる時間を推定します。
- 待ち時間の短縮。Lighthouse では、ページの読み込みが完了したかどうかを判断するため、ネットワークと CPU でアクティビティが発生しなくなるまで待機する必要があります。この待機時間は v3 では短縮されています。
新しいレポート UI
Lighthouse 3.0 では、Lighthouse チームと Chrome UX（リサーチ &デザイン）チームの連携により、レポート UI が一新されました。
呼び出しの変更
Node バージョンの Lighthouse で CLI バージョンと同じ構成オプションがサポートされるようになりました。 v2 での Node Lighthouse モジュールの構成方法によっては、互換性を破る変更になる可能性があります。詳細については、呼び出しの変更をご覧ください。
スコアの変更
Lighthouse 3.0 では、パフォーマンス監査のスコアリング モデルが変更されました。スコア 50 は 75 パーセンタイルを表し、完全スコア 100 は 98 パーセンタイル（収益が減少したポイント）を表します。
パフォーマンス スコアは、パフォーマンス監査の加重平均です。v3 では、監査の重み付けも変更されています。
| 監査名 | v2 の重み付け | v3 の重み付け |
|---|---|---|
| First Contentful Paint（バージョン 3 の新機能） | なし | 3 |
| First Meaningful Paint | 5 | 1 |
| 最初の CPU アイドル状態（v2 で最初のインタラクティブ） | 5 | 3 |
| 操作可能になるまでの時間（v2 では一貫して操作可能） | 5 | 5 |
| 知覚速度指数 | 1 | なし |
| 速度指数 | なし | 4 |
| 推定入力レイテンシ | 1 | 0 |
今後、Lighthouse v3 でのスコア判定の仕組みに関して知っておくべき信頼できる情報源は、Lighthouse v3 スコアガイドとなります。
新しい出力形式と変更点
CSV 出力のサポート
レポート結果を CSV 形式で出力できるようになりました。各行には、次のような 1 つの監査に関する情報と結果が含まれます。
- 監査が属するカテゴリの名前。
- 監査の名前。
- 監査の説明。
- 監査に使用されるスコアタイプ。
- スコアの値。
JSON 出力の変更
バージョン 3.0 では、Lighthouse の JSON 出力形式に多くの変更が加えられています。詳しくは、Lighthouse v3 移行ガイドをご覧ください。
新しい監査
First Contentful Paint
テキストまたは画像のコンテンツがユーザーの画面に最初にペイントされた時間を測定します。
robots.txt が無効です
検索ボットがサイトをクロールできるように、サイトの robots.txt ファイルの形式が正しいことを確認してください。
アニメーション コンテンツに動画フォーマットを使用する
GIF を video タグに置き換えることで、動画ファイルサイズを大幅に削減できる可能性があります。
詳しくは、アニメーション GIF を動画に置き換えるをご覧ください。
どの出発地に対してもコストのかかる複数回のラウンド トリップを避ける
rel="preconnect" 属性を link タグに追加して、読み込みのパフォーマンスを向上させます。これにより、できるだけ早くオリジンへの接続を確立するようにブラウザに指示します。
詳細については、事前接続をご覧ください。
監査の変更
最初のインタラクティブ ➡ 最初の CPU がアイドル状態
仕組みがわかりやすくなるように、First Interactive 監査の名前を「First CPU Idle」に変更しました。監査の一般的な目的は同じです。この監査を使用して、ユーザーが初めてページを操作したタイミングを測定します。
Perceptual Speed Index ➡ Speed Index
Lighthouse 3.0 では、Perceptual Speed Index の監査が Speed Index に変更されました。この変更により、Lighthouse では WebPageTest によるこの指標の測定方法が改善されます。監査の目的は同じですが、基盤となる指標は若干異なります。