遅延読み込みは、初回ページ読み込み時にビューポート内で見えているコンテンツだけを読み込むことでパフォーマンスを改善します。ファーストビューより下の画像は、ユーザーが近くまでスクロールするまで軽量なプレースホルダーのままになり、その時点で実際の画像ダウンロードが始まります。HTML の loading='lazy' 属性によるネイティブ遅延読み込みは、現代の主要ブラウザーでサポートされており、JavaScript は不要です。Intersection Observer API を使うと、カスタム実装でより細かく制御できます。ファーストビュー内のヒーロー画像では遅延読み込みを無効にするべきです。Largest Contentful Paint を最適化するには、それらの画像をすぐに読み込む必要があります。表示中のコンテンツまで遅らせる過度な遅延読み込みは、体感速度を悪化させます。見えているコンテンツは即時読み込み、それ以外は遅延読み込みにするのが適切なバランスです。