Output will appear here...CSS Minifier & Beautifier は双方向のスタイルシート ツールです。ブラウザーが必要としないすべてのものを削除して CSS を圧縮します。コメント、空白、冗長なセミコロン、長尺の 16 進色、単位の値をゼロの単位で — プロセスを逆にして、単一行の本番バンドルを読み込み可能な適切なインデントされたルールに戻します。 レンダリング ブロック スタイルシートから取り除くバイトごとに、ブラウザがダウンロードしてすぐに解析できるバイトが、最初のコンテンツ フル ペイントや最大のコンテンツ ペイントなどのコア Web Vitals メトリックを直接フィードします。
ミニファイアは意図的に保守的です。 文字列リテラル、url() 値、および calc() 式を完全に認識しているため、calc(100% - 20px) が依存する空白を削除せず、コンテンツ文字列内の色のようなテキストを書き換えたり、div:hover と div:hover を区別する間隔に触れたりしないでください。 一般的な手書きのスタイルシートでは、Gzip の前に 25 ~ 40% のサイズの縮小が期待できます。GZIP または Brotli をワイヤーで組み合わせても、圧縮が反復的でコメントのない入力でよりよく機能するため、縮小によって意味のあるスライスが削られます。
すべてのブラウザでは、すべて 100% クライアント側で実行されます。 CSS がアップロード、ログ、またはサーバーに保存されることはありません。つまり、独自のデザイン システム コード、未発表の製品スタイル、またはクライアント ワークを安全に貼り付けることができます。 また、ページがロードされるとオフラインでも機能します。完全な PostCSS または ESBuild パイプラインを配線せずに、簡単な Minify パスが必要な場合に役立ちます。
スタイルシートを入力領域にドロップします — 単一のルール、コンポーネント ファイル、または完全な本番バンドルです。 フォーマット済みの CSS と既に縮小された CSS の両方が受け入れられます。
[ミニファイ] をクリックして本番環境に圧縮するか、[ビューティファイ] をクリックして、ルール間の空白行を使用して、ミニファイド コードを 1 行につき 1 つの宣言に展開します。 美化するには、最初に好みのインデントを選択してください。
このツールは、サイズの前後の正確なサイズとパーセンテージの変更 (例: "12.4 KB → 8.1 KB, -34%") を報告するので、トランスフォームが何を購入したかを正確に知ることができます。
クリックするだけで結果をクリップボードにコピーするか、ビルド出力または CDN にドロップする準備ができている .css ファイルとしてダウンロードします。
文字列リテラル、url() 値、calc() の間隔を尊重します — 有効な CSS を破損することなく積極的に圧縮します。
#ffff を #ffff に書き換え、0px を 0 に書き換えて安全であることが証明され、空白の除去を超えて余分なバイトを絞り込む
バナーのコメントをそのまま維持するため、ライブラリ ライセンス ヘッダーは最小限に抑えられ、標準のビルド ツールの動作に一致します。
ミニファイド バンドルを、本番環境の問題をデバッグするための 2、4、または 8 のスペース インデントを設定可能な、読みやすいルールに展開します。
Minify HTML markup for faster page loads or beautify it for readable, indented source
Format messy SQL into readable, indented queries or minify SQL to a single line
Format, validate, and minify JSON data
Create beautiful CSS gradients with live preview
0 comments
No comments yet. Be the first to share your thoughts!