CSS-Minifizierer

Leerzeichen und Kommentare zu entfernen ist der offensichtliche, einfache Teil der Minifizierung — jeder Minifizierer macht das, und für sich genommen ist es kaum mehr als ein Suchen-und-Ersetzen-Durchlauf. Der Teil, der einen echten CSS-bewussten Minifizierer von naivem Leerzeichen-Entfernen unterscheidet, ist alles, was tatsächliches Verständnis des Stylesheets erfordert: Kurzform-Wertkompression, bei der eine Farbe wie `#ffffff` zu `#fff` wird und redundante Null-Einheiten gekürzt werden, und das Zusammenführen doppelter oder überlappender Regeln, bei dem zwei Regeln, die letztlich dieselben Deklarationen anwenden, zu einer kombiniert werden. Beides erfordert, das CSS zunächst in eine echte Struktur zu analysieren — zu wissen, welcher Selektor zu welchen Deklarationen gehört und welche Werte gleichwertig sind —, weshalb csso einen echten Syntaxbaum aufbaut statt Text nach Mustern zu durchsuchen, aus demselben Grund, aus dem sich ein echter Parser gegenüber einem Regex-Durchlauf auszahlt.

Moderne Build-Tools minifizieren ihre CSS-Ausgabe automatisch als Teil eines Produktions-Builds, daher passiert Minifizierung für jeden, der in einem gebündelten Projekt arbeitet, bereits unsichtbar bei jedem Build. Ein eigenständiges Tool wie dieses deckt ab, was außerhalb dieser Pipeline liegt: ein CMS oder eine Plattform ganz ohne Build-Schritt, ein schnelles einmaliges Snippet, das irgendwo größenbeschränkt hineinpassen muss, oder einfach zu prüfen, wie stark ein gegebenes Stylesheet tatsächlich schrumpfen würde, bevor man entscheidet, ob sich das Aufsetzen von Tooling lohnt. Für eine einzelne, einmal benötigte Datei ist es der schnellere Weg zum selben Ergebnis, das ein Bundler erzeugen würde, sie hier einzufügen und das Ergebnis zurückzukopieren.

Ein CSS-bewusster Minifizierer ist bewusst zurückhaltend bei dem, was er zusammenführt oder umschreibt: Benutzerdefinierte Eigenschaften (CSS-Variablen), Media Queries, Keyframe-Animationen und herstellerspezifische Präfix-Deklarationen bleiben alle exakt so erhalten, wie sie geschrieben wurden, weil ein falsches Zusammenfassen still ändern könnte, wie eine Seite auf manchen Browsern oder Bildschirmgrößen gerendert wird, statt nur, wie der Quellcode aussieht. Die Optimierungen, die sicher automatisch vorgenommen werden können — Leerzeichen, Kommentare, Kurzform-Werte, wirklich doppelte Regeln — sind diejenigen ohne jede mögliche Auswirkung auf die gerenderte Seite, was das gesamte Designprinzip hinter der Verwendung eines echten Parsers statt eines stumpferen, riskanteren Suchen-und-Ersetzen-Ansatzes ist.