因為專案需求,需要盡可能地降低圖片的檔案容量,可是一旦過度壓縮客戶又會哀哀叫說圖片變得好醜,只好來協尋是否有優質的無損壓縮方案,畢竟人的肉眼分辨能力有限,在壓縮比率、檔案容量與肉眼識別度三者中應該能找到一個平衡點。
在詢問過 Google 大神之後得到了幾個比較多人推薦的方案:
前兩項是針對 JPG 圖檔壓縮,第三項是針對 PNG 圖檔壓縮,最後選擇了 mozjpeg 與 OptiPNG 運用於專案中。
選擇的原因很直覺,因為 mozjpeg 是由 mozilla 所推出且 Facebook 也有贊助並使用於 FB 上,感覺上比較有保障,至於 PNG 圖檔,找來找去總是先看到 OptiPNG 的參考資料,就先選擇它了。
安裝與使用 OptiPNG 先從簡單的開始講,如果是 ubuntu 使用者,只要透過 apt-get 即可安裝 OptiPNG。
apt-get install optipng
基本用法為「指令 檔案」(注意:它會覆蓋原圖檔)
optipng test.png
進階一點的用法,你可加上一些參數設定:
像是 -o
來設定不同的 optimization level
optipng -o 5 test.png
optipng -o 7 test.png
安裝與使用 mozjpeg mozjpeg 的安裝我採用的是先 make 出一個 .deb,再透過 .deb 安裝,這樣做的原因是為了方便後續可以快速轉移到各台不同的 ubuntu 上安裝。
首先找一檯乾淨的 ubuntu 的 VM(個人潔癖問題),安裝好 bulid 所需的基本軟體(參考官方文件)
apt-get install autoconf automake libtool nasm make
另外你可能也需要安裝 pkg-config
apt-get install pkg-config
接著將 source code 抓回來,看是要直接下載或透過 git 皆可。
git clone https://github.com/mozilla/mozjpeg.git
接著就來make deb
autoreconf -fiv mkdir build && cd build sh ../configure make deb
沒有遇到意外的話,即可得到 mozjpeg_3.1_amd64.deb
(依據你的環境與版本可能會些差異)
最後再透過 dpkg 來安裝
dpkg -i mozjpeg_3.1_amd64.deb
安裝成功即可發現多了 /opt/mozjpeg
,並且可以在 /opt/mozjpeg/bin
找到我們需要的指令 cjpeg
。假設你不希望安裝在這個路徑,在前面的 sh ../configure
時可以指定你的安裝路徑,一般會建議設為 /usr
。
sh ../configure –prefix=/usr
mozjpeg 的基本用法為「指令 來源檔案 > 輸出檔案」
cjpeg input.jpg > output.jpg
進階一點的用法,一樣可以加上一些參數設定:
像是設定壓縮品質
cjpeg -quality 95 input.jpg > output.jpg
或者產生一個灰階的圖檔
cjpeg -grayscale -quality 95 input.jpg > output.jpg
其實圖片壓縮與圖像演算是另一個專業的領域,真的了解的專家才能更進深的根據需求來使用這些工具。
題外話,jpegoptim 在 ubuntu 上也可以輕易安裝。
apt-get install jpegoptim
這或許是另一個可以優先考慮採用它的點?但反正 mozjpeg 可以 make deb,所以我還是選擇了 mozjpeg。
參考資料: