Neu in Chrome 137

Rachel Andrew

Veröffentlicht: 27. Mai 2025

Chrome 137 wird derzeit eingeführt. In diesem Beitrag stellen wir einige der wichtigsten Funktionen der Version vor. Vollständige Versionshinweise für Chrome 137

Highlights dieser Version:

Verwenden Sie reading-flow und reading-order, um in komplexen Layouts eine logische Tab-Reihenfolge zu gewährleisten. Die CSS-Funktion if() bietet eine prägnante Möglichkeit, bedingte Werte auszudrücken. Mit der JavaScript Promise Integration (JSPI) können WebAssembly-Anwendungen in JavaScript-Promises eingebunden werden.

Preisvergleichsportale reading-flow und reading-order

Mit der CSS-Property reading-flow wird die Reihenfolge gesteuert, in der Elemente in einem Flex-, Grid- oder Blocklayout für Tools zur Barrierefreiheit sichtbar gemacht werden und wie sie bei linearer sequenzieller Navigation fokussiert werden. Damit wird ein seit langem bestehendes Problem mit Grid- und Flex-Layouts behoben, bei dem die Tabulatorreihenfolge nicht mehr mit der Reihenfolge übereinstimmt, in der die Elemente angeordnet sind.

Es wird ein Keyword-Wert mit dem Standardwert normal verwendet, wodurch die Elemente in DOM-Reihenfolge angeordnet werden. Wenn Sie es in einem Flex-Container verwenden möchten, legen Sie den Wert auf flex-visual oder flex-flow fest. Wenn Sie es in einem Rastercontainer verwenden möchten, legen Sie den Wert auf grid-rows, grid-columns oder grid-order fest.

Mit der CSS-Eigenschaft reading-order können Sie die Reihenfolge der Elemente in einem Container für den Lesefluss manuell überschreiben. Wenn Sie diese Eigenschaft in einem Grid-, Flex- oder Block-Container verwenden möchten, setzen Sie den reading-flow-Wert des Containers auf source-order und den reading-order-Wert des einzelnen Elements auf einen Ganzzahlwert.

Weitere Informationen finden Sie unter CSS reading-flow für die logische sequenzielle Fokusnavigation verwenden.

CSS-if()-Funktion

Die CSS-Funktion if() bietet eine prägnante Möglichkeit, bedingte Werte auszudrücken. Es akzeptiert eine Reihe von Bedingung/Wert-Paaren, die durch Semikolons getrennt sind. Die Funktion wertet jede Bedingung nacheinander aus und gibt den Wert zurück, der mit der ersten wahrheitsgemäßen Bedingung verknüpft ist. Wenn keine der Bedingungen zutrifft, gibt die Funktion einen leeren Tokenstream zurück.

div {
  color: var(--color);
  background-color: if(style(--color: white): black; else: white);
}

.dark {
  --color: black;
}

.light {
  --color: white;
}

<div class="dark">dark</div>
<div class="light">light</div>

WebAssembly JavaScript Promise Integration (JSPI)

Die JavaScript Promise Integration (JSPI) ist eine API, mit der WebAssembly-Anwendungen in JavaScript-Promises eingebunden werden können.

Es ermöglicht einem WebAssembly-Programm, als Generator eines Versprechens zu fungieren, und es ermöglicht dem WebAssembly-Programm, mit APIs zu interagieren, die Versprechen enthalten.

Insbesondere wenn eine Anwendung JSPI verwendet, um eine API mit Versprechen (JavaScript) aufzurufen, wird der WebAssembly-Code angehalten und der ursprüngliche Aufrufer des WebAssembly-Programms erhält ein Versprechen, das erfüllt wird, wenn das WebAssembly-Programm schließlich abgeschlossen ist.

…und vieles mehr

Natürlich gibt es noch viele weitere:

  • Als Fortsetzung der Speicherpartitionierung hat Chrome die Partitionierung des Blob-URL-Zugriffs nach Speicherschlüssel implementiert.
  • Canvas-Pixelformate mit Gleitkommazahlen sind jetzt implementiert.
  • offset-path: shape() wird unterstützt, sodass Sie den Animationspfad mithilfe responsiver Formen festlegen können.

Weitere Informationen

Dies sind nur einige wichtige Highlights. Unter den folgenden Links finden Sie weitere Änderungen in Chrome 137.

Abonnieren

Wenn Sie auf dem Laufenden bleiben möchten, abonnieren Sie den YouTube-Kanal von Chrome Developers. Sie erhalten dann eine E-Mail-Benachrichtigung, sobald ein neues Video veröffentlicht wird. Alternativ können Sie uns auf X oder LinkedIn folgen, um über neue Artikel und Blogbeiträge informiert zu werden.

Sobald Chrome 138 veröffentlicht wird, informieren wir Sie hier über die Neuigkeiten in Chrome.