背景 項目開發過程中可能會遇到首次打開一個工具欄有特別多圖標的網站，圖標載入特別慢 原因分析 如果伺服器上存的圖片都是單獨分開的話，那打開網站後，面板上的所有圖標是不是都要請求伺服器呢？次數是不是就多了？ 那我們就減少請求伺服器次數。優化一是本次文章的主題：切圖，其它優化是網頁優化 優化一：切圖 讓 ...
背景
項目開發過程中可能會遇到首次打開一個工具欄有特別多圖標的網站，圖標載入特別慢
原因分析
如果伺服器上存的圖片都是單獨分開的話，那打開網站後，面板上的所有圖標是不是都要請求伺服器呢？次數是不是就多了？
那我們就減少請求伺服器次數。優化一是本次文章的主題：切圖，其它優化是網頁優化
優化一：切圖
讓美工把所有圖標整在一張圖片里，然後通過CSS去切圖
1 background: url(圖片地址) -10px 0 no-repeat;
優化二：壓縮頁面
後臺使用Gzip技術壓縮頁面，體積小了，頁面打開就快了
優化三：圖片、js、css文件預載入
舉個慄子，在打開首頁的時候，已經把其他頁面上的圖標載入到本地，再打開其他頁面的時候，是不是就不需要再請求了，因為有緩存了
優化四：緩存技術
常用的圖標緩存到客戶端，後面打開速度就快多了
優化五：靜態資源和項目網站分開部署兩台伺服器
如果有圖片、附件上傳功能的話，並且有米情況，那可以考慮分開部署。
