Squooshの実行ボタンが消えた？！なので画像圧縮ツールを自作しました【ブラウザ完結の安心設計】

サイトに載せる画像を圧縮しようと、いつも使っていたGoogle製の無料ツール「Squoosh」を開いたところ、こんな不具合に遭遇しました。今回はその検証結果と、代わりに自作した画像圧縮ツールについての記事です。

結論から言います

あなたのサイト、こんなことになっていませんか？

一つでも当てはまるなら、手元の環境固有の問題ではなく、ツール側の不具合の可能性があります。

なぜこの問題が起きるのか

Squooshは、mozjpegやlibwebpといった実際の画像コーデックをWebAssemblyに移植して動かす、比較的作り込まれた仕組みのツールです。多機能で高機能な分、内部の作りも複雑になりやすく、メンテナンスが止まると不具合が表面化しやすい、という側面があります。

今回、GitHub上のリポジトリを確認したところ、正式に「アーカイブ済み」とはされていないものの、最終コミットから長期間が経過していました。開発が事実上止まっている状態だと考えられます。

実際に確認したこと

自分の環境で、実際に操作しながら確認した内容です。

パターン別の対処法

パターン①: しばらく様子を見る。開発が再開されれば修正される可能性はありますが、更新が長期間止まっている状況を踏まえると、あまり期待しすぎない方が良さそうです

パターン②: 他の画像圧縮ツール・サービスに乗り換える

パターン③: 必要最低限の機能に絞った、シンプルな圧縮ツールを使う

パターン③については、今回ちょうど自作したツールがあるので紹介します。

ブラウザ標準の画像変換機能だけを使ったシンプルな圧縮ツールで、画像はサーバーに送信されず、ブラウザの中だけで処理が完結する設計にしています。独自の圧縮アルゴリズムを実装しているわけではなく、ブラウザにもともと備わっている変換機能を呼び出しているだけなので、仕組みとしてもシンプルです。対応ブラウザは、主要なブラウザであれば2022〜2023年以降のバージョンで動作します。非対応の環境では、警告を表示して機能を無効化する作りになっているので、動かないまま固まってしまうことはありません。

このツールは、noteのマガジン特典として配布しています。気になる方はこちらからどうぞ。

まとめ

今回の一件で、「壊れている」と決めつける前に、複数の環境で再現するかどうかを確認することの大切さも実感しました。1つの環境だけでの不具合だと、単なる相性問題である可能性も残るためです。

---