プリロードとプリコネクト

ブラウザ ヒント (リソース ヒント)

Web サイトを開くとき、ブラウザは最初に何をロードするかを決定します。あなたはエンジニアとして、彼に重要なことをささやくことができます。 リソース ヒントは、これらのヒントをブラウザに提供する標準的な方法です。

プリロード

重要なフォント、メイン LCP 画像、または重要な JS ファイルに使用されます。ブラウザはファイルの検出を待たずに、すぐにダウンロードします。使用法:

Preconnect (Preconnect)

サードパーティ サービス (Google Fonts、CDN、分析) に使用されます。ファイルが要求される前に、DNS、TCP、および TLS ハンドシェイクを完了します。これだけで 100 ～ 300 ミリ秒を節約できます。

DNS-Prefetch

preconnect の軽量バージョンです。事前に DNS 解決を行うだけです。重要度の低いサードパーティ サービスに適しています。

注意! プリロードを多すぎると、実際のページの読み込みが妨げられる可能性があります (帯域幅の輻輳)。 「本当に重要な」ものだけを選択してください。