Lazy-Load，翻譯過來是“ 懶加載”。它是針對圖片加載時機的優化：在一些圖片量比較大的網站（比如電商網站首頁，或者團購網站、小游戲首頁等），如果我們嘗試在用戶打開頁面的時候，就把所有的圖片資源加載完畢，那么很可能會造成白屏、卡頓等現象，因為圖片真的太多了，一口氣處理這么多 ...

正常加載可以認為是並行加載，在同一時間加載多個文件, index.js 中 引入 test.js , 點擊按鈕之前已經加載了 test.js 懶加載：當文件需要使用時才加載構建后:頁面一加載,只有index.js 執行了 點擊按鈕后才會加載 test.js 預加載 prefetch ...

話說前頭： 上次寫了一篇webpack的學習心得，webpack能做到提升前端的性能，其模塊打包最終生成一個或少量的文件能夠減少對服務端的請求。除此之外，本次的圖片懶加載（當然不僅限於圖片，還可以有視頻，flash等）也是一種優化前端性能的方式。使用懶加載可以想要看圖片時才加載圖片 ...

在項目開發中，我們往往會遇到一個頁面需要加載很多圖片的情況。我們可以一次性加載全部的圖片，但是考慮到用戶有可能只瀏覽部分圖片。所以我們需要對圖片加載進行優化，只加載瀏覽器窗口內的圖片，當用戶滾動時，再加載更多的圖片。這種加載圖片的方式叫做圖片懶加載，又叫做按需加載或圖片的延時加載 ...

一、效果圖如下 上面的效果圖，效果需求如下 1、還沒加載圖片的時候，默認顯示加載圖片背景圖 2、剛開始進入頁面，自動加載第一屏幕的圖片 3、下拉界面，當一張圖片容器完全顯露出屏幕，即刻加載圖片，替換背景圖 4、加載 ...

組件懶加載也叫按需加載； 當打包構建應用時，JavaScript 包會變得非常大，影響頁面加載。如果我們能把不同路由對應的組件分割成不同的代碼塊，然后當路由被訪問的時候才加載對應組件，這樣就更加高效了。 打包 build 后的 dist 中 js 包文件太大，影響頁面加載速度，使用 vue ...

vue-router配置路由，使用vue的異步組件技術，可以實現懶加載，代碼如下：// 每個組件都會生 ...

話說前頭： 上次寫了一篇webpack的學習心得，webpack能做到提升前端的性能，其模塊打包最終生成一個或少量的文件能夠減少對服務端的請求。除此之外，本次的圖片懶加載（當然不僅限於圖片，還可以有視頻，flash等）也是一種優化前端性能的方式。使用懶加載可以想要 ...