目的
為了提高網站整體性能,針對我們網站圖片比較多,我們決定采用 image sprite 方案減少 http 請求以優化性能;
規則
使用此方案有兩個必須遵循的規則:
- 圖片必須是兩倍圖一倍使用
兩倍圖在切圖時完成;使用時,按照一倍使用;例如:圖片大小是44*44,我們使用的時候包裹圖片的容器應該是22*22。 - 必須為 png 圖片,以 iconP 開頭,即 iconP*.png
例如:iconP-avatar.png;
建議
- 建議只合并復用的圖片(在多個頁面出現);
- 建議只針對尺寸比較小的 icon(<100*100);
- 圖片大小以不超過 2k 為宜;