Tancy's Blog

性能优化之Sprite图片

性能优化之Sprite图片

Sprite图片(又称:雪碧图)被运用在众多使用了很多小图标的网站上。相对于把每张小图标以单个文件的形式引用到页面上,Sprite图片会只要请求一张图片就够了,减少了请求数提升了加载性能,还有就是方便图标管理。但在移动互联网时代在使用Sprite图片需要合理利用,不然反对性能造成影响。

解码内存消耗

Decoded in memory的计算公式: w x h x 4
如果设备DPI大约1,还需要X DPI系数。如Retina设备X2,RetinaHD设备X3.

禁止生成大图且利用率少

由于图片在浏览器中的解码方式,合理的生成紧凑的Sprite图片,即可以带来更少的请求数,又高性能低消耗。

建议合并成如下:

不建议合并成如下:


晓田 ronntx@gmail.com

2015-5-20