對於web前端頁面開發，圖片是一個很重要的組成部分。爲了達到圖文並茂的效果，我們希望頁面中能有更多的圖片，但是從頁面加載的速度講，過多過大的圖片都會拖慢加載速度。於是對於圖片的壓縮處理就顯得特別重要。下面分享一下我目前使用的幾個處理方法。
1.七牛服務器提供的壓縮圖片的方法
我們公司APP目前使用的圖片和視頻文件都存在七牛服務器上，作爲目前國內知名的雲存儲服務商，七牛官方提供了很好的圖片處理API。
一般來講，用戶看到的文字、圖片等都是由運營上傳的，如果運營直接在後臺上傳了一張很大的圖片，那麼前端頁面在加載的時候就會較慢，有可能圖片會有明顯的加載過程，這個時候，就需要我們對圖片進行處理了，比如我們公司的logo圖標，地址是：點擊打開鏈接。尺寸是1024*1024，大小是80.7kb，但是我只是需要在微信分享鏈接中使用這個圖片，根本不需要這麼大尺寸的圖片，那麼就很有必要壓縮一下了，比如在這個圖片的鏈接地址後面添加參數：?imageView2/2/w/300，就能夠把這張圖片壓縮到300*300，大小爲28.9kb。這樣這張圖片的加載速度就會加快很多。
2.使用圖片壓縮軟件
軟件地址：圖片壓縮工具。直接將圖片上傳就可以壓縮圖片，很適合運營用。
3.圖片使用懶加載技術
可使用lazyload.js插件，對於DOM中本來就有的<img>標籤，懶加載沒有任何問題，但是在我做的一個項目中，項目中的圖片是用underscore.js模板加載的，實際調試發現lazyload.js未實現圖片懶加載，這個問題後續解決了再寫上來。如果有童鞋知道怎麼解決的，請不吝賜教。