Entdecke einige der interessanten Funktionen, die im Mai 2023 in den stabilen und Beta-Webbrowsern eingeführt wurden.
Stabile Browserversionen
Seit Mai 2023 sind Firefox 113, Chrome 113, Chrome 114 und Safari 16.5 stabil. Sehen wir uns einmal an, was das für die Webplattform bedeutet.
WebGPU
Chrome 113 enthält WebGPU, den Nachfolger der WebGL- und WebGL 2-Grafik-APIs für das Web. Sie bietet moderne Funktionen wie GPU-Computing, geringeren Zugriff auf GPU-Hardware, die Möglichkeit, von einem einzigen Grafikgerät aus auf mehreren Canvases zu rendern, sowie eine bessere, vorhersagbare Leistung.
First-Party-Sets
First-Party-Sets (FPS) sind Teil der Privacy Sandbox. Auf diese Weise können Organisationen Beziehungen zwischen Websites angeben, sodass Browser entscheiden können, wann ein eingeschränkter Zugriff auf Drittanbieter-Cookies für Websites innerhalb einer Gruppe zugelassen wird. FPS begann in Chrome 113 mit einem gestaffelten Roll-out.
CSS-Medienfunktionen und mehr
Für CSS enthält Chrome 113 die Medienfunktionen overflow-inline
und overflow-block
.
Und die Medienfunktion update
.
Dazu gehört auch die Easing-Funktion linear()
. Weitere Informationen finden Sie im Artikel Mit der Easing-Funktion linear()
komplexe Animationskurven in CSS erstellen.
Unterstützte Browser
- 113
- 113
- 112
- 17,2
Funktionen der CSS-Farbstufe 4
Firefox 113 enthält die funktionalen Notationen color()
, lab()
, lch()
, oklab()
, oklch()
und color-mix()
sowie die Eigenschaft für die erzwungene Farbanpassung. Das bedeutet, dass die neuen Farbräume und -funktionen nun von allen drei großen Suchmaschinen unterstützt werden. Weitere Informationen zu diesen Farbräumen und Funktionen finden Sie im High Definition-CSS-Farbleitfaden.
Mehr Kontrolle über die Auswahl von :nth-child()
In Firefox 113 wurde außerdem die Möglichkeit hinzugefügt, eine Auswahlliste an :nth-child()
und nth-last-child()
zu übergeben. Weitere Informationen sowie Beispiele finden Sie im Beitrag Mehr Kontrolle über die Auswahl von „:nth-child()“ mit der Syntax von S.
Unterstützte Browser
- 111
- 111
- 113
- 9
Compressions Streams API
Durch die Einbindung in Firefox 113 wird das Compressions Streams API nun in allen drei großen Suchmaschinen unterstützt und ermöglicht die Komprimierung und Dekomprimierung von Streams. Das bedeutet, dass JavaScript-Anwendungen keine Komprimierungsbibliothek mehr bündeln müssen.
CSS-Verschachtelung
In Safari 16.5 wurden Probleme weitgehend behoben, aber es wird jetzt auch CSS-Verschachtelung unterstützt. Der neue Verschachtelungsselektor >
dient zum Verschachteln verwandter Stilregeln auf eine Weise, die Entwicklern, die Vorprozessoren verwendet haben, vertraut ist:
.nesting {
color: hotpink;
> .is {
color: rebeccapurple;
> .awesome {
color: deeppink;
}
}
}
Anzeigentitel und „text-wrap: balance
“ werden ausgeglichen
Ab Chrome 114 können Sie text-wrap: balance
verwenden. So können Sie die Überschriften ausbalancieren und vermeiden, dass in der letzten Zeile nur ein einziges Wort steht, was ein angenehmeres und besser lesbares Ergebnis ermöglicht. Weitere Informationen finden Sie unter CSS text-wrap: Balancing.
CHIPS: Cookies mit unabhängig partitioniertem Status
Im Rahmen der Einstellung von Drittanbieter-Cookies ermöglicht CHIPS, dass Drittanbieter-Cookies mithilfe des neuen Cookie-Attributs Partitioned
nach Website der obersten Ebene partitioniert werden. CHIPS ist in Chrome 114 verfügbar.
Popover API
In Chrome 114 gibt es außerdem die Popover API. Diese vereinfacht die Erstellung temporärer UI-Elemente, die über allen anderen Web-App-UIs angezeigt werden.
Dazu gehören für Nutzer interaktive Elemente wie Aktionsmenüs, Vorschläge für Formularelemente, Inhaltsauswahl und UI für Lernende.
Mit dem neuen Pop-over-Attribut kann jedes Element automatisch auf der obersten Ebene angezeigt werden. Sie müssen sich also keine Gedanken mehr um die Positionierung, das Stapeln von Elementen, den Fokus oder die Tastaturinteraktionen machen.
Weitere Informationen finden Sie unter Einführung in die Popover API.
Beta-Browser-Releases
Beta-Browser-Versionen bieten eine Vorschau auf Elemente in der nächsten stabilen Version des Browsers. Dies ist ein guter Zeitpunkt, um neue Funktionen zu testen oder die Entfernung von Inhalten zu testen, die sich auf Ihre Website auswirken könnten, bevor die Veröffentlichung weltweit verfügbar ist. Die neuen Betaversionen sind Firefox 114, Chrome 115 und Safari 16.6. Diese Releases bieten viele tolle Funktionen auf der Plattform. Weitere Einzelheiten finden Sie in den Versionshinweisen. Hier sind nur ein paar Highlights.
Chrome 115 enthält mehrere Werte für die CSS-Eigenschaft display
. Das bedeutet, dass „display: flex
“ zu „display: block flex
“ und „display: block
“ zu „display: block flow
“ wird. Die einzelnen Werte werden als alte Keywords verwaltet. Sobald sie in der stabilen Chrome-Version vorhanden sind, sind sie dadurch in allen Suchmaschinen verfügbar.
Außerdem gibt es in Chrome 115 die Erweiterungen ScrollTimeline
und ViewTimeline
der Web Animations-Spezifikation. Diese ermöglichen scrollgesteuerte Animationen über CSS und JavaScript.
Firefox 114 enthält die WebTransport API, ein modernes Update für WebSockets, das mehrere Streams, unidirektionale Streams und die Auslieferung in falscher Reihenfolge unterstützt.
Teil der Reihe zum Thema „Neu im Web“