PNG 轉 WebP

這正是 PNG 轉 JPG 解決不了的那個問題的答案。WebP 像 JPEG 一樣壓得很兇，卻像 PNG 一樣保留 alpha 通道 —— 這讓它成為 logo、icon、去背商品圖、UI 素材的正確目標格式。

為什麼非照片類的圖，這個比 PNG 轉 JPG 好

PNG 轉 JPG 在非照片影像上有兩個致命點：透明度被摧毀，而且 JPEG 會在銳利邊緣和文字周圍產生可見的振鈴。WebP 兩個問題都沒有。它帶完整的 alpha 通道，處理硬邊緣也好得多。

體積差距很可觀。在我們的圖形測試圖上（平色、硬邊、透明背景）：來源 PNG 是 46 KB；轉成品質 75 的 WebP 是 24 KB；同樣品質的 JPEG 是 37 KB，而且透明度完全消失。

「有損 WebP 帶透明度」是真的存在的

這件事會讓認為「有透明度就等於無損」的人意外。WebP 在有損和無損兩種模式下都支援 alpha 通道 —— 這正是它能在大量網頁圖片上取代 PNG 的原因。

即使在有損模式下，alpha 通道本身仍是無損壓縮的，所以去背圖的邊緣保持乾淨，底下的色彩資料則被大幅壓縮。這個組合在任何其他廣泛支援的格式上都拿不到。

什麼時候該留著 PNG

如果圖片必須畫素完全精確 —— 當作佐證的螢幕截圖、貼圖圖集、會被軟體縮放的 icon —— 就留在無損。WebP 也有無損模式，但如果全面相容性比位元組更重要，PNG 仍然是比較安全的產物。

也值得先確認你的 PNG 是不是根本沒最佳化過。截圖工具或匯出對話框寫出來的 PNG，往往比需要的大很多，光是做無損最佳化就可能砍掉一半，而且一個畫素都沒動。

不上傳，沒有天花板

解碼和編碼都透過 WebAssembly 在這個瀏覽器分頁裡完成。你的檔案從未被傳輸，所以除了裝置記憶體之外沒有大小限制，沒有次數額度，不用註冊。

你可以直接驗證：打開開發者工具切到 Network 分頁，轉一張圖 —— 不會出現任何夾帶你檔案的請求。