Squooshの使い方｜画像をWebPへ変換し、保存前後の容量を比べる

今回の仕上がり

JS Paintで描いた自作の家を変換しました。元は683×384px、683バイトのPNGです。WebPは品質75・Effort 4で1,562バイト、MozJPEGは品質75で3,881バイト。サイズ変更や減色は使っていません。

公式ページ中央の画像選択ボタンを押し、端末の画像を選びます。編集画面に移ると、左側が元画像、右側が変換後の表示になります。中央の境界を左右へ動かすと、同じ場所の違いを見比べられます。

最初の右側設定はMozJPEG・Quality 75でした。圧縮率の数字に上向き矢印がある場合は、容量が増えています。今回は「3.88 kB」「↑468%」と表示されました。

右側のCompressの一覧を開き、WebPを選びます。処理が終わり容量表示が落ち着いてから、QualityとEffortを確認します。今回はLosslessを選ばず、Quality 75・Effort 4のまま試しました。左右で設定を変えられるため、元画像側の一覧を変えていないかにも注意します。

右下のDownloadを押して、変換後のファイルを保存します。本確認ではサイドブラウザーの取得がタイムアウトしたため、別の検証用ブラウザーで同じ操作を行いました。JPEGとWebPの保存、683×384pxの維持、別ビューアーでの表示まで確認しています。押しただけを保存成功とは扱っていません。

公式READMEは画像処理が端末内で行われると説明する一方、Google Analyticsによる基本情報と変換前後のサイズ値などの収集も記しています。画像を送らないことと、通信が一切ないことは同じではありません。秘密の画像を使った安全性監査はしていません。

オンライン版は登録・支払いなしで試せました。個人制作と断定せず、GoogleChromeLabsと貢献者の皆様のツールとして紹介しています。ソフトウェアはApache 2.0で、画面出典とライセンス全文を併記します。入力画像の権利は別に確認してください。

写真、大容量画像、透過画像、AVIF、スマホ実機は未検証です。今回の容量差を詳しく読む場合は、圧縮で容量が増える理由の検証へ。最近のX検索は行いましたが、Squoosh自体が新たに流行しているとは確認できていません。