ImageMagick で WebP

WebP の仕様自体は何年も前からあって今更感ありますが、Facebook での導入のゴタゴタで世の中への認知が拡がる感があり、便乗して ImageMagick で WebP を扱う件のメモです。

はじめにまとめ

  • ImageMagick v6.6.8 (2011年3月)から WebP に対応
  • ImageMagick の build 時に libwebp 組み込みが必要 (これしないと convert でエラー出さずに元ファイルの形式のまま .webp に格納する)
  • オプションで lossless=true を指定しないと png からでも不可逆圧縮で変換する。
  • lossless webp は img src だとインライン表示出来るが、URL を直接開くとダウンロード扱い。

仕様が出てから結構たつのに Chrome でしか画像を表示できない状況が心配でなりません。


(2015/08/28 追記) 参考の事 => How We Gain "Mobile First" Using WebP with ImageMagick - Speaker Deck

(2016/06/09 追記)

ImageMagick バージョン

6.6.8 から対応してます。(coders/webp.c が追加されてます)

yoya@sakura:~$ ~/ImageMagick/6.6.8-10/bin/convert madoka.jpg madoka.webp

参考までに 6.6.7 のエラーメッセージ

yoya@sakura:~$ ~/ImageMagick/6.6.7-10/bin/convert madoka.jpg madoka.webp
sh: webpconv: not found
mv: `/tmp/magick-Dvpen1Xs.webp' を stat できません: そのようなファイルやディレクトリはありません
convert: delegate failed `cp "%i" "%i.png"; "webpconv" "%i.png"; rm "%i.png"; mv "%i.webp" "%o"' @ error/delegate.c/InvokeDelegate/1061.

ちょっとした罠

convert で jpeg => webp 変換した madoka.webp の先頭バイナリを見ると、こんな場合があります。

yoya@sakura:~$ hexdump -C madoka.webp | head -1
00000000  ff d8 ff e0 00 10 4a 46  49 46 00 01 01 01 00 48  |......JFIF.....H|

webp 無効で build した ImageMagick だと、しれっと無言でフォーマット変換を無視します。

同様に PNG に対して、

convert madoka.png madoka.webp

とすると、PNG 形式のファイルが .webp に入ります。

ひどいw

libwebp の導入

いまいまの最新は v0.3.0 です。

wget http://webp.googlecode.com/files/libwebp-0.3.0.tar.gz
cd libwebp-0.3.0
./configure
make
sudo make install

これで /usr/local 以下に libwebp がインストールされます。

ImageMagick の build

libwebp が /usr/local なので LD_LIBRARY_PATH を使う方法が世の中でよく見られますが、それだと実行時に毎回 LD_LIBRARY_PATH を指定する手間が面倒になるので、今回は実行ファイルの rpath に埋め込む方式で。

yoya@sakura:~/imagemagick/src/ImageMagick-6.8.4-10$ LDFLAGS="-Wl,-rpath=/usr/local/lib" ./configure --without-perl --without-magick-plus-plus --prefix=$HOME/ImageMagick/6.8.4-10  --with-webp=yes
＜略＞
WEBP              --with-webp=yes		yes
＜略＞
yoya@sakura:~/imagemagick/src/ImageMagick-6.8.4-10$ make install

おまけ実験 (蛇足)

お約束だけど。rpath を埋め込まなかった場合のエラー。

yoya@sakura:~/magica$ ~/ImageMagick/6.8.4-10/bin/convert madoka.png madoka.webp
/home/yoya/ImageMagick/6.8.4-10/bin/convert: error while loading shared libraries: libwebp.so.4: cannot open shared object file: No such file or directory

LD_LIBRARY_PATH を指定すれば大丈夫。

yoya@sakura:~/magica$ LD_LIBRARY_PATH=/usr/local/lib ~/ImageMagick/6.8.4-10/bin/convert madoka.png madoka.webp

本実験

build 時に rpath 指定していれば LD_LIBRARY_PATH 無しでも大丈夫。

yoya@sakura:~/magica$ ~/ImageMagick/6.8.4-10/bin/convert madoka.png madoka.webp
yoya@sakura:~/magica$ ~/ImageMagick/6.8.4-10/bin/convert madoka.png -define webp:lossless=true madoka-lossless.webp

今度は大丈夫。先頭見ても WebP っぽい。(RIFF コンテナなんですね)

yoya@sakura:~/magica$ hexdump -C madoka.webp | head -1
00000000  52 49 46 46 02 7d 02 00  57 45 42 50 56 50 38 20  |RIFF.}..WEBPVP8 |
yoya@sakura:~/magica$ hexdump -C madoka-lossless.webp | head -1
00000000  52 49 46 46 12 84 10 00  57 45 42 50 56 50 38 4c  |RIFF....WEBPVP8L|

さて、ファイルサイズは。

yoya@sakura:~/magica$ ls -l
-rw-r--r-- 1 yoya develop 1082394 2013-04-23 21:17 madoka-lossless.webp
-rwxr--r-- 1 yoya develop 1604614 2012-10-30 00:47 madoka.png
-rw-r--r-- 1 yoya develop 163082 2013-04-23 21:15 madoka.webp

元々の PNG が最適化されてない事もありますが、結構サイズ減ります。

madoka.webp は不可逆圧縮なので jpeg と比べないとアンフェアです。以下のは convert で変換した jpeg のサイズです。

yoya@sakura:~/magica$ ls -l madoka.jpg 
-rw-r--r-- 1 yoya yama 538881 2013-04-24 04:23 madoka.jpg

参考