画像の遅延読み込み

• ワードプレス

ファーストビューのメイン画像以外の画像やiframe、video等の埋め込みに対して遅延読み込みをすることでページの読み込みスピードの向上に有効です。

方法は2種類あり、下記となります。

1.ライブラリの使用
導入の参考サイト：Lazy Load 導入の仕方

2.loading属性の追記
ライブラリ導入と違い、記述自体はとても簡単ですが、現在対応しているブラウザがedge・firefox・Chromeのみとなります。
ただ、safariに関しては、導入の動きが進んでいるので間もなく導入されそうです。
IE11のサポートが2022年6月15日までなので、loading属性をメインに使うのはそれ以降か、サポートブラウザにIE11を含めない場合となります。
記述例は下記です。

<img src="〜〜.jpg" loading="lazy">