画像を遅延読み込みしてみよう！Intersection Observer編 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作年齢なんか関係ない！ 人生史上今が一番！ Webのパフォーマンスもブチ上げていきたい、フロントエンドエンジニアのザワです。 lazyload（レイジーロード）、Web業界では耳慣れたワードになってきたのではないでしょうか。 Webページの表示を高速化するために、ページロード初期時には画像は読み込まず、表示したいタイミングでロードを開始するアレです。「lazyload」だの「遅延読み込み」だのいってますが同じことを指しています。気分と話し相手によって変えていきましょう。 今回は2つの方法を2回に分けて実践していきます。 Intersection observerを使用する方法 loading属性にlazyを適用する方法 Intersection observerが一般的になる以前は、scrollイベントで随時要素の位置を取得して、みたいなことをやっていたと思いますが、そんなオールドスクールな
