对于提高页面访问性能的方式,其中比较重要的准则就是减少页面的请求数量 常用的方式是合并css js文件、使用精灵图片 还有一种有效方法可以尝试,用Data URI代替图片的src 一般都会使用src引用图片的路径 <img src="/images/logo.png" /> 使用data URI就是直接嵌入base64编码格式的图片 <img src="data: image/jpeg;base64,/9j/4AAQSkZJkAAD/7AEAAAAPAAA/ AGTAAAAAAf/bAIQABgQEBAUEBgUFBgkGBQYJCwgGBggLDAoKCwoKD...." />
好处
可以极大的减少图片请求的数量
缺点
增加了页面的大小,会影响页面的加载时间,但这个问题可以通过开启gzip压缩来弱化
注意
改用这种方式后,对图片的存储方式,或者后端的代码都可能产生影响,建议在适当的场景使用,例如常用的一些静态资源图片