ギフプロギフプロ

IntersectionObserverを使った画像遅延読み込み

CODE PREVIEW

P

プロンプト

IntersectionObserver APIを使用した遅延読み込み画像ギャラリーを作成します。画像はビューポートに入った時のみ読み込まれます。

この実装では、IntersectionObserver APIを使用して画像がビューポートに入るタイミングを検出します。画像は最初はdata-src属性のみを持ち、表示されるようになった時点で実際のソースを読み込みます。オブザーバーは50pxのルートマージンで設定され、画像がビューポートに入る少し前から読み込みを開始します。

このプロンプトは役に立ちましたか?

コメント

コメントは承認後に表示されます

ホームヘルプ