Chrome DevTools のパフォーマンス パネルは、15 年近くにわたり、デベロッパーがランタイム パフォーマンスを測定して最適化するうえで役立ってきました。最初は [タイムライン] というパネルでしたが、現在は [パフォーマンス] パネルに進化しています。
この間、Chrome では他の強力なパフォーマンス プロダクトや機能もリリースされています。特に、最適化の機会をより簡単に見つけられるように、2016 年に Lighthouse がリリースされました。パフォーマンス分析情報の試験運用版パネルは、パフォーマンス分析情報を表示する新しい方法をテストするために 2022 年にリリースされました。
[パフォーマンス] パネルには、ページの読み込みと実行時のパフォーマンスの問題を詳しく調べるのに役立つデータと機能が満載されています。ただし、使いこなすのが難しい場合や、ページのパフォーマンスを改善するための最大の機会を特定するのが難しい場合があることも認識しておきましょう。また、ノイズを整理して改善の余地をすばやく特定できる Lighthouse などの他のツールは、[パフォーマンス] パネルから切り離されています。
デベロッパーがパフォーマンスの問題を簡単に特定して再現できるようにするため、Lighthouse と [パフォーマンス分析情報] パネルの機能と学習結果を、既存の [パフォーマンス] パネルに統合します。また、UX とユーザビリティにも重点を置き、ウェブ パフォーマンスの最適化ツールとしての [パフォーマンス] パネルの有効性を高めています。
結果はどうなりましたか？すべてのパフォーマンス データと分析情報を 1 つのパネルで確認できる、これまで以上に簡単で強力なパネル。
ウェブ パフォーマンスに関するアクションが簡単に
ご意見を拝見して、情報量の多さがユーザビリティの課題を複雑にしていることがわかりました。解決に向けて、現在、修正と機能の開発を積極的に進めております。Core Web Vitals の改善など、主要な最適化プロセスは優先的に処理されます。アノテーションなどの機能も導入する予定です。これにより、検出結果をマークしたり、学んだことを同僚と共有したりできるようになります。データ内の相関関係を把握することで、複雑なシステムを理解する能力を高めることができます。また、メインスレッド アクティビティへのネットワーク リクエストなど、データの関連性をさまざまな方法で明らかにできます。
新機能は開発が完了次第リリースされ、パネルで利用できる新機能の最新情報は数か月ごとにお知らせします。しばらくお待ちください。まもなく新機能が利用可能になります。
[パフォーマンス] パネルで Lighthouse の機能を利用できる
デベロッパーが Lighthouse パネルとパフォーマンス パネルの両方を使用する方法を調査した結果、両者を切り替える際にコンテキストを切り替えるのが難しいことがわかりました。また、Lighthouse の検出結果に対応するには、[パフォーマンス] パネルに移動して追加のコンテキストを確認することが必要になる場合があります。ページのパフォーマンスに関する推奨事項の概要が、詳細なパフォーマンス データと切り離されているため、不便が生じます。
Lighthouse のパフォーマンス分析を [パフォーマンス] パネルに統合します。この統合により、Lighthouse はパフォーマンス パネル内でページのパフォーマンスを改善するための最優先の改善案をハイライト表示し、その改善案に対応するために必要な詳細情報をすべて提供します。
パフォーマンス機能がすべて [パフォーマンス] パネルに移動された後、DevTools の独立した Lighthouse パネルは不要になり、廃止されます。このパネルのサポート終了は 2025 年後半まで行われません。Lighthouse は廃止されませんことを明確に伝えることが重要です。
Lighthouse は今後も継続されます
Lighthouse npm モジュールと PageSpeed Insights の Lighthouse レポート（PSI API を含む）はサポートが終了しません。Google は、デベロッパーが好む環境でページのパフォーマンスを評価するために使用できるオープンソース ツールとして、Lighthouse の可用性と品質の向上に引き続き取り組んでいます。
この統合により、パフォーマンス パネルと Lighthouse の両方の機能を強化し、読み込み、応答性、コンテンツの安定性について検討するデベロッパーをサポートします。
試験運用版の [パフォーマンス分析情報] パネルのサポート終了
パフォーマンス分析情報パネルは、3 つの主要な問題（パフォーマンス パネルの情報量の削減、ユースケース ドリブンの分析のサポート、パフォーマンス パネルの使用に伴う学習曲線の短縮）を解決する方法を確認するための試験運用版としてリリースされました。
Google は、デベロッパーからのフィードバックを通じて、このテストから多くのことを学びました。Google は、ユースケース ドリブンの分析（「LCP を最適化したい」、「ページの応答性を高めたい」など）が非常に有用であること、レイアウト シフト トラックなどの機能により、指標の診断と改善が大幅に容易になることを確認しました。
また、デベロッパーは、パフォーマンス分析パネルの方がパフォーマンス パネルよりも使いやすいと回答しており、情報量を減らしたことが好評を得ていることが確認されました。ただし、この密度の低下は多くの場合、デベロッパーが [パフォーマンス] パネルに移動して、対応に必要な詳細なデータを取得する必要がありました。
得られた知見と、試験運用版の [パフォーマンス分析情報] パネルの多くの機能は、[パフォーマンス] パネルに統合されます。ユースケース ドリブンの分析や情報密度の向上などの機能に加え、Lighthouse との統合により、ページのパフォーマンスに関する分析情報をこれまで以上に実践に役立てることができます。
パフォーマンス分析情報の試験運用版は、2024 年中に削除される予定です。
フィードバックの送信先
新機能をリリースするにあたり、フィードバックをお待ちしております。追加された機能の改善方法や、パネル内の既存のフローが不必要に中断される場合は、お知らせください。機能している点、機能していない点、改善の余地がある点について、ぜひお知らせください。ありがとうございました