圖片的 base64 編碼就是可以將一副圖片數據編碼成一串字符串，使用該字符串代替圖像地址。
將圖片轉換為base64編碼最常見的應用應該就是在將網頁中的一些圖片轉換為base64編碼可以實現網頁圖片在網速不好的時候先於內容加載和減少HTTP的請求次數來減少網站服務器的負擔。
圖片轉換成base64有兩大好處
1.主要：減少了HTTP請求
我們的網站采用的都是HTTP協議，而HTTP協議是一種無狀態的鏈接，就是連接和傳輸后都會斷開連接節省資源。此時解決的方法就是盡量的減少HTTP請求，此時base64編碼可以將圖片添加到css中，實現請求css即可下載下來圖片，減少了在此請求圖片的請求。當然減少HTTP請求次數的方法還有很多，如css sprite技術，將網頁中的小圖片拼在一張大圖片中，下載時只需要一次完整的HTTP請求就可以，減少了請求次數。
2.提前加載圖片的應用
把css中的圖片使用成base64編碼的，css是在html頭部引用的，要優先於下面的內容被加載，所以在網速不好的時候就會出現先加載出base64圖片。
圖片轉換成base64有兩大缺點
使用 Base64 不代表性能優化 使用 Base64 的好處是能夠減少一個圖片的 HTTP 請求，然而，與之同時付出的代價則是 CSS 文件體積的增大。 CSS 文件的體積直接影響渲染，導致用戶會長時間注視空白屏幕。HTML 和 CSS 會阻塞渲染，而圖片不會。
頁面解析 CSS 生成的 CSSOM 時間增加 Base64 跟 CSS 混在一起，大大增加了瀏覽器需要解析CSS樹的耗時。其實解析CSS樹的過程是很快的，一般在幾十微妙到幾毫秒之間。
圖片轉換成base64體積到底是增大了還是縮小了
Base64圖片編碼原理Base64編碼要求把3個8位字節（38=24）轉化為4個6位的字節（46=24），之后在6位的前面補兩個0，形成8位一個字節的形式。 如果剩下的字符不足3個字節，則用0填充，輸出字符使用’=’，因此編碼后輸出的文本末尾可能會出現1或2個’=