JavaScriptミニファイアー
空白とコメントを削除してJavaScriptをミニファイ
入力
ミニファイされた出力
JavaScriptミニファイアーとは?
JavaScriptミニファイアーは空白、コメントを削除し、コードを短縮してファイルサイズを小さくします。小さいファイルは読み込みが速くなります。ECMAScript仕様が言語を定義しており、ミニファイは動作を保ちながら出力を縮小します。TerserやUglifyJSなどのツールが本番ビルドで同様の手法を使用しています。
このツールは完全にブラウザ内で動作します。サーバーには何も送信されません。JSを貼り付けるかファイルをアップロードすると、ミニファイされた出力が得られます。フォーマット(逆の操作)にはJavaScriptフォーマッターを、検証にはJavaScriptバリデーターを、より強力な保護にはJavaScriptオブフスケーターを使用してください。
このツールの使い方
貼り付けまたはアップロード
左パネルにJavaScriptを貼り付けるか、.jsまたは.txtファイルをアップロードしてください。サンプルで例のコードを読み込めます。クリアでリセットできます。
ミニファイされた出力を表示
右パネルにミニファイされたコードが表示されます。空白とコメントは削除されます。無効なJSはエラーを表示します。
コピーまたはダウンロード
ミニファイされたコードを取得するにはコピーまたはダウンロードを使用してください。本番ではgzipやbrotli圧縮の併用も検討してください。
JavaScriptミニファイアーの例
フォーマットされたJavaScriptコードのミニファイ例です。
例:APIフェッチ関数
フォーマットされた入力:
ミニファイされた出力:
JavaScriptミニファイアーが役立つ場面
webpackやrollupで本番バンドルを準備する際、帯域幅の削減、読み込み時間の最適化に、ミニファイでJSファイルを縮小できます。ビルドツールと併用するか、手動で素早く確認できます。難読化(逆解析を困難にする)にはJavaScriptオブフスケーターを使用してください。
よくある質問
データはプライベートですか?
はい。ミニファイは完全にブラウザ内で行われます。データはサーバーに送信されません。
ミニファイアーとオブフスケーターの違いは?
ミニファイアーはサイズを小さくします。オブフスケーターはコードを読みにくくし、逆解析を困難にします。難読化にはミニファイが含まれることが多いです。
コードが壊れますか?
有効なミニファイは動作を保ちます。セミコロン挿入やエッジケースで問題が起きることがあるため、出力をテストしてください。
ソースマップはどうですか?
このツールはソースマップを生成しません。ソースマップ付きの本番ビルドにはwebpack、rollup、Viteを使用してください。MDNのソースマップを参照してください。
ミニファイを元に戻せますか?
インデントを追加するにはJavaScriptフォーマッターを使用してください。コメントや元の変数名は復元されません。