Chrome 137 Beta

Rachel Andrew

Veröffentlicht: 1. Mai 2025

Sofern nicht anders angegeben, gelten die folgenden Änderungen für die neueste Version des Chrome-Betakanals für Android, ChromeOS, Linux, macOS und Windows. Weitere Informationen zu den hier aufgeführten Funktionen finden Sie über die bereitgestellten Links oder in der Liste auf ChromeStatus.com. Chrome 130 ist seit dem 30. April 2025 als Betaversion verfügbar. Sie können die neueste Version auf Google.com für Computer oder im Google Play Store für Android herunterladen.

CSS und Benutzeroberfläche

Diese Version enthält sieben neue CSS- und UI-Funktionen.

Die 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. So können Sie komplexe bedingte Logik auf einfache und prägnante Weise ausdrücken. Beispiel:

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>

Die Properties 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 sind und mit der Tabulatortaste fokussiert werden. Es kann einen der folgenden Keyword-Werte annehmen:

• normal
• flex-visual
• flex-flow
• grid-rows
• grid-columns
• grid-order
• source-order

Mit der CSS-Property reading-order können Sie die Reihenfolge innerhalb eines Lesefluss-Containers manuell überschreiben. Es ist eine Ganzzahl mit dem Standardwert 0.

Weitere Informationen finden Sie unter CSS-Lesefluss für eine logische sequenzielle Fokusnavigation verwenden. Außerdem können Sie sich Beispiele für den Lesefluss ansehen.

offset-path: shape()

Die Funktion shape() wird bereits in clip-path unterstützt und ermöglicht responsives Zuschneiden. Wenn Sie die Funktion auch für offset-path aktivieren, wird eine kleine Lücke geschlossen, bei der dieselbe Form für diese Property verwendet werden kann.

Unterstützung des Transformattributs bei SVGSVGElement

Mit dieser Funktion können Transformationseigenschaften wie Skalierung, Drehung, Verschiebung und Verzerrung direkt über das transform-Attribut auf das <svg>-Stammelement angewendet werden. Mit dieser Funktion können Sie das gesamte SVG-Koordinatensystem oder seinen Inhalt als Ganzes bearbeiten. So haben Sie mehr Flexibilität beim Erstellen dynamischer, responsiver und interaktiver Vektorgrafiken. Durch die Unterstützung dieses Attributs kann das SVG-Element transformiert werden, ohne dass zusätzliche Wrapper-Elemente oder komplexe CSS-Umgehungen erforderlich sind. So wird der Prozess zum Erstellen skalierbarer und animierter Webgrafiken optimiert.

Lassen Sie <use> auf das Stammelement eines externen Dokuments verweisen, indem Sie das Fragment weglassen.

Mit dieser Funktion vereinfachen wir das SVG-Element <use>, indem wir die Anforderungen an die Referenzierung lockern. Derzeit müssen Sie Fragmente im SVG-Dokument explizit referenzieren. Wenn keine Fragment-ID angegeben ist, kann <use> das Ziel nicht auflösen und es wird nichts gerendert oder verwiesen.

Wenn Sie mit dieser Funktion Fragmente weglassen oder nur den Namen der externen SVG-Datei angeben, wird automatisch auf das Stammelement verwiesen. Sie müssen also nicht das referenzierte Dokument ändern, um dem Stamm eine ID zuzuweisen. Diese Verbesserung vereinfacht die manuelle Bearbeitung und erhöht die Effizienz.

Systemakzentfarbe für die accent-color-Eigenschaft auf Windows und ChromeOS ausgeweitet

So können Sie die Akzentfarbe des Betriebssystems für Formularelemente verwenden. Mit der CSS-Eigenschaft accent-color können Sie dafür sorgen, dass Formularelemente wie Kästchen, Optionsfelder und Fortschrittsbalken automatisch die vom Betriebssystem des Nutzers definierte Akzentfarbe übernehmen. Diese Funktion wird seit 2021 unter macOS und jetzt auch unter Windows und ChromeOS unterstützt.

view-transition-name: match-element

Der match-element-Wert für die view-transition-Eigenschaft generiert eine eindeutige ID basierend auf der Identität des Elements und bleibt für dieses Element gleich. Diese Methode wird in Single-Page-Apps verwendet, in denen das Element verschoben wird und Sie es mit einer Ansichtsübergang animieren möchten.

Web APIs

Fehlertyp für die Erstellung von WebAuthn-Anmeldedaten für „payment“ ausrichten

Der Fehlertyp, der beim Erstellen von WebAuthn-Anmeldedaten für payment-Anmeldedaten auftritt, wurde korrigiert. Aufgrund einer früheren Spezifikationsdiskrepanz wird beim Erstellen von payment-Anmeldedaten in einem plattformübergreifenden Iframe ohne Nutzeraktivierung eine SecurityError statt einer NotAllowedError ausgegeben. Letztere wird für Anmeldedaten verwendet, die nicht für Zahlungen genutzt werden. Dies ist eine funktionsgefährdende Änderung. Code, der zuvor den Typ des geworfenen Fehlers erkannt hat (z. B. e instanceof SecurityError), wäre davon betroffen. Code, der nur allgemein Fehler beim Erstellen von Anmeldedaten verarbeitet (z. B. catch (e)), funktioniert weiterhin ordnungsgemäß.

Blob-URL-Partitionierung: Abrufen/Navigation

Als Fortsetzung der Speicherpartitionierung wird hier die Partitionierung des Blob-URL-Zugriffs nach Speicherschlüssel (Website der obersten Ebene, Frame-Ursprung und das boolesche has-cross-site-ancestor-Attribut) implementiert, mit Ausnahme von Navigationen der obersten Ebene, die nur nach Frame-Ursprung partitioniert bleiben.

Diese Änderung kann vorübergehend rückgängig gemacht werden, indem Sie die Richtlinie PartitionedBlobURLUsage festlegen. Die Richtlinie wird eingestellt, wenn die anderen speicherpartitionsbezogenen Unternehmensrichtlinien eingestellt werden.

Aufrufstapel in Absturzberichten von nicht reagierenden Webseiten

Mit dieser Funktion wird der JavaScript-Aufrufstapel erfasst, wenn eine Webseite aufgrund eines JavaScript-Codes, der einen unendlichen Loop oder eine andere sehr lange Berechnung ausführt, nicht mehr reagiert. So können Entwickler die Ursache für die Unzuverlässigkeit leichter ermitteln und beheben. Der JavaScript-Aufrufstapel ist in der Absturzmelde-API enthalten, wenn der Grund „Nicht antworten“ ist.

Gleitkommafarbtypen für Canvas

Es ist jetzt möglich, mit CanvasRenderingContext2D, OffscreenCanvasRenderingContext2D und ImageData Gleitkomma-Pixelformate (anstelle von 8-Bit-Fixpunktformaten) zu verwenden. Dies ist für Anwendungen mit hoher Präzision (z. B. medizinische Visualisierung), Inhalte mit hohem Dynamikbereich und lineare Arbeitsfarbräume erforderlich.

Nicht vertrauenswürdiges Klartext-HTTP-Prerendering deaktivieren

Derzeit ist das Pre-Rendering über HTTP und HTTPS zulässig, während das Prefetching nur über HTTPS funktioniert. Beschränken Sie das Pre-Rendering, damit es mit dem Prefetch übereinstimmt.

Document-Isolation-Policy

Mit Document-Isolation-Policy kann crossOriginIsolation für ein Dokument aktiviert werden, ohne dass COOP oder COEP bereitgestellt werden müssen, und unabhängig vom crossOriginIsolation-Status der Seite. Die Richtlinie wird durch die Prozessisolierung unterstützt. Außerdem werden die nicht CORS-kompatiblen Cross-Origin-Unterressourcen des Dokuments entweder ohne Anmeldedaten geladen oder müssen einen CORP-Header haben.

Weitere Informationen finden Sie im Artikel Richtlinie zur Dokumentisolierung: Leistungsstarke Webfunktionen ganz einfach aktivieren.

Ed25519 in der Webkryptografie

Mit dieser Funktion wird die Unterstützung für Curve25519-Algorithmen in der Web Cryptography API hinzugefügt, insbesondere für den Signaturalgorithmus Ed25519.

Protokolle und Berichte für IP-Adressen

Chrome Enterprise verbessert die Funktionen für die Sicherheitsüberwachung und Reaktion auf Vorfälle, indem lokale und Remote-IP-Adressen erfasst und gemeldet und an die Sicherheitsprüfprotokolle (Security Investigation Logs, SIT) gesendet werden. Außerdem können Administratoren mit Chrome Enterprise die IP-Adressen optional über den Chrome Enterprise-Connector für die Berichterstellung an eigene und Drittanbieter-SIEM-Anbieter senden. Diese Funktion ist für Chrome Enterprise Core-Kunden verfügbar.

JavaScript-Promise-Integration

Die JavaScript Promise Integration (JSPI) ist eine API, mit der WebAssembly-Anwendungen in JavaScript-Promises eingebunden werden können. So kann ein WebAssembly-Programm als Generator eines Promises fungieren und mit APIs mit Promises interagieren. Insbesondere wenn eine Anwendung JSPI verwendet, um eine Promise-API (JavaScript) aufzurufen, wird der WebAssembly-Code angehalten und der ursprüngliche Aufrufer des WebAssembly-Programms erhält ein Promise, das erfüllt wird, wenn das WebAssembly-Programm abgeschlossen ist.

Language Detector API

Die Language Detector API ist eine JavaScript API, die die Sprache eines bereitgestellten Strings identifiziert. Diese API wird von einem zugrunde liegenden Modell unterstützt, das für die Spracherkennung optimiert ist.

Wenn Sie einen String angeben, gibt die Language Detector API eine sortierte Liste der erkannten Sprachen sowie einen Konfidenzwert für jedes Ergebnis zurück.

Optional können Entwickler beim Erstellen einer Instanz des Spracherkennungstools eine Liste der erwarteten Eingabesprachen übergeben, um die Erkennung für Anwendungsfälle zu optimieren, bei denen die Erkennung in bestimmten Sprachen erfolgen soll.

Gleitkommaattribute und ‑argumente auf SVGMatrix, SVGRect und SVGPoint beschränken

Wenn Sie Gleitkommaattribute oder ‑argumente für SVGMatrix, SVGRect und SVGPoint festlegen, können Sie sie jetzt nicht mehr als Infinity oder Nan festlegen. Wenn Sie versuchen, sie gemäß der SVG-Spezifikation festzulegen, wird eine JavaScript-Ausnahme ausgelöst.

Selection API getComposedRanges und direction

Diese Funktion umfasst zwei neue API-Methoden für die Selection API:

• Selection.direction, das die Richtung der Auswahl als "none", "forward" oder "backward" zurückgibt
• Selection.getComposedRanges(), die eine Liste mit „komponierten“ Werten von 0 oder 1 zurückgibt StaticRange

Eine „zusammengesetzte“ StaticRange darf Schattengrenzen überschreiten, was bei normalen Bereichen nicht möglich ist.

Beispiel:

const range = getSelection().getComposedRanges({ shadowRoots: [root] });

Wenn die Auswahl eine Schattenknotengrenze überschreitet, die nicht in der Liste shadowRoots enthalten ist, werden die Endpunkte der StaticRange so neu skaliert, dass sie sich außerhalb dieses Baums befinden. So wird verhindert, dass unbekannte Schattenbäume freigelegt werden.

Erweiterungen auf Webanwendungsebene

Fügt das Manifest-Feld scope_extensions für Web-Apps hinzu, mit dem Web-Apps ihren Geltungsbereich auf andere Ursprünge ausweiten können.

Beispiel:

{
  "name": "Example",
  "display": "standalone",
  "start_url": "/index.html",
  "scope_extensions": [
    {"type" : "type", "origin" : "https://example.com"}
  ]
}

So können Websites, die mehrere Subdomains und Top-Level-Domains steuern, als einzelne Webanwendung präsentiert werden.

Erfordert, dass die aufgeführten Ursprünge die Verknüpfung mit der Webanwendung mithilfe einer .well-known/web-app-origin-association-Konfigurationsdatei bestätigen.

{
  "https://sample-app.com/": {
    "scope": "/"
  }
}

WebAssembly-Zweig-Hinweise

Verbessert die Leistung von kompiliertem WebAssembly-Code, indem die Engine darüber informiert wird, dass eine bestimmte Verzweigungsanweisung sehr wahrscheinlich einen bestimmten Pfad nimmt. So kann die Engine bessere Entscheidungen für das Code-Layout treffen (wodurch die Trefferrate im Instruction Cache verbessert wird) und die Registerzuweisung optimieren.

WebGPU: GPUTextureView für externalTexture-Bindung

Ein GPUTextureView darf jetzt für eine externalTexture-Bindung verwendet werden, wenn eine GPUBindGroup erstellt wird.

WebGPU: copyBufferToBuffer-Überlastung

Die Methode GPUCommandEncoder copyBufferToBuffer() bietet jetzt eine einfachere Möglichkeit, ganze Puffer zu kopieren. Dazu wird eine neue Überladung mit optionalen Offset- und Größenparametern verwendet.

Neue Ursprungstests

In Chrome 137 können Sie die folgenden neuen Tests für Ursprünge aktivieren.

Renderblockierendes Attribut für die volle Framerate

Den blockierenden Attributen wird ein neues renderblockierendes Token „full-frame-rate“ hinzugefügt. Wenn der Renderer mit dem Token für die volle Framerate blockiert ist, arbeitet er mit einer niedrigeren Framerate, um mehr Ressourcen für das Laden zu reservieren.

Medienwiedergabe in nicht gerenderten Iframes pausieren

Es wird eine "media-playback-while-not-rendered"-Berechtigungsrichtlinie hinzugefügt, die es Websites mit eingebetteten Inhalten ermöglicht, die Medienwiedergabe von eingebetteten iframes anzuhalten, die nicht gerendert werden, d. h. deren „display“-Attribut auf „none“ gesetzt ist. So können Entwickler die Nutzerfreundlichkeit verbessern und die Leistung steigern, indem der Browser die Wiedergabe von Inhalten übernimmt, die für Nutzer nicht sichtbar sind.

Rewriter API

Die Rewriter API transformiert und formuliert den Eingabetext auf die gewünschte Weise, unterstützt durch ein On-Device-KI-Sprachmodell. Entwickler können diese API unter anderem verwenden, um Redundanzen in einem Text zu entfernen, um die Wortanzahl zu begrenzen, Nachrichten so umzuformulieren, dass sie für die Zielgruppe geeignet sind oder konstruktiver sind, wenn in einer Nachricht toxische Sprache verwendet wird, oder einen Beitrag oder Artikel so umzuformulieren, dass einfachere Wörter und Konzepte verwendet werden.

Writer API

Die Writer API kann zum Erstellen neuer Inhalte verwendet werden, die auf einem Prompt für eine Schreibaufgabe basieren. Dabei wird ein KI-Sprachmodell auf dem Gerät verwendet. Entwickler können mit dieser API textbasierte Erläuterungen zu strukturierten Daten generieren, einen Beitrag zu einem Produkt auf Grundlage von Rezensionen oder Produktbeschreibungen verfassen, Pro- und Contra-Listen in vollständige Ansichten umwandeln und vieles mehr.