新しいコーデックのサポート、デザインの更新、CLI のサポート！
Squoosh は、Google のチームが構築し、Chrome Dev Summit 2018 で発表した画像圧縮アプリです。このツールは、さまざまな画像コーデックを簡単に試して、最新のウェブの機能を実証できるようにするために作成されました。
本日、アプリのメジャー アップデートをリリースしました。このアップデートでは、より多くのコーデックのサポート、新しいデザイン、Squoosh CLI と呼ばれるコマンドラインで Squoosh を使用する新しい方法が追加されています。
新しいコーデックのサポート
ブラウザでネイティブにサポートされているコーデックに加えて、OxiPNG、MozJPEG、WebP、AVIF もサポートされるようになりました。WebAssembly を使用することで、新しいコーデックが再び可能になりました。コーデック エンコーダとデコーダを WebAssembly モジュールとしてコンパイルすることで、ユーザーは、優先ブラウザがサポートしていない新しいコーデックにアクセスして試すことができます。
コマンドライン版 Squoosh! を起動する
2018 年の初回リリース以来、UI なしで Squoosh をプログラムで操作したいというユーザーからのリクエストがよく寄せられていました。アプリはコマンドライン ベースのコーデック ツールの上に UI を重ねたものだったため、このパスについては少し迷いました。ただし、複数のツールではなくコーデックのパッケージ全体を操作したいというご要望は理解しております。Squoosh CLI はまさにそれを実現します。
Squoosh CLI のベータ版は、npm i @squoosh/cli を実行してインストールするか、npx @squoosh/cli [parameters] を使用して直接実行できます。
Squoosh CLI は Node で記述されており、PWA が使用する WebAssembly モジュールとまったく同じものを使用しています。ワーカーを広範囲に使用することで、すべての画像が並列でデコード、処理、エンコードされます。また、Rollup を使用して、すべてを 1 つの JavaScript ファイルにバンドルし、npx によるインストールが迅速かつシームレスに行われるようにしています。CLI には自動圧縮機能もあります。この機能は、視覚的な忠実度を損なうことなく（Butteraugli 指標を使用）、画像の品質を可能な限り低下させようとします。
Squoosh CLI を使用すると、ウェブアプリの画像を複数の形式に圧縮し、<picture> 要素を使用して、ブラウザに最適なバージョンを選択させることができます。また、Webpack、Rollup などのビルドツール用のプラグインを構築し、イメージの圧縮をビルドプロセスの自動化された一部にすることも計画しています。
ビルドプロセスを Webpack から Rollup に変更
Squoosh を構築したチームは、今年の Tooling Report のためにビルドツールを調査し、ビルドプロセスを Webpack から Rollup に切り替えることにしました。
このプロジェクトは、チームで試してみたかったため、当初は Webpack で開始されました。2018 年当時、Webpack はプロジェクトを思いどおりに設定できる十分な制御機能を提供してくれる唯一のツールでした。時間の経過とともに、Rollup の簡単なプラグイン システムと ESM のシンプルさが、このプロジェクトに最適な選択肢であることがわかりました。
UI デザインを更新しました
また、blobs をビジュアル要素として使用するアプリの UI デザインも更新しました。これは、コードでデータを扱う方法に関するちょっとした駄洒落です。Squoosh は画像データを blob として渡すため、デザインに blob を含めるのは自然なことでした（おわかりでしょうか？）。
色の使用も洗練され、色はアクセントとしてだけでなく、どの画像がオプションのコンテキストにあるかを区別して強調するベクトルとしても機能するようになりました。全体的に、ホームページはより活気があり、ツール自体はより明確で簡潔になっています。
次のステップ
今後も Squoosh の開発を続けていく予定です。新しい画像形式がリリースされるにあたり、ユーザーが負担なくコーデックを試せる場所を提供したいと考えています。また、Squoosh CLI の使用を拡大し、ウェブ アプリケーションのビルドプロセスにさらに統合することも目指しています。
Squoosh は常にオープンソースでしたが、コミュニティの成長に重点を置いたことはありませんでした。2021 年には、コントリビューターの基盤を拡大し、プロジェクトへのオンボーディング プロセスを改善する予定です。
Squoosh について何かアイデアはありますか？Issue Tracker でお知らせください。チームは長い冬休みに入りますが、新年には必ずご連絡いたします。