Revision 725: Die Browser haben wieder geliefert

What this episode covers

Wir werfen wieder einen Blick auf aktuelle Entwicklungen der Webplattform und sprechen über eine ganze Reihe neuer Browser-Features und Standards, die in den letzten Monaten ihren Weg in Chrome, Firefox oder Baseline gefunden haben. Dabei geht es sowohl um neue APIs und CSS-Features als auch um Verbesserungen für Accessibility und die Entwicklerwerkzeuge. UNSER SPONSOR Alle reden von Automation – aber wo betreibst du eigentlich deine Tools? Egal ob n8n oder andere Container-Setups: Mit dem Container-Hosting von mittwald läuft deine Anwendung in wenigen Minuten. Die nervige Konfiguration? Geht easy von der Hand – inklusive Vorschlägen für Umgebungsvariablen und Entrypoints. Also: Fang an zu automatisieren. Dein erster Schritt ist ein Hosting bei mittwald. 👉 mittwald.de/workingdraft SHOWNOTES [00:02:09] FOCUSGROUP Den Anfang macht das neue focusgroup-Attribut, das die Tastaturnavigation innerhalb von Komponenten deutlich vereinfachen soll. Wir sprechen über den aktuellen Stand der Implementierung in Chrome, den Ursprung der Idee im Open UI Projekt sowie Microsofts Beweggründe. Außerdem erinnern wir uns an unsere frühere Folge über räumliche Navigation und werfen einen Blick auf das verfügbare Polyfill für andere Browser. [00:12:49] MATH.SUMPRECISE() Mit Math.sumPrecise() landet eine neue JavaScript-Funktion in Baseline, die Rundungsfehler beim Addieren vieler Fließkommazahlen reduziert. Wir sprechen darüber, wann sich die neue Methode lohnt und streifen dabei auch kurz Object.is() als verwandtes Thema. [00:29:49] ELEMENT-SCOPED VIEW TRANSITIONS View Transitions lassen sich inzwischen nicht mehr nur für ganze Dokumente einsetzen. Wir schauen uns an, wie elementbezogene View Transitions funktionieren und welche Anwendungsfälle dadurch möglich werden. [00:38:09] LIGHT-DARK() FÜR BILDER Firefox unterstützt nun light-dark() auch in Kombination mit Bildern. Wir sprechen darüber, welche Möglichkeiten sich dadurch ergeben und streifen außerdem die neuen CSS-Eigenschaften link-parameters sowie object-view-box. [00:59:37] PROMISES FÜR SCROLLTO(), SCROLLBY() UND SCROLLINTOVIEW() Chrome liefert für programmatische Scrollvorgänge künftig Promises zurück. Wir diskutieren, welche Probleme sich damit lösen lassen und warum das die Arbeit mit Scroll-Animationen und Benutzerinteraktionen vereinfachen kann. [01:07:11] ASYNC ITERATION FÜR READABLESTREAMS Die asynchrone Iteration über ReadableStream-Objekte gehört inzwischen zu Baseline. Wir sprechen darüber, wie sich Streams dadurch deutlich eleganter verarbeiten lassen. [01:11:33] TEXT-FIT Mit text-fit arbeitet Chrome an einer nativen Lösung für automatisch skalierenden Text. Wir vergleichen den aktuellen Vorschlag mit bisherigen CSS-Techniken und werfen dabei auch einen Blick auf Roman Komarovs Experiment Fit-to-Width. [01:19:07] HEADING LEVELS IM FIREFOX ACCESSIBILITY INSPECTOR Der Firefox Accessibility Inspector zeigt nun die berechneten Heading Levels an. Wir sprechen darüber, warum diese Information insbesondere bei komplexen Dokumentstrukturen und im Zusammenhang mit aria-level hilfreich ist. [01:27:31] SHADOWROOTSLOTASSIGNMENT Wir schauen uns das neue shadowrootslotassignment-Attribut für deklarative Shadow DOMs an und diskutieren, welche Auswirkungen unterschiedliche Slot-Zuweisungsstrategien auf Web Components haben. [01:34:45] FIELD-SIZING Zum Abschluss geht es um field-sizing, das inzwischen Teil von Baseline ist. Wir sprechen darüber, wie Formularelemente ihren Inhalt automatisch berücksichtigen können und welche Auswirkungen das auf Textfelder und Textareas hat. Dabei kommen wir auch kurz auf das inzwischen längste ARIA-Attribut aria-brailleroledescription zu sprechen. LINKS MAKING KEYBOARD NAVIGATION EFFORTLESS Microsoft beschreibt die Motivation und Hintergründe hinter dem neuen focusgroup-Attribut. @MICROSOFT/FOCUSGROUP-POLYFILL Polyfill für focusgroup, um das Feature auch in Browsern ohne native Unterstützung auszuprobieren.

Distinct summary based on available episode metadata or transcript content.