Lighthouse の進化: 継続的インテグレーション、新しいパフォーマンス スコア式など

Chrome Developer Summit 2019 で、Lighthouse の最新情報とインサイトをお届けします。

Elizabeth Sweeny

Chrome Developer Summit（CDS）の Speed Tooling Evolutions の講演で、Paul Irish と私は、すべてのユーザーのために極めて高速なエクスペリエンスの構築と維持に役立つ Google の最新プロダクトと機能を紹介しました。その中心となるのが、パフォーマンス モニタリング ツールである Lighthouse ファミリーの追加機能です。

Lighthouse CI アルファ版リリース

Lighthouse チームは、新しい継続的インテグレーション プロダクトである Lighthouse CI のアルファ版をリリースしました。これにより、本番環境に push する前に、すべての commit で Lighthouse を実行できます。Lighthouse CI は、Lighthouse を複数回実行し、静的監査または指標のしきい値をアサートしてから、Lighthouse レポートをサーバーにアップロードして、差分と基本的なカテゴリスコアの履歴を確認します。既存の budgets.json 設定は、Lighthouse のあらゆる監査やカテゴリの結果についてアサーション可能な新しい構文とシームレスに連携します。

Lighthouse CI は、すぐに使用できる Travis CI、Circle CI、GitHub Actions と、いくつかの構成を行った Ubuntu またはコンテナベースの CI サービスをサポートしています。Lighthouse CI サーバーをオンプレミスにインストールすることも、即時設定に Docker イメージを使用することもできます。今すぐ使用を開始するための手段として、Lighthouse で公開される無料のレポート ストレージを代わりにご利用いただけます。

近日提供予定: パフォーマンス スコアの更新

Lighthouse パフォーマンス スコア バージョン 6 が変更されます。バージョン 5（2019 年 11 月現在）の Lighthouse には、パフォーマンス スコアが 0 ～ 100 になるように重み付けおよび統合された 5 つの指標（First Contentful Paint、Speed Index、First Meaningful Paint、Time to Interactive、First CPU Idle）があります。

詳細については、Lighthouse のパフォーマンス スコアリングをご覧ください。

Lighthouse バージョン 6 では、First CPU Idle（FCI）と First Meaningful Paint（FMP）の代わりに、新しい指標である Largest Contentful Paint（LCP）と Total Blocking Time（TBT）が導入されています。5 つの指標それぞれの重みは、負荷とインタラクティビティの測定のさまざまなフェーズのバランスが取れるように調整されます。

Lighthouse チームは、すべてのスコアリング曲線が微調整され、指標が成熟し、徹底的にテストされるよう、引き続き取り組んでいます。Lighthouse v6 のパフォーマンス スコアは 2020 年 1 月にリリースする予定です。

Lighthouse スタックパック

Lighthouse では、サイトがフレームワークやコンテンツ マネジメント システム（CMS）を使用しているかどうかを自動的に検出し、スタック固有のアドバイスをレポートに追加できます。Stack Pack では、Lighthouse のコア監査に加えて、コミュニティのエキスパートが厳選したカスタマイズされた推奨事項が追加されます。

現在、Angular、WordPress、Magento、React、AMP のスタックパックがあります。独自の Stack Pack を作成するには、GitHub リポジトリにアクセスするか、Lighthouse チームにお問い合わせください。

近日提供予定: Chrome 拡張機能としての Lighthouse プラグイン

Lighthouse プラグインは、Lighthouse の拡張性を活用できるもう 1 つの方法です。現在、Lighthouse のコア監査でカバーされていない品質チェックが多数あります。原因は、一部のデベロッパーにしか適用されないか、チームに監査を作成する帯域幅がないことが原因です。

Lighthouse プラグインを使用すると、コミュニティ エキスパートは新しいチェックセットを実装して、Lighthouse で新しいカテゴリとしてレポートに追加できます。現時点では、プラグインは Lighthouse CLI でのみ機能しますが、目標は DevTools の [Audits] パネルでもプラグインの実行を有効にすることです。

ユーザーが Chrome ウェブストアから Lighthouse プラグイン拡張機能をインストールすると、インストールされているプラグインが DevTools によって識別され、[Audits] パネルのオプションとして提示されます。Lighthouse チームは、今後数か月以内にプラグイン アプローチのサポートを構築する予定です。どうぞご期待ください。それまでの間、プラグインをノード モジュールとして今すぐ作成して、CLI を介してすべての Lighthouse ユーザーがアクセスできるようにしましょう。

詳細

Lighthouse など、CDS 2019 のパフォーマンス ツールに関する最新情報について詳しくは、Speed ツールの進化に関する以下の動画をご覧ください。

皆様からのフィードバックは Lighthouse の改善に役立てさせていただきます。ぜひ Lighthouse CI をお試しください。また、スタックパックを作成するか、Lighthouse プラグインを作成して、こちらからお知らせください。