# CSSコードが重複してしまう原因
長期プロジェクトのメンテナンスやレガシーコードの作業では、複数の開発者が重複したCSSルールを書いてしまうことがよくあります。既存のデザインを壊すのが怖いため、元のコードを修正・リファクタリングするよりも、ドキュメントの末尾に新しいルールを追加する方を選びがちです。その結果、何十もの重複セレクターを抱えた非効率なファイルが生まれ、可読性を損なうだけでなく、Webページのダウンロードサイズも大幅に増加させてしまいます。# Webパフォーマンス(Web Vitals)への隠れた影響
スタイルシートファイルはブラウザのレンダリングをブロックします(Render-Blockingリソース)。完全なCSSOMをダウンロードして構築し終えるまで、画面は真っ白なままです。# 重複ルールを統合する仕組み
このツールはインテリジェントなアセンブラーとして機能します。従来のミニファイアのように空白を圧縮するだけでなく、テキストを再帰的にスキャンして同一のセレクターパターンを検出します。-
.box { color: red; }というルールがあり、100行後に.box { padding: 10px; color: blue; }がある場合を想像してください。このツールは両方のブロックを同じ.boxセレクターの下に統合し、paddingをマージします。 - CSSカスケードの保全:直接的な競合がある場合、アルゴリズムは最後に宣言されたプロパティを厳密に保持します。これにより、ドキュメントをクリーンアップしても元のレイアウトが崩れません。