Speed Index は、Lighthouse レポートのパフォーマンスセクションで追跡される6つのメトリックの1つです。各メトリックは、ページの読み込み速度のいくつかの側面をキャプチャします。

スピードインデックスの測定値

速度インデックスは、ページの読み込み中にコンテンツが視覚的に表示される速度を測定します。Lighthouseはまず、ブラウザに読み込まれるページのビデオをキャプチャし、フレーム間の視覚的な進行を計算します。次に、LighthouseはSpeedlineNode.jsモジュール を使用してSpeedIndexスコアを生成します。

Lighthouseがスピードインデックススコアを決定する方法

速度インデックススコアは、HTTPアーカイブのデータに基づいて、ページの速度インデックスと実際のWebサイトの速度インデックスを比較したものです 。

スピードインデックススコアを向上させる方法

ページの読み込み速度を改善するために行うことはすべてスピードインデックススコアを改善しますが、これらの診断監査によって発見された問題に対処することは、特に大きな影響を与えるはずです。

• メインスレッドの作業を最小限に抑える
• JavaScriptの実行時間を短縮する
• Webフォントのロード中にテキストが表示されたままであることを確認します

全体的なパフォーマンススコアを向上させる方法

特定の指標に焦点を当てる特別な理由がない限り、通常は全体的なパフォーマンススコアの向上に焦点を当てたほうがよいでしょう。

Lighthouseレポートの[ Opportunities]セクションを使用して、ページに最も価値のある改善点を決定します。機会が重要であるほど、パフォーマンススコアへの影響は大きくなります。たとえば、以下のLighthouseのスクリーンショットは、レンダリングブロックリソースを削除すると 最大の改善が得られることを示しています。