Liferay前端效能調優(5)sprite圖片

餘二五發表於2017-11-15

當然了,對於圖片檔案,我們不可以用yui-compressor進行壓縮,但是我們可以吧若干個小圖片sprite成一張大圖片然後給出每個圖片的座標,從而減少網路IO的次數開銷。


具體步驟是:


(1)壓縮所有的圖片檔案成一個zip包

(2)上傳到以下地址:http://spritegen.website-performance.org/

(3)然後它就會產生一個報告然後告訴你css的改變並且建立sprite後的圖片


然後對應的座標也改變了,如下:


然後我們就可以直接移植到專案中使用了。

本文轉自 charles_wang888 51CTO部落格,原文連結:http://blog.51cto.com/supercharles888/1213140,如需轉載請自行聯絡原作者


相關文章