不少網站都會在網頁當中埋入延遲加載的JavaScript代碼，以便降低首次加載的圖片數量，加快網頁首次呈現時間。Google Chrome已預定在75版本當中原生支持這項功能并自動啟動，包含lazy image loading和lazy iframe loading。

網頁結構越來越復雜，需要加載的物件也越來越多，該如何降低首次連入網頁的延遲，對于使用者體驗影響不小。目前跨網頁瀏覽器的做法為埋入1小段JavaScript代碼，延后加載顯示視區以外的物件，等到使用者滑動頁面，接近視區時才會向服務器發出請求并下載，此種做法可有效降低首次進入網頁的加載時間。

▲lazy loading不僅讓網頁顯示時間縮短，也可以減少一開始的數據傳輸量。

Google Chrome網頁瀏覽器將從75版本號開始，原生支持、里的srcset、

loading="lazy"就如同現在的處理方式，當使用者卷動網頁至接近視區時才會加載，loading="eager"則是要求瀏覽器立即下載加載，loading="auto"則是交由網頁瀏覽器自行決定加載時機點。由于Google Chrome預計是第一個導入原生lazy loading的網頁瀏覽器，若是網頁開發者欲達成跨瀏覽器兼容性，則必須額外加入判斷語法if('loading' in HTMLImageElement.prototype)，在else{}段落填入原本用以lazy loading的JavaScript。

▲Google Chome桌面版73版已加入lazy image loading和lazy iframe loading實驗性功能。

lazy loading還可以降低剛開始加載網頁的流量，因此Google Chrome這項功能一開始其實是從Android版本進行試驗，如今桌面版本也放在chrome://flags實驗功能菜單當中，使用者可自行選擇是否先行開啟該功能。另外一家Mozilla Firefox目前僅支持新分頁內容的延遲加載，當使用者確實點擊新分頁使其顯示在最上層，才會開始加載該分頁內容，至于是否原生支持圖片或是iframe的延遲加載，目前并未有任何風聲傳出。

總結

以上是生活随笔為你收集整理的将图片显示在应用最上层_谷歌Chrome 75将原生支持lazy loading，动动手也可以抢先试玩...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。