「loading」属性で画像の遅延読み込みを実現

「img」タグに「loading="lazy"」を追記するだけで、画像の遅延読み込み（lazy-load）が実現でき、ページの表示を早くすることが可能になりました。

遅延読み込みは、ブラウザのスクロールに応じで順番に画像が読み込まれる形式です。

今はまだ「Google Chrome」しかサポートされていないようですが、お手軽な作業なので、今後の制作では「loading」属性を追記すると良いと思います。

<img src="image.jpg" loading="lazy" alt="image">

今までは「JavaScript」などを使用して実装するものでしたが、簡単になったのはありがたいことです。