Convert Image to Data URI with JavaScript

為何不用tinypng把圖片變小就好, 而是需要變成Data URI呢?

為了減少HTTP request，瀏覽器每下載一個圖檔或CSS就會觸發一個HTTP request，而每個HTTP流程都會額外產生HTTP Header、TCP/IP Header等資料量，data URI scheme則是將文件Base64編碼內嵌在網頁中不額外觸發HTTP request，Page speed更快速有效率。

這篇文章有介紹如何製作Data URI,

Convert Image to Data URI with JavaScript:

https://davidwalsh.name/convert-image-data-uri-javascript