谷歌工程經理Addy Osmani表示,計劃於今年5月份發布的Chrome 75穩定版中將默認啟用網頁延遲載入(lazy loading)技術。延遲載入是指在載入頁面的時候,延遲載入非關鍵資源的方法,只有在用戶需要的時候才會載入文本、圖像和視頻等等。該功能目前主要針對移動設備,不過在未來的版本中將會引入到Windows、Mac、Linux、Chrome OS等主要平台上。

延遲載入顯而易見的優勢就是提升頁面載入速度,並為用戶節省帶寬,特別是在使用移動數據時。谷歌工程師報告說,使用該機制後,頁面載入速度的提升從 18% 到 35% 不等,具體取決於底層網路。

事實上你在實際上網過程中已經見過延遲載入的實際應用,其過程大致如下:

● 您訪問一個頁面,並開始滾動閱讀內容。

● 在某個時刻,您將佔位符圖像滾動到視口中。

● 該佔位符圖像瞬間替換為最終圖像。

熱門發布平台 Medium 上就有關於圖像延遲載入的示例。該平台在載入頁面時會先載入輕量級的佔位符圖像,並在其滾動到視口時,將之替換為延遲載入的圖像。瀏覽中的 Medium 網站屏幕截圖,演示延遲載入的實際應用。 左側是模糊的佔位符,右側是載入的資源。

圖像延遲載入實際應用示例。 佔位符圖像在頁面載入時載入(左側),當滾動到視口時,最終圖像隨即載入(即在需要時載入)。

關於延遲載入的更多細節:可以訪問谷歌官方支持文檔


推薦閱讀:
相关文章