JavaScript ミニファイア
高速で構造的な JavaScript ミニファイ — コメント除去、空白圧縮、空行削除。ビフォア/アフターのサイズと節約率を表示。
上に入力すると結果が表示されます。
用途
構造的な JavaScript ミニファイアは、コードの動作を変えずにコメントと不要な空白を取り除きます。出力は入力と機能的に同一で、識別子もロジックも同じまま、長さだけが短くなります。本ツールはこの処理をブラウザ内で実行します。文字列の中身や正規表現リテラルは触らず、ASI(自動セミコロン挿入)が動作を変えてしまう箇所では改行を保持します。
使うべきタイミング
- HTML ブックマークレットや単一ファイルのデモのために、ビルドチェーンなしでスニペットをサクッと圧縮したいとき。
- 本格的なオプティマイザを導入する価値があるか判断する前に、手書きスクリプトの「贅肉」を見積もりたいとき。
- バンドラを引っ張ってこずに、静的サイトに小さなライブラリをインライン化したいとき。
よくある注意点
- これは構造的ミニファイで、コンプレッサではありません。 変数のリネーム、デッドコード除去、プロパティのマングル、ツリーシェイクは行いません。本番ビルドではパイプラインで
terser、esbuild、swcを使ってください。構造的ミニファイの上にさらに 30〜60% の削減を期待できます。 - ASI のトラップ。 JavaScript は思いがけない場所にセミコロンを挿入します。本ミニファイアは、改行を取り除くと意味が変わってしまう箇所(例:
return\n{}≠return {})では改行を保持します。可能ならソースで明示的にセミコロンを書く方がミニファイにとって安全です。 - ソースマップは生成しません。 本番に圧縮 JS を出すなら、デバッグのために本物のツールチェーンでソースマップを併せて出力してください。
- 現代では転送時の圧縮が支配的です。 ワイヤ上の Brotli/gzip がミニファイの大半の効果を担います。最大の削減は未使用コードの除去から得られ、これは構造的ミニファイヤだけでは達成できない静的解析を要します。
- ミニファイ済みをコミットしないこと。 ソースは整形済みでコミットし、ビルド/デプロイ時にミニファイします。