プリロード#
<link rel="preload">は、現在のページで必要なリソースをプリロードするために使用され、ブラウザが HTML ドキュメントを解析する前に読み込まれます。
<link rel="preload" href="https://example.com/image.png" as="image" />
プリフェッチ#
<link rel="prefetch">は、将来のページで必要になるリソースをプリフェッチするために使用され、ブラウザが HTML ドキュメントを解析した後に読み込まれます。
<link rel="prefetch" href="https://example.com/image.png" as="image" />
プリロード vs プリフェッチ#
- プリロードは、現在のページで必要なリソースを読み込むために使用され、ブラウザが HTML ドキュメントを解析する前に読み込まれます。
- プリフェッチは、将来のページで必要になるリソースを読み込むために使用され、ブラウザが HTML ドキュメントを解析した後に読み込まれます。
- プリロードの優先度はプリフェッチよりも高いです。