コード圧縮(Minify)ツール
CSS・HTML・JavaScript をブラウザ内で圧縮(Minify)。コメント除去と空白圧縮でファイルを軽量化し、圧縮前後のサイズと削減率を表示します。
入力コード
圧縮結果
0
圧縮前
0
圧縮後
0%
削減率
使い方
1
タブを選んでコードを貼り付け
CSS / HTML / JavaScript のタブを切り替え、入力欄に圧縮したいコードを貼り付けます。
2
「圧縮する」をクリック
ボタンを押すと、コメント除去と空白圧縮が実行され、圧縮前後のサイズと削減率が表示されます。
3
結果をコピー
「コピー」ボタンで圧縮済みコードをクリップボードに取得し、本番ファイルに貼り付けてご利用ください。
コード圧縮(Minify)とは
Minify(ミニファイ)とは、コードから不要なコメントや空白・改行を取り除き、動作はそのままにファイルサイズを小さくする処理です。ファイルが軽くなることで読み込み速度が向上し、ページ表示やCore Web Vitalsの改善につながります。本ツールはCSSとHTMLは文字列・コメント領域を保護する安全な独自圧縮、JavaScriptは定番のterserで圧縮します。すべての処理はブラウザ内で完結するため、コードがサーバーに送信されることはありません。
機能・特徴
- CSS / HTML / JS 対応タブ切り替えで3種類のコードに対応。それぞれに最適化した圧縮処理を行います。
- 安全な圧縮ロジックCSS・HTMLは文字列やコメント領域を退避して保護し、JSは定番のterserで確実に圧縮します。
- 削減率を可視化圧縮前後のファイルサイズと削減率を表示。効果がひと目で分かります。
- 完全ブラウザ完結すべての処理はブラウザ内で実行。コードはサーバーに送信されず安全です。
活用シーン
- 本番公開前にCSS/JSを軽量化して表示速度を改善
- PageSpeed Insights の「圧縮」指摘への対応
- メール用HTMLやLPのファイルサイズ削減
- ビルド環境がない小規模サイトでの手動Minify
- スニペットやインラインコードのサイズ確認
よくある質問
コード圧縮ツールは無料で使えますか?
はい、完全無料でご利用いただけます。会員登録もインストールも不要で、ブラウザを開くだけですぐにお使いいただけます。
入力したコードはサーバーに送信されますか?
いいえ。圧縮処理はすべてお使いのブラウザ内で完結します。コードがサーバーに送信・保存されることはないため、非公開のコードでも安心してご利用いただけます。
圧縮してもコードの動作は変わりませんか?
Minifyはコメントや空白・改行の除去が中心で、原則として動作は変わりません。ただしCSSのcalc()や特殊な記法、HTMLのインライン要素間の空白に依存するレイアウトなど、ごく一部で表示が変わる場合があります。本番反映前に必ず動作確認を行ってください。
JavaScriptはどのように圧縮されますか?
定番のJS圧縮ライブラリ「terser」を利用し、コメント除去・空白圧縮に加えて変数名の短縮なども行います。ライブラリを読み込めなかった場合は、コメントと空白の除去のみの簡易圧縮にフォールバックし、その旨を表示します。
CSSやHTMLの圧縮でコメント内の文字列も壊れませんか?
文字列リテラルやコメント領域をいったん退避してから空白を圧縮し、最後に復元する安全な方式を採用しています。クォート内の記号やコメント内の波括弧などが誤って圧縮されることはありません。
スマートフォンでも使えますか?
はい、スマートフォン・タブレット・PCなど、すべてのデバイスでご利用いただけます。