Neu auf der Webplattform seit Januar

Entdecken Sie einige der interessanten Funktionen, die im Januar 2024 in stabilen und Beta-Webbrowsern eingeführt wurden.

Seit Januar 2024 sind Firefox 122, Chrome 121 und Safari 17.3 stabil. In diesem Beitrag werden die neuen Funktionen der Webplattform beschrieben.

<hr> in <select>

Firefox 122 fügt <hr>-Elemente als zulässiges untergeordnetes Element von <select>-Elementen hinzu. Dies verbessert die Lesbarkeit ausgewählter Listen mit vielen Optionen. Alle gängigen Browser-Engines unterstützen jetzt diese Funktion. Derzeit ist das <hr> jedoch von keinem Browser für den Baum für Barrierefreiheit verfügbar.

Unterstützte Browser

  • 119
  • 119
  • 122
  • 17

HTMLSelectElement.showPicker

Ebenfalls für <select>-Elemente in Firefox ist die Methode showPicker() für HTMLSelectElement. Dies ist dieselbe Auswahl, die normalerweise angezeigt wird, wenn das Element ausgewählt wird, aber durch Klicken auf eine Schaltfläche oder eine andere Nutzerinteraktion ausgelöst werden kann.

Unterstützte Browser

  • 121
  • 121
  • 122

Quelle

Largest Contentful Paint (LCP)

Firefox 122 unterstützt auch die LCP API. Diese Performance API bietet Zeitinformationen über das größte Bild oder den größten Text, bevor Nutzer mit einer Webseite interagieren. Weitere Informationen zum LCP finden Sie in der LCP-Dokumentation.

Unterstützte Browser

  • 77
  • 79
  • 122
  • x

Quelle

Eigenschaften der CSS-Bildlaufleiste

In Chrome 121 werden jetzt die Eigenschaften scrollbar-color und scrollbar-width der Bildlaufleiste unterstützt. Weitere Informationen dazu findest du im Artikel Bildlaufleisten-Stile.

Unterstützte Browser

  • 121
  • 121
  • 64
  • x

Quelle

CSS-Animation „font-palette

Mit der Eigenschaft font-palette können Sie eine bestimmte Palette zum Rendern einer Farbschrift auswählen. Diese Eigenschaft unterstützt jetzt Animationen, sodass der Wechsel zwischen den Paletten ein reibungsloser Übergang zwischen den beiden ausgewählten Paletten erfolgt.

Die Methoden transfer() und transferToFixedLength() von ArrayBuffer

Firefox bietet die JavaScript-Methoden transfer() und transferToFixedLength() von ArrayBuffer. Die Methode transfer() erstellt eine neue ArrayBuffer mit demselben Byteinhalt wie die aktuelle ArrayBuffer und trennt dann die ursprüngliche ArrayBuffer. Die Methode transferToFixedLength() funktioniert auf die gleiche Weise, erstellt jedoch eine feste Größe (ArrayBuffer).

Unterstützte Browser

  • 114
  • 114
  • 122
  • 17,4

Quelle

Updates der Speculation Rules API

Websites verwenden die Speculation Rules API, um Chrome programmatisch mitzuteilen, welche Seiten vorab gerendert werden sollen. Dadurch wird die Nutzerfreundlichkeit verbessert, indem die Seitennavigationszeit verkürzt wird.

Chrome 121 unterstützt Dokumentregeln: Sie sind eine Erweiterung der Syntax für Spekulationsregeln, mit der der Browser die Liste der URLs für das spekulative Laden aus Elementen einer Seite abrufen kann. Dokumentregeln können Kriterien für die Verwendung dieser Links enthalten. In Kombination mit dem neuen Feld eagerness können Sie Links auf Seiten sofort, wenn der Mauszeiger darüber bewegt wird oder wenn der Mauszeiger darauf bewegt wird, automatisch vorab abrufen oder rendern.

Beta-Browser-Releases

Betaversionen des Browsers liefern Ihnen eine Vorschau auf Elemente, die sich in der nächsten stabilen Version des Browsers befinden werden. Dies ist ein guter Zeitpunkt, um neue Funktionen zu testen oder zu entfernen, die sich auf deine Website auswirken könnten, bevor die Veröffentlichung weltweit verfügbar ist. Die neuen Betaversionen sind Firefox 123, Chrome 122 und Safari 17.4. Diese Releases bieten viele tolle Funktionen auf der Plattform. Weitere Informationen finden Sie in den Versionshinweisen. Hier ein paar Highlights.

Die Betaversion von Firefox 123 enthält das deklarative Shadow-DOM.

In Firefox 123 wird auch der 103 Early Hints-HTTP-Statuscode der Informationsantwort unterstützt, sodass Ressourcen vorab geladen werden, die die Seite möglicherweise benötigt, während der Server die vollständige Antwort vorbereitet.

Die Beta-Version von Safari 17.4 enthält eine Menge nützlicher Funktionen. Für CSS werden unter anderem @scope, align-content in Blockcontainern und Tabellenzellen sowie die Pseudoelemente ::grammar-error und ::spelling-error unterstützt.

In Formularen werden der vertikale Schreibmodus in Formularsteuerelementen, die Methode showPicker() für <input type="date"> und die Unterstützung von <hr> in <select> unter iOS unterstützt.

JavaScript erhält außerdem einige neue Funktionen, unter anderem werden die Methoden detached(), transfer() und transferToFixedLength() von ArrayBuffer unterstützt.

Die Betaversion von Chrome 122 enthält die Option unsanitized in der Methode read() der Async Clipboard API, um nicht bereinigtes HTML-Format abzurufen. Für JavaScript gibt es neue Parser-Hilfsprogramme und neue Methoden für die integrierte Set-Klasse.

In Chrome 122 gibt es außerdem die Storage Buckets API. Sie soll die Bereinigung von nichtflüchtigen Speichern unter hoher Speicherauslastung vorhersehbarer machen.