Lunar Style CSS Compiler: Konzept zur Prüfung von CSS-Builds

Ein Konzept für ein Build-Werkzeug, das die Tailwind-Quellerkennung und dynamische Klassen prüft und CSS-Größe sowie Darstellungsfehler gemeinsam bewertet.

1. Vorhandene Build-Funktionen zuerst prüfen

Dieses Dokument beschreibt ein Konzept zur Prüfung von CSS-Builds. Es behauptet weder die Veröffentlichung eines eigenen Compilers noch bestimmte Leistungswerte. Tailwind erkennt mögliche Klassennamen in den Quellen und erzeugt die dafür benötigten Styles. Eine Optimierung darf daher nicht von der Annahme ausgehen, dass grundsätzlich sämtliche Utility-Styles im Bundle landen.

Tailwind erkennt Klassen anhand von Zeichenfolgen im Quelltext. Dies ist keine AST-Analyse, die das Laufzeitverhalten eines Programms versteht; dynamisch zusammengesetzte Klassennamen können daher unentdeckt bleiben. Die Konfiguration ist anhand der offiziellen Dokumentation zur Quellerkennung zu prüfen.

2. Prüfablauf

• Statt dynamisch zusammengesetzter Klassen werden vollständige Klassennamen verwendet, die im Quelltext erkennbar sind.
• Pfade, die die Standarderkennung nicht berücksichtigt, etwa gemeinsame UI-Pakete, werden ausdrücklich registriert.
• Vor und nach dem Entfernen von CSS werden responsive Ansichten, das dunkle Design sowie hover-, focus- und disabled-Zustände verglichen.
• Neben der ursprünglichen Dateigröße wird unter gleichen Bedingungen auch die Übertragungsgröße mit gzip oder Brotli gemessen.

3. Ergebnisse einordnen

Eine kleinere CSS-Datei allein garantiert keinen bestimmten LCP-Wert. Bilder, Schriftarten, Serverantwort und Renderingpfad wirken ebenfalls darauf ein. Vergleiche von Build-Zeiten und Browserkennzahlen müssen Gerät, Cachezustand, Netzwerkbedingungen und Anzahl der Durchläufe dokumentieren.

Maßstab dieses Konzepts sind nachvollziehbare Konfigurationsänderungen und reproduzierbare Messverfahren anstelle unbelegter Einsparungsquoten oder Verarbeitungszeiten.