關於圖片延遲加載的解決方案（針對移動端）

在頁面上圖片比較多的時候，爲了優化性能，能夠採用延遲加載技術，我封裝了一款輕量級的插件。

插件下載地址：

http://pan.baidu.com/s/1o6804Gy

使用方法：

1 在頁面中須要引入echo.css和echo.min.js

2 對須要進行延遲加載的圖片採用以下寫法：

<img src="blank.gif" style="width:300px;height:300px;" data-echo="test.jpg" />

blank.gif是一張背景圖片，包含在插件裏了。圖片的寬高必須設定，固然，能夠使用外部樣式對多張圖片統一控制大小。

data-echo指向的是真正的圖片地址。

3 對插件進行初始化：

echo.init();

就這麼簡單，你將能夠看到圖片只有出如今視野內時纔會加載，減小了頁面的渲染工做量。

說明：

咱們知道，jQuery lazyloading插件已經能很好地實現這一功能，但它基於jQuery，對於移動端可能不太實用，這款插件不依賴任何第三方庫，核心文件只有3KB左右，很是適合移動端開發。