広告や動画の表示、ソーシャル メディアとの統合に、サードパーティのリソースがよく使用されます。デフォルトの方法では、ページの読み込み時にすぐにサードパーティのリソースを読み込みますが、ページ読み込みが不必要に遅くなることがあります。サードパーティのコンテンツが重要でない場合は、コンテンツを遅延読み込みすることでこのパフォーマンス コストを削減できます。
この監査では、インタラクション時に遅延読み込みできるサードパーティの埋め込みがハイライト表示されます。この場合、ユーザーが操作するまで、サードパーティのコンテンツの代わりにファサードが使用されます。
Lighthouse で遅延可能なサードパーティ埋め込みを検出する方法
Lighthouse では、ソーシャル ボタン ウィジェットや動画の埋め込み（YouTube 埋め込みプレーヤーなど）など、遅延可能なサードパーティ プロダクトを探します。
遅延可能なプロダクトと使用可能なファサードに関するデータは、サードパーティ ウェブで管理されます。
これらのサードパーティの埋め込みのいずれかに属するリソースがページで読み込まれると、監査は不合格になります。
ファサードでサードパーティを延期する方法
サードパーティの埋め込みを HTML に直接追加するのではなく、実際の埋め込みのサードパーティと似た静的要素を含むページを読み込みます。インタラクション パターンは次のようになります。
読み込み時: ページにファサードを追加します。
マウスオーバー時: ファサードがサードパーティのリソースに事前接続されます。
クリック時: ファサードがサードパーティ製品に置き換えられます。
推奨されるファサード
一般に、動画の埋め込み、ソーシャル ボタン ウィジェット、チャット ウィジェットはすべてファサード パターンを使用できます。以下に、おすすめのオープンソース ファサードを示します。ファサードを選択する際は、サイズと機能セットのバランスを考慮してください。遅延 iframe ローダ（vb/lazyframe など）を使用することもできます。
YouTube 埋め込みプレーヤー
Vimeo の埋め込みプレーヤー
チャット（インターコム、ドリフト、ヘルプスカウト、Facebook Messenger）
独自のファサードの作成
上記の操作パターンを採用するカスタム ファサード ソリューションを構築することもできます。ファサードは、遅延しているサードパーティ製品に比べて大幅に小さくし、製品の外観を模倣するのに十分なコードのみを含める必要があります。
パートナー様のソリューションを上記のリストに登録する場合は、お申し込み方法をご覧ください。
関連情報
ファサード監査を使用したサードパーティ リソースの遅延読み込みのソースコード。