base64编码的图片有什么用

1. 什么是图片的base64编码

图片的base64编码就是可以将一张图片数据编码成一串字符串，使用该字符串代替图像地址url。

网页上展示的时候是这样的（后面的…非常长）

我们所看到的网页上的每一个图片，都是需要消耗一个 http 请求下载而来的，一个http请求就是一个网络开销。

图片的下载始终都要向服务器发出请求，要是图片的下载不用向服务器发出请求，而可以随着 css 的下载同时下载到本地，那不是非常节省网络开销（一次就够）？base64 正好能解决这个问题。

2. 什么时候用呢？优点呢？

如果图片足够小且因为用处的特殊性无法被制作成雪碧图（CssSprites），在整个网站的复用性很高且基本不会被更新，这时那么我们就可以将这个图片转为 base64编码

1. 减少http请求次数（最关键的）
2. 采用base64的图片随着页面一起下载，因此不会存在跨域请求的问题
3. 没有图片更新要上传图片，因此不会造成清理图片缓存的问题

3. 缺点

1. 增加css文件的大小。
2. 浏览器兼容性,支持ie10及以上
3. 解析css的时间增长

4. 合理使用

base64虽有优点，但是其缺点也很明显

虽然减少了http请求，但是增加了css文件的体积，导致渲染时间过长，空白屏幕时间增长所以和CssSprites之间根据场景择优使用