Lighthouse のバリエーション

ウェブページのパフォーマンスはさまざまな要因によって左右されます。Lighthouse のパフォーマンス スコアは、ページに変更がなかったとしても、ウェブ技術とネットワーク テクノロジーには固有のばらつきにより変動する傾向があります。

ばらつきの原因

パフォーマンス測定にばらつきが生じるのは、影響の度合いの異なる複数のチャネルです。以下の表に、指標の変動の一般的な原因、結果に及ぼす一般的な影響、異なる環境でそれらが発生する可能性がある範囲を示します。

ソース 効果 一般的なエンドユーザー PageSpeed Insights 管理ラボ
ページの非決定性 可能性が高い 可能性が高い 可能性が高い
ローカル ネットワークの変動性 可能性が高い 可能性が低い 可能性が低い
ティア 1 ネットワークの変動性 POSSIBLE POSSIBLE POSSIBLE
ウェブサーバーの変動 可能性が高い 可能性が高い 可能性が高い
クライアント ハードウェアのばらつき 可能性が高い 可能性が低い 可能性が低い
クライアント リソースの競合 可能性が高い POSSIBLE 可能性が低い
ブラウザの非決定性 特定の 特定の 特定の

差異の原因と、Lighthouse のランタイムと環境の最も可能性が高い組み合わせに及ぼす影響について、以下で詳しく説明します。 これら 3 つの環境のいずれでも、適用されたスロットリングとシミュレーション スロットリングのアプローチを使用できますが、一般的なエンドユーザーはシミュレーション スロットリングを使用します。

ページの非決定性

ページのユーザー エクスペリエンスを変える非決定的なロジック(レイアウトや読み込まれたアセットを変更する A/B テスト、キャンペーンの進行状況に応じて異なる広告エクスペリエンスなど)がページに表示されることがあります。これは、意図的で除去できない変動源です。ページが変更された場合にパフォーマンスが低下する場合、Lighthouse ではそのケースを特定できます。唯一の対策は、サイト所有者が、異なる実行間でまったく同じバージョンのページがテストされるようにすることです。

ローカル ネットワークの変動性

ローカル ネットワークには、パケットロス、変動するトラフィックの優先順位付け、ラスト ワンマイル ネットワークの輻輳など、固有の変動性があります。通常、低価格のルーターを使用しているユーザーや、限られた帯域幅を共有する多くのデバイスを使用しているユーザーが、この問題の影響を受けやすくなります。適用済みスロットリングでは、基盤となる再試行をマスクする最小リクエスト レイテンシと最大スループットを適用することで、このような影響を部分的に軽減できます。スロットリングのシミュレーションでは、ネットワーク アクティビティを独自にリプレイすることで、このような影響を軽減します。

ティア 1 ネットワークの変動性

通常、ネットワーク相互接続は安定性が高く、影響はほとんどありませんが、地域をまたぐリクエスト(米国からの中国サイトのパフォーマンスの測定など)では、階層 1 のネットワーク ホップによる高度なレイテンシが発生する可能性があります。適用されたスロットリングは、ネットワーク スロットリングでこれらの影響を部分的にマスクします。スロットリングのシミュレーションでは、ネットワーク アクティビティを独自にリプレイすることで、このような影響を軽減します。

ウェブサーバーの変動

ウェブサーバーの負荷は変動するため、常に同じ遅延で応答するとは限りません。通常、ホスティング インフラストラクチャが共有され、トラフィックが少ないサイトでは、この脆弱性の影響を受けやすくなります。適用スロットリングでは、ネットワーク スロットリングでリクエストの最小レイテンシを適用することで、こうした影響を部分的にマスキングします。シミュレート スロットリングでこの影響を受けやすくなりますが、通常、全体的な影響は他のネットワークの変動性に比べて小さくなります。

クライアントのハードウェアのばらつき

ウェブページが読み込まれるハードウェアは、パフォーマンスに大きな影響を与える可能性があります。適用されているスロットリングでは、この問題を軽減することはできません。シミュレート スロットリングでは、シミュレーション中の CPU タスクの理論的な実行時間に上限を設けることで、この問題を部分的に軽減できます。

クライアント リソースの競合

Lighthouse の実行中に同じマシンで実行される他のアプリでは、CPU、メモリ、ネットワーク リソースの競合が発生する可能性があります。マルウェア、ブラウザ拡張機能、ウイルス対策ソフトウェアは、特にウェブ パフォーマンスに強く影響します。マルチテナント サーバー環境(Travis、AWS など)でも、これらの問題が発生する可能性があります。また、Lighthouse のインスタンスを複数同時に実行すると、この問題により結果に歪みが生じるのが一般的です。適用されているスロットリングは、この問題の影響を受けやすくなります。シミュレート スロットリングでは、ネットワーク アクティビティを独自にリプレイし、CPU 実行に上限を設けることで、この問題を部分的に軽減できます。

ブラウザの非決定性

ブラウザには本質的にタスクの実行にばらつきがあり、ウェブページの読み込み方法に影響を及ぼします。このような状況は、スロットリングが適用されたうえで避けられません。1 日の終わりには、ブラウザによって確認されたことが何でも報告されるだけです。シミュレート スロットリングでは、実行をシミュレーションすることで、この影響を部分的に軽減できます。推定ではブラウザからのタスク実行時間のみが使用されます。

スロットリング戦略の影響

以下の表に、指標が変動する一般的な原因、指標が結果に及ぼす一般的な影響、Lighthouse のスロットリング戦略による影響の軽減の程度を示します。さまざまなスロットリング戦略の詳細については、スロットル処理に関するドキュメントをご覧ください。

ソース 効果 スロットリングのシミュレーション 適用されたスロットル調整 スロットリングなし
ページの非決定性 緩和なし 緩和なし 緩和なし
ローカル ネットワークの変動性 軽減済み 一部緩和 緩和なし
ティア 1 ネットワークの変動性 軽減済み 一部緩和 緩和なし
ウェブサーバーの変動 緩和なし 一部緩和 緩和なし
クライアント ハードウェアのばらつき 一部緩和 緩和なし 緩和なし
クライアント リソースの競合 一部緩和 緩和なし 緩和なし
ブラウザの非決定性 一部緩和 緩和なし 緩和なし

差異に対処するための戦略

外部要因を分離する

  • 第三者の影響からできるだけページを分離します。他人の変数の失敗を責められるのは決して楽しいことではありません。
  • テスト中には、独自のコードの非決定性を分離できます。ランダムに表示されるアニメーションがある場合、パフォーマンスの数値もランダムになっている可能性があります。
  • ネットワークの変動性を可能な限り防ぐために、テストサーバーを分離します。安定性が重要な場合は、localhost、またはまったく同じネットワーク上のマシンを使用してください。
  • クライアント環境を、ウイルス対策ソフトウェアやブラウザ拡張機能などの外部からの影響から分離します。可能であれば、テスト専用のデバイスを使用します。

マシンのリソースが限られている場合やクリーンな環境を構築するのが難しい場合は、PageSpeed Insights や WebPageTest などのホスト型のラボ環境を使用して、テストを行います。継続的インテグレーションでは、可能であれば専用サーバーを使用します。無料の CI 環境とバースト可能なインスタンスは 一般的に非常に不安定です

Lighthouse を複数回実行する

精神的またはプログラム的失敗のしきい値を作成する場合は、単一のテストではなく、中央値、90 パーセンタイル、最小などの集計値を使用します。

Lighthouse の実行スコアの中央値が 5 の場合、1 実行の 2 倍の安定性が得られ、pwmetrics などのツールでは、Lighthouse の実行が自動的に行われます。最小値を使用することは、テストをまったく行わない場合と比べて大きな改善になります。実装は非常に簡単です。合格するまで Lighthouse を最大 5 回実行するだけです。

フィードバック

このページはお役に立ちましたか?
このページの良かった点をお聞かせください。
目標達成に役立った
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。
必要な情報が得られたから
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。
情報が正確だった
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。
読みやすかった
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。
その他
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。
×
このページの不満な点を教えてください。
目的を達成するのに役立たなかった
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。
必要な情報が欠けていた
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。
情報が不正確だった
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。
読みにくい
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。
その他
フィードバックにご協力いただきありがとうございます。このページの改善方法について具体的なアイデアがございましたら、イシューを作成してください。