看看這些人的想法能不能幫上你：
甲：
1，不太“在乎”用戶體驗的省事方法：
圖片保存成漸進式的，加載會慢慢變清晰，而不是從上往下依次加載，然后放在 CDN，設(shè)置緩存之類。
2，比較“在乎”用戶體驗的高端方案：
判斷用戶的設(shè)備（主要用在移動端）、網(wǎng)絡(luò)等，分別加載不同質(zhì)量的圖片（例如高端 iPhone wifi 情況下，就可以加載雙倍高清圖等，蜂窩網(wǎng)絡(luò)下面，就加載個單倍或者有損壓縮過的）。
或者先加載低質(zhì)量的圖片，讓瀏覽者可以看到，然后再在后臺加載更高清的，等加載完了，瀏覽者還在觀看，就插入替換掉?；蛘呦燃虞d低質(zhì)量小圖片列表，然后讓用戶點擊，觸發(fā)類似 fancybox 的效果，彈窗出現(xiàn)大圖片?；蛘呃觅Y源預(yù)加載（三個 HTML5 不常見特性簡介）當(dāng)用戶還沒打開的時候，就開始加載。還有好多思路，后面想到再補充。
乙：
壓縮，預(yù)加載，緩存，圖床。
丙：
1.使用緩存
2.使用CDN加速
3.使用jq延遲加載圖片, 用到那個 加載哪個.
4.加大服務(wù)器寬帶
5.檢查服務(wù)器硬盤讀取速度.
?。?/b>
要盡可能的壓縮，看用戶的忍受程度。jpg 可以用很多方法壓縮，png 推薦使用?工具（不過正文圖片，顯然要選擇 jpg 格式的）。
推薦個壓縮圖片的神器：
https://tinypng.com/ ? ? ?如圖所示：
不過缺點就是不能設(shè)置壓縮比例。只能直接壓縮至最小。作為大banner圖的有時候清晰度就不夠達(dá)標(biāo)。
戊：
直接一開始用壓縮過的體積小的圖，等加載完畢后，再用高清無碼圖來替換掉
高清無碼的圖片隨便怎么命名，但是壓縮過的命名有要求，那就是必須在原圖的名稱前面加上相同的便于分辨的標(biāo)識。比如
高清圖1命名為wozuishuai.jpg 那么相應(yīng)的壓縮圖就叫wozuishuai_min.jpg (_min這個隨你取名，但是要一致，不能一個叫_min,下一個就成了_small)
然后，高清圖在網(wǎng)頁上都不用，用壓縮過的圖。比如這樣子
這樣子，你打開網(wǎng)頁的速度就會快很多，但是圖片會失真，雖然有的時候不影響使用，但是會影響用戶的體驗，以及老板拍桌子罵你干什么吃的？
不用怕，可以用下面這段代碼來解決這個問題，這個是基于jq的，要先引入jq
$(function(){
//一段正則，匹配所有_min.的圖片src屬性
vartest =/_min\./
//遍歷所有的圖片節(jié)點
$("img").each(function(index,obj){
if(test.test($(this).attr("src"))){
varreSrc = $(this).attr("src").replace(test,".");
$(this).attr("src",reSrc)
}
})
})
最后我們用一張圖來測試下這個方法的可行性
其實不用1s，這些圖基本上都可以用了，都可以看了，只不過我們這個是東郭先生，濫竽充數(shù)，但是最起碼能知道圖片講的什么內(nèi)容。但是，如果只加載高清圖，那么，用戶勢必要等待好幾s甚至十幾s。這樣的話，用戶是很容易拋棄這個網(wǎng)站的。
