17.022014

CSS Performance Tipp: Properties sortieren

Zum Thema Performance-Optimierung gibt es im Netz schon viele unzählige Tipps. Minifying und diverse andere Techniken sind bei jedem Frontendler bekannt. Aber ich glaube meinen heutigen Tipp kennen die wenigsten.Der Tipp lautet: sortiere deine properties alphabetisch. Dann kann nämlich gzip bei dei der Auslieferung nämlich noch besser arbeiten und besser komprimieren. Das kann n ochmal bis zu einem Prozent an Dateigröße einsparen. Klingt nicht viel ist aber ein weiteres Puzzelteil zur perfekten Optimierung. Bei größeren Projekten mit viel Traffic macht sich das auch sicher über einen größeren Zeitraum bemerkbar.

Viele Entwickler sortieren die Properties aber nach eigenen Vorgaben, z.b. erst alle Positionierungen, dann Abstände, Schriften, Hintergründe usw. Was ich auch persönlich bevorzuge. Da wir aber Grunt im Deploy-Prozess einsetzen gibt es hier ein Plugin das beim Deploy die Properties automatisch sortiert. Zu Grunt habe ich bereits in vorhergehenden Posts geschrieben. Es gibt aber auch Online-Tool zum Sortieren der Properties plus diverse Plugins für aktuelle Editoren. Es nennt sich CSSComb und findet sich unter http://csscomb.com/.