JavaScript コード整形 & 縮小ツール
乱雑な JavaScript をカスタムのインデントと中括弧のスタイルで整形したり、縮小してファイルサイズを削減したりできます。ES6+ をサポート。完全にブラウザ内で実行されます。コードがデバイスから離れることはありません。
JavaScript を整形・縮小する方法
このツールの使い方
JavaScript を入力パネルに貼り付け、モードタブから 整形 または 縮小 を選択すると、結果が即座に表示されます。処理前に、インデントサイズ、ブレーススタイル、改行処理などのオプションを調整します。出力をコピー をクリックしてクリップボードにコピーするか、.js をダウンロード でファイルを保存します。
整形オプションの説明
- ブレーススタイル —
Collapseは{を同じ行に置きます (K&R / 標準 JS スタイル)。Expandは{を新しい行に置きます(Allman スタイル)。End-expandはハイブリッドで、elseとcatchが新しい行に配置されます。 - 改行を保持する — 元のコードに存在する空白行をそのまま保持します。スペースを論理的なグループ分けとして使用するコードに役立ちます。
- JSLint-happy — Douglas Crockford の JSLint が強制するスタイルに合わせます。関数式の
(の前にスペースが入るなど、いくつかの調整が行われます。 - 文字列のエスケープ解除 —
\xNNおよび\uNNNNエスケープを、安全な場合にリテラル文字に戻します。
縮小オプションの説明
- /*! ライセンス */ を保持 —
/*!で始まるコメントを保存します。これはほとんどのライブラリが MIT/Apache 著作権ヘッダーを示すために使用する慣例で、配布コードに残す必要があります。 - 末尾のセミコロンを削除 —
}の直前の;を削除します。バイトを節約できますが、差分が読みにくくなるため、デフォルトではオフです。
縮小ツールは意図的に保守的な設計で、空白とコメントのみを削除します。変数の名前変更、プロパティの変更、AST レベルのデッドコード削除は行いません。より積極的な最適化には、ビルドパイプライン内で terser または esbuild を使用してください。
js-beautify による提供
整形エンジンは js-beautify を使用しています。VS Code、Sublime Text、Atom など主要なオンラインフォーマッタと同じライブラリです。すべてがブラウザ内でローカルに実行されます。アップロード不要、サーバー通信なし、レート制限なし。500 KB の縮小バンドルをミリ秒単位で整形できます。
よくある質問
私の JavaScript コードはサーバーに送信されますか?
いいえ。すべての整形と縮小は、CDN から読み込まれた js-beautify を使用してブラウザ内で完全に処理されます。コードがデバイスから離れることはありません。
整形と縮小の違いは何ですか?
整形は適切なインデントと改行を使用してコードをフォーマットし、人間が読みやすくします。縮小は空白、コメント、不要な文字を削除してファイルサイズを削減し、本番環境向けに最適化します。
縮小ツールは変数の名前を変更しますか?
いいえ。このツールは空白とコメントの削除のみを実行します。変数の名前変更、識別子のマングル、AST レベルの最適化は行いません。より高度な圧縮には Terser、UglifyJS、esbuild をビルドパイプラインで使用してください。
ES6+ の構文を処理できますか?
はい。整形ツールはアロー関数、テンプレートリテラル、async/await、クラス、分割代入、スプレッド/レスト、オプショナルチェーン、Null 合体演算子など最新の JavaScript をサポートしています。
どのようなブレーススタイルオプションが利用できますか?
3 つのスタイル: Collapse(文と同じ行に開き括弧)、Expand(新しい行に開き括弧)、End-Expand(同じ行で開くが else と catch は新しい行)。