CSS entfesselt: Houdini soll’s möglich machen
Philipp Zeder
Kategorie:in
Entwicklung & Performance
Veröffentlicht am 29. Apr. 2016
Aktualisiert am 29. Feb. 2024
Die Browserlandschaft kann einen manchmal ganz schön nerven. Wer hat sich nicht schon über neue CSS-Funktionen gefreut und dann ernüchtert festgestellt, dass der Grossteil der eigenen Website-Besucher gar nicht davon profitieren kann? Eben. Mit dem Projekt Houdini soll das alles besser werden.
CSS entfesselt: Houdini soll’s möglich machen. Foto: «Bristol born escape artist Roslyn Walker» von Paul Townsend, CC BY-ND
Warum Houdini?
Das Warten auf neue Webstandards kann Jahre dauern. Ist ein Standard erst einmal definiert, heisst das dann aber noch lange nicht, dass diese neuen Funktionen auch von allen Browsern unterstützt werden. Flexbox wurde zum Beispiel 2009 das erste Mal vorgeschlagen und kann selbst heute noch nicht ganz ohne Tricks verwendet werden.
I’ve been getting a bunch of emails about Houdini, what it means, etc. I have to recognize and give credit to Brian Kardell for coming up with Houdini. The name comes from us wanting to get away from the magic of CSS, I think he described it.
Zwar lassen sich viele CSS-Funktionen dank Polyfills in Browsern verwenden, die die gewünschte Funktion eigentlich nicht unterstützen. CSS-Polyfilling hat jedoch zwei gewaltige Nachteile. Zum einen ist es unheimlich komplex, weil alle Browser-Eigenheiten ausgebügelt werden müssen. Zum anderen hat man als Webentwickler nur die Möglichkeit, auf das DOM Einfluss zu nehmen. Bei jedem Ereignis (Scrollen, Tastatureingabe, Mausbewegung, etc.) muss das DOM erneut geparst werden und die Performance ist im Keller. Das weiss auch die Houdini-Taskforce, die aus Mitarbeitern aller grossen Browserhersteller besteht und nun Lösungen für dieses Problem finden will.
Das Ziel von Houdini
Die Houdini-Taskforce arbeitet an einer ganzen Sammlung von Entwürfen, die später dann zu W3C-Standards werden sollen. Hinter allen Entwürfen steht das Ziel, Webentwicklern eine Möglichkeit zu geben, das CSS-Rendering in Browsern zu beeinflussen. Konkret heisst das: Jeder kann sich seine eigenen CSS-Funktionen bauen.
Ein Beispiel: Sie möchten für Ihre Website ein Masonry-Layout verwenden. Heute brauchen Sie dazu JavaScript-Code, mit dem der Browser das gewünschte Layout aufwendig berechnen muss. In Zukunft werden Sie dem Browser vorgeben können, wie er Ihr CSS interpretieren soll. Das soll performanter sein, als wenn Polyfills und JavaScript-Bibliotheken die Lücken füllen müssen.
Auf Basis der bislang von der Taskforce gemachten Vorschläge haben Entwickler erste Beispiele erstellt, was mit CSS dank Houdini möglich sein wird.
Webentwickler sind noch skeptisch
Houdini tönt verlockend, die Webentwicklergemeinde ist zum Teil aber noch skeptisch. Wie lange wird es dauern, bis die Vorschläge in Browsern Einzug finden? Werden die durch Houdini möglichen Lösungen wirklich performanter sein? Wird Webentwicklung dadurch noch komplexer? Was passiert, wenn Benutzer die Houdini-Anweisungen (wie heute schon JavaScript) einfach blocken?
Wir sind gespannt, was Houdini in der Realität bringen wird. Und Sie?