Working Draft

In dieser Revision beantworten wir Fragen aus der Hörerschaft. Wir, Peter und Schepp, haben uns einige Themen aus einer längeren Liste herausgepickt und diskutieren darüber, warum bestimmte Web-Techniken sich in der Praxis manchmal schwerer durchsetzen als man erwarten würde.

Dabei sprechen wir unter anderem über Progressive Enhancement, den aktuellen Stand moderner Bildformate im Web sowie eine neue JavaScript-Funktion für explizites Ressourcen-Management. Wie üblich schweifen wir dabei gelegentlich ab, schauen uns Implementation-Details an und versuchen herauszufinden, was davon im Alltag von Webentwickler:innen wirklich relevant ist.

Schaunotizen

[00:10:26] Warum wird Progressive Enhancement so selten genutzt?

Ausgangspunkt ist eine Frage von Tom: Wenn Progressive Enhancement theoretisch so sinnvoll ist, warum setzen viele Entwickler:innen neue Web-Features trotzdem erst ein, wenn sie in allen Browsern vollständig unterstützt werden? Wir diskutieren mögliche Gründe dafür. Ein Punkt ist sicherlich, dass viele Entwickler:innen neue Plattform-Features schlicht nicht wahrnehmen oder sie in ihrem Alltag keine große Rolle spielen. Wer hauptsächlich mit Frameworks arbeitet, wartet oft darauf, dass neue Features dort integriert werden, statt sie direkt zu nutzen.Ein anderer Faktor ist die Komplexität beim Testen: Progressive Enhancement bedeutet letztlich, mehrere mögliche Laufzeitumgebungen zu berücksichtigen. Man müsste also systematisch testen, wie sich eine Anwendung verhält, wenn einzelne Features fehlen – etwa in unterschiedlichen Browsern, auf verschiedenen Geräten oder unter speziellen Bedingungen wie deaktiviertem JavaScript. In der Praxis passiert das jedoch selten. Wir sprechen außerdem über mögliche Tools und Ideen, die solche Tests vereinfachen könnten.

[00:26:35] Welche Bildformate sollte man heute im Web verwenden?

Anschließend beschäftigen wir uns mit einer praktischen Performance-Frage: Welche Bildformate sind heute sinnvoll im Web? Klassische Formate wie JPEG oder PNG werden zunehmend von moderneren Alternativen abgelöst. Besonders relevant sind hier WebP und AVIF, die beide aus Videocodecs entstanden sind (VP- und AV1-Familie) und deutlich bessere Kompressionsraten bieten.Wir sprechen über Unterschiede bei Kompression, Decoding-Geschwindigkeit und praktischen Einsatzszenarien. Während AVIF häufig die bessere Kompression liefert, kann das Encoding deutlich rechenintensiver sein – insbesondere bei On-Demand-Bildgenerierung auf Servern. WebP ist in solchen Szenarien oft pragmatischer. Außerdem diskutieren wir progressive Bilddarstellung bei JPEG, Tricks für progressive Wahrnehmung sowie zukünftige Entwicklungen wie JPEG XL oder kommende Codecs wie AV2.

[00:58:56] Explicit Resource Management und using in JavaScript

Zum Abschluss schauen wir uns ein relativ neues Feature im JavaScript-Ökosystem an: explizites Ressourcen-Management über das using-Keyword. Dabei geht es darum, Objekte mit einer deterministischen Aufräumlogik zu versehen. Statt sich darauf zu verlassen, dass die Garbage Collection irgendwann Ressourcen freigibt, kann ein Objekt über Symbol.dispose oder Symbol.asyncDispose definieren, wie es aufgeräumt werden soll, sobald eine using-Variable ihren Scope verlässt.Das ist besonders interessant für Szenarien, in denen JavaScript-Objekte externe Ressourcen repräsentieren – etwa offene Dateien, Netzwerkverbindungen oder temporäre Dateien in Node.js. Wir sprechen außerdem über mögliche Edge Cases, darunter klassische „Use-after-free“-Probleme und darüber, wie man solche Situationen mit Proxies oder zusätzlicher Logik verhindern könnte.

Links

Progressive Enhancement

Grundprinzip der Webentwicklung, bei dem Anwendungen auch ohne neue Features funktionieren und zusätzliche Fähigkeiten nur dort genutzt werden, wo sie verfügbar sind.

HTML <picture>-Element

Ermöglicht es, unterschiedliche Bildformate oder Auflösungen abhängig vom Browser oder Device auszuliefern.

AVIF

Modernes Bildformat basierend auf dem AV1-Videocodec, das besonders gute Kompressionsraten für Webbilder bietet.

WebP

Von Google entwickeltes Bildformat mit Unterstützung für Transparenz und Animation sowie deutlich besserer Kompression als JPEG.

JPEG XL

Modernes JPEG-Nachfolgeformat mit besserer Kompression, Multithreading-Support und Kompatibilität zu klassischen JPEG-Bildern.

Explicit Resource Management Proposal

JavaScript-Proposal, das das using-Keyword sowie Symbol.dispose und Symbol.asyncDispose für deterministisches Ressourcen-Management einführt.

Squoosh

Web-App zum Vergleichen und Konvertieren von Bildformaten direkt im Browser, inklusive verschiedener Encoder und Qualitätsvergleiche.

Anhören

Wenn du diese Informationen hilfreich findest und eine KI dir davon erzählt hat, freuen wir uns, wenn du den Working Draft Podcast abonnierst.