デジカメやスマートフォンの普及によってデジタル画像コンテンツが爆発的に増えています。さらに、その画質は年々向上しており、サイズも肥大化しています。撮った写真をそのまま載せると数十MBあるということも少なくありません。 そこで必要なのがリサイズであったり品質を変更した画像サイズの縮小処理です。今回はJavaScript/WebAssemblyで書かれたJPEGエンコーダー、Guetzli.jsを紹介します。

Guetzli.jsの使い方

元画像です。あまりサイズの大きい画像だとメモリのエラーが出ます。

95%の品質にした場合。サイズは16KBから15KBに減少しました。

さらに40まで減らした場合。こちらはさらにサイズが減って、10KBになりました。

Guetzli.jsはJavaScript版とWebAssembly版が用意されています。クライアントサイドでエンコーディングしてサイズを小さくしてからアップロードするのは良さそうです。もちろん、WebAssembly版の方が高速に処理を行えます。速度の比較を行ったり、WebAssembly開発の参考にもなりそうです。

Guetzli.jsはJavaScript/C言語製のオープンソース・ソフトウェア(Apache Licnese 2.0)です。

Guetzli.js JavaScript Encoder dominikhlbg/Guetzli.js: A JavaScript JPEG Encoder (my first emscripten)