Seit 2012 benutzte dieses Blog scss für die Styles. Zunächst mit dem ursprünglichen Ruby-Sass-Präprozessor, später dann mit sassc. Aber auch sassc (basierend auf LibSass) wird nicht mehr weiter entwickelt. Ich müsste jetzt zur Dart-Version wechseln.
Nun versuche ich ja, unnötige Abhängigkeiten zu vermeiden. Und dieser notwendige Wechsel stellt mich vor die Frage: Brauche ich scss überhaupt noch für dieses Blog? Listen wir mal die Hauptsächlichen Vorteile auf, die mir SASS in diesem Blog bringt:
- ich kann die Styles strukturiert auf mehrere Dateien verteilen
- ich kann Selektoren verschachtelt einsetzen
- ich kann Variablen (z.B. für Farben) verwenden, so dass ich bei einem Farbwechsel nicht überall Werte ersetzen muss
- der scss-Präprozessor entfernt Kommentare und unnütze Whitespaces aus den Style-Dateien
Gehen wir kurz durch:
- brauche ich nicht wirklich, mein CSS ist klein genug, dass ich auch so den Überblick behalte
- es gibt jetzt natives CSS-Nesting
- es gibt jetzt native CSS-Variablen
Bleibt Punkt 4. Und der macht, zumindest relativ betrachtet, einen großen Unterschied. Bisher waren mein CSS-Datei etwa 2,2 kiB groß, 844 B gz-komprimiert mit Zopfli, 686 B Brotli-komprimiert. Nach der Änderung waren es zunächst 5,1 kiB unkomprimiert, 1,7 kiB mit Zopfli und 1.4 kiB mit Brotli.
Das ist jetzt natürlich relativ betrachtet ein riesiger Unterschied. Natürlich gibt es andere CSS-Minifier, die ich hier ansetzen kann. Aber dann muss ich ja doch wieder eine Abhängigkeit hinzufügen. Vermutlich müsste ich die sogar über NPM installieren! Brrrr… Aber hey, absolut betrachtet sind alle diese Dateien immer noch ziemlich klein. Besonders, wenn ich an den Bloat anderer Websites denke, die für kleinste Layout-Aufgaben ein komplettes Bootstrap mit über 200 kiB an CSS und JS einbinden. Und zum Vergleich: die 686 B-Brotli-Datei zu übertragen überträge am Ende 1,26 kiB an Daten. Warum? HTTP-Overhead.
Also könnte ich das eigentlich auch so lassen. Aber ich wäre ja nicht ich, wenn ich nicht zumindest ein bisschen optimieren müsste. Also habe ich die Codeeinrückung (4 Leerzeichen) durch Tabs ersetzt und die Kommentare ein bisschen verkleinert. Und Schwupp: 4,2 kiB unkomprimiert, 1,6 kiB mit Zopfli und 1,3 kiB mit Brotli. Nicht viel besser (ich habe ja auch hauptsächlich gut komprimierbare Teile entfernt), aber auf jeden Fall ein bisschen besser.
Und dafür habe ich jetzt eine Abhängigkeit weniger. Das ist doch auch schön.