在載入網頁時, 若有大量的圖檔需要載入, 會造成緩慢的現象, 而且也會讓使用者體驗有所影響, 所幸後來在瀏覽器預設就可以使用 images lazy loading 的方式來進行, 使用方式為在
<img src="img/image1.jpg" alt="image1">
增加 loading=“lazy” 即可, 如下:
<img src="img/image1.jpg" loading="lazy" alt="image1">
而支援的瀏覽器都支援, 不過 firefox / safari 是僅支援圖片型載入, 可以參閱 caniuse:
https://caniuse.com/?search=loading
這個屬性是可以用在 images / iframes 不過 firefox 是僅支援 images
其他相關資料可以參考: