Neue CSS-Viewport-Einheiten, Federated Credential Management API, variable COLRv1-Schriftarten und mehr.
Sofern nicht anders angegeben, gelten die unten beschriebenen Änderungen für die neueste Betaversion von Chrome 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 108 ist seit dem 27. Oktober 2022 als Betaversion verfügbar. Du kannst die neuesten Versionen unter Google.com für Computer oder im Google Play Store auf Android herunterladen.
CSS
Chrome 108 enthält eine Reihe neuer CSS-Funktionen.
CSS-Überlauf für ersetzte Elemente
Für Chrome wird eine Änderung eingeführt, die es Entwicklern ermöglicht, die vorhandene overflow-Property durch ersetzte Elemente zu verwenden, die außerhalb des Inhaltsfelds dargestellt werden. In Kombination mit object-view-box kann dieses Bild verwendet werden, um ein Bild mit einem benutzerdefinierten Schein oder Schatten zu erstellen, das ein korrektes Überlaufverhalten wie bei einem CSS-Schatten aufweist.
Dies stellt eine potenzielle funktionsgefährdende Änderung dar. Weitere Informationen finden Sie unter Änderung des Überlaufs bei ersetzten Elementen.
Kleine, große, dynamische und logische Einheiten für den Darstellungsbereich
Dadurch werden kleine (svw, svh, svi, svb, svmin, svmax), große (lvw, lvh, lvi, lvb, lvmin, lvmax), dynamische (dvw, dvh, dvi, dvb, dvmin, dvmax) und logische Einheiten (vi, vb) unterstützt.
Unterstützung für Preisvergleichsportal break-after, break-before und break-inside
Unterstützung für den NOT-Wert der CSS-Fragmentierungseigenschaften break-before, break-after und break-inside beim Drucken. Mit diesem Wert wird dem Browser mitgeteilt, dass vor, nach oder innerhalb des Elements, auf das angewendet wird, keine Zerstörungen erfolgen sollen. Mit dem folgenden CSS-Code wird beispielsweise verhindert, dass bei einem Seitenumbruch eine Abbildung beschädigt wird.
figure {
break-inside: avoid;
}
Diese Funktion wurde hinzugefügt, da in Chrome 108 das Drucken mit LayoutNG unterstützt wird.
Ausrichtung des letzten Referenzelements
Mit dieser Funktion können Entwickler Elemente im Flex- oder Rasterlayout an ihrer letzten Baseline statt an ihrer ersten ausrichten. Dies erfolgt über die folgenden Attribute:
align-items: last baseline;justify-items: last baseline;align-self: last baseline;justify-self: last baseline;
ContentVisibilityAutoStateChanged Ereignis
Ein Ereignis, das für ein Element mit content-visibility: auto ausgelöst wird, wenn sich der Rendering-Status des Elements aufgrund eines der Attribute ändert, durch die das Element für den Nutzer relevant wird.
Der Anwendungsfall besteht darin, dass Entwickler mehr Kontrolle darüber haben, wann das Rendering beendet oder gestartet werden soll, wenn der User-Agent das Rendern der Unterstruktur für die Inhaltssichtbarkeit beendet oder startet. Beispielsweise kann der Entwickler React-Updates in einer Unterstruktur stoppen, die nicht vom User-Agent gerendert wird. Ebenso kann der Entwickler alle anderen Skriptaktualisierungen (z. B. Canvas-Updates) stoppen, wenn der User-Agent das Element nicht rendert.
Web APIs
Verwaltung von föderierten Anmeldedaten (zuvor WebID)
Die Federated Credential Management API ermöglicht es Nutzern, sich mit ihrer föderierten Identität bei Websites anzumelden, und zwar so, dass der Datenschutz des Browsers verbessert wird.
Medienquellenerweiterungen in Workern
Aktiviert die Nutzung der Media Source Extensions (MSE) API aus DedicatedWorker-Kontexten, um eine verbesserte Leistung bei der Zwischenspeicherung von Medien für die Wiedergabe durch ein HTMLMediaElement im Hauptfensterkontext zu ermöglichen. Durch Erstellen eines MediaSource-Objekts in einem DedicatedWorker-Kontext kann eine Anwendung ein MediaSourceHandle daraus abrufen und dieses Handle an den Hauptthread übertragen, um es an ein HTMLMediaElement anzuhängen. Der Kontext, in dem das MediaSource-Objekt erstellt wurde, kann es dann zum Zwischenspeichern von Medien verwenden.
Sec-CH-Prefers-Reduced-Motion Header für Client-Hinweise zu Medienfunktionen für Nutzerpräferenzen
Client Hints Headers für Nutzerpräferenzen für Medienfunktionen definiert eine Reihe von HTTP-Clienthinweisheadern zu Medienfunktionen, die Nutzerpräferenzen verwenden, wie in Stufe 5 für Medienabfragen definiert. Werden diese Header als kritische Clienthinweise verwendet, können Server intelligente Entscheidungen beispielsweise in Bezug auf CSS-Inlines treffen. Sec-CH-Prefers-Reduced-Motion spiegelt die prefers-reduced-motion-Einstellung des Nutzers wider.
WebTransport-BYOB-Leser
Unterstützt BYOB-Leser(Bring-your-own-buffer) für WebTransport, um das Lesen in einen vom Entwickler bereitgestellten Puffer zu ermöglichen. BYOB-Leser können Zwischenspeicherkopien minimieren und Speicherzuweisungen reduzieren.
Platzhalter in Ursprüngen der Berechtigungsrichtlinie
Die Spezifikation der Berechtigungsrichtlinie definiert einen Mechanismus, mit dem Entwickler die Verwendung verschiedener Browserfunktionen und APIs selektiv aktivieren und deaktivieren können. Durch eine Funktion dieses Mechanismus können Features nur für explizit spezifizierte Ursprünge aktiviert werden (z. B. https://foo.com/). Dieser Mechanismus ist nicht flexibel genug für das Design einiger CDNs, die Inhalte über einen Ursprung bereitstellen, der möglicherweise auf einer von mehreren hundert möglichen Subdomains gehostet wird.
Dieses Feature unterstützt daher Platzhalter in Berechtigungsrichtlinien wie SCHEME://*.HOST:PORT (z. B. https://*.foo.com/), bei denen ein gültiger Ursprung aus SCHEME://HOST:PORT erstellt werden kann (z. B. https://foo.com/). Dies setzt voraus, dass HOST eine registrierbare Domain ist. Das bedeutet, dass https://*.bar.foo.com/ funktioniert, https://*.com/ jedoch nicht. Wenn Sie allen Domains erlauben möchten, die Funktion zu verwenden, können Sie einfach an * delegieren.
Synchronisierungsmethoden für AccessHandles in der File System Access API
Aktualisiert die asynchronen Methoden flush(), getSize() und truncate() in FileSystemSyncAccessHandle in der File System Access API auf synchrone Methoden.
FileSystemSyncAccessHandle verwendet derzeit eine Mischung aus Synchronisierungs- und asynchronen Methoden, was die Leistung und Nutzerfreundlichkeit beeinträchtigt, insbesondere bei Anwendungen, die C/C++ zu Wasm portieren. Dieses Update sorgt für Konsistenz in der API-Nutzung und verbessert die Leistung für Wasm-basierte Bibliotheken.
Hierbei handelt es sich um eine potenzielle funktionsgefährdende Änderung. Weitere Informationen finden Sie unter Wichtige Änderung: Synchronisierungsmethoden für AccessHandles.
Bedingte WebAuthn-UI
Die bedingte Benutzeroberfläche für WebAuthn wird unter Windows 22H2 oder höher, macOS und Android P oder höher unterstützt. Die WebAuthn-Benutzeroberfläche auf Desktop-Plattformen wurde ebenfalls aktualisiert.
Variable COLRv1-Schriftarten und Schriftfunktionen erkennen
Unterstützung von Schriftarten für COLRv1-Variablen
COLRv1-Farbvektor-Schriftarten werden seit Chrome 98 unterstützt. In dieser ersten Version wurden jedoch nur statische Funktionen der COLRv1-Tabelle unterstützt. Die COLRv1-Spezifikation definiert die Integration in OpenType-Varianten, die es ermöglichen, die Schrifteigenschaften von Farbverläufen und Transformationen durch Ändern der variablen Achsenparameter zu ändern. Mit diesem zweiten Schritt werden solche Variationen in COLRv1 unterstützt.
font-tech()- und font-format()-Bedingungserweiterungen für CSS-@supports
Die Verwendung von font-tech() und font-format() in Verbindung mit CSS-@supports ermöglicht die Erkennung von Schriftarten- und Formatunterstützung sowie die schrittweise Verbesserung von Inhalten. Im folgenden Beispiel wird die Unterstützung von COLRv1-Schriftarten getestet.
@supports font-tech(color-COLRv1) {
}
Unterstützung der tech()-Funktion im @font-face src:-Deskriptor
CSS Fonts Level 4 bietet zusätzliche Möglichkeiten zum Auswählen oder Filtern von Schriftressourcen. Die Funktion tech() wurde eingeführt, mit der eine Liste von Schriftarttechnologien übergeben werden kann, die für dieses jeweilige Schriftart-Blob erforderlich sind. Der User-Agent wählt dann die erste geeignete Ressource aus.
Chrome für Android
Unter Android OSK wird die Größe des visuellen Darstellungsbereichs jetzt standardmäßig angepasst
Mit der Android-Bildschirmtastatur passt standardmäßig die Größe des visuellen Darstellungsbereichs und nicht die Größe des ursprünglichen Containerblocks an. Autoren können diese Funktion mit dem neuen Schlüssel für den Meta-Darstellungsbereich von interactive-widget deaktivieren.
Ursprungstests
In dieser Version von Chrome gibt es zwei neue Ursprungstests.
Händleridentität bei canmakepayment Ereignis
Das Service Worker-Ereignis canmakepayment teilt dem Händler mit, ob der Nutzer eine Karte in einer installierten Zahlungs-App hinterlegt hat. Dabei werden der Ursprungsort und beliebige Daten des Händlers automatisch vom Ursprung der Zahlungs-App an einen Service Worker weitergegeben. Diese ursprungsübergreifende Kommunikation erfolgt beim Erstellen von PaymentRequest in JavaScript, erfordert keine Nutzergeste und zeigt keine Benutzeroberfläche. Der Entwicklertest zum Entfernen der Identitätsfelder aus dem Ereignis „canmakepayment“ kann über chrome://flags/#clear-identity-in-can-make-payment aktiviert werden. Wenn Sie dieses Flag aktivieren, werden die Identitätsfelder im Ereignis „canmakepayment“ (und den Android-IS_READY_TO_PAY-Intent) leer gelassen.
Weitere Informationen finden Sie unter Ereignisverhalten „CanMakePayment“ der Payment Handler API aktualisieren.
Back-Forward-Cache NotRestoredReason API
Die NotRestoredReason API meldet eine Liste der Gründe, warum eine Seite nicht aus BFcache in einer Frame-Baumstruktur über die PerformanceNavigationTiming API bereitgestellt wird.
Seiten können aus verschiedenen Gründen aus dem BFcache blockiert werden, z. B. aufgrund der Spezifikation oder der Browserimplementierung. Entwickler können die Trefferrate von BFCache auf ihrer Website erfassen, indem sie den Parameter „pageshow-Handler“ und PerformanceNavigationTiming.type(back-forward) verwenden. Mit dieser API können Websites Informationen darüber sammeln, warum BFCache nicht bei einer Verlaufsnavigation verwendet wird, sodass sie für jeden Grund Maßnahmen ergreifen und ihre Seite mit BFCache kompatibel machen können.
Einstellungen und Löschungen
In dieser Version von Chrome werden die unten aufgeführten Einstellungen und Entfernungen eingeführt. Unter ChromeStatus.com finden Sie eine Liste der geplanten Einstellungen, aktuellen Einstellungen und vorherigen Entfernungen.
Einstellung von Produkten und Funktionen
In dieser Version von Chrome wird eine Funktion eingestellt.
window.defaultStatus und window.defaultstatus verwerfen und entfernen
Dies sind nicht standardmäßige APIs, die nicht von allen Browsern implementiert werden und keine Auswirkungen auf das Browserverhalten haben. Dadurch werden sie bereinigt und ein potenzielles Fingerprinting-Signal entfernt.
Sie wurden ursprünglich verwendet, um den Text in der Statusleiste unten in Browserfenstern zu ändern/zu steuern. Sie hatten jedoch nie wirklich Auswirkungen auf die Statusleiste von Chrome und sind keine standardisierten Attribute. Gecko unterstützt diese Attribute seit Version 23 nicht; WebKit unterstützt diese Attribute immer noch. Das zugehörige window.status-Attribut ist standardisiert, darf jedoch keine Auswirkungen auf die Statusleiste des Fensters haben.
Entfernen
In dieser Version von Chrome gibt es vier Funktionen.
ImageDecoderInit.premultiplyAlpha entfernen
Die Funktion hat in primären Anwendungsfällen keine beobachtbaren Auswirkungen, kann jedoch Implementierungen auf suboptimale Weise einschränken. Eine ausführlichere Beschreibung finden Sie hier. Gemäß dem Konsens der WebCodecs-Spezifikationseditoren und der mangelnden Nutzung (0,000000339% - 0,00000687% der Zähler pro Nutzung pro Nutzung in M106).
navigateEvent.restoreScroll() entfernen
„restoreScroll()“ wird durch „navigateEvent.scroll()“ ersetzt. scroll() funktioniert identisch, mit der Ausnahme, dass der Entwickler die Scrollzeit für Navigationsvorgänge steuern kann, bei denen es sich nicht um eine Navigation handelt. scroll() funktioniert, wenn das Scrollen keine Wiederherstellung ist, daher ändert sich der Name zusammen mit der Verhaltensänderung.
navigateEvent.transitionWhile() entfernen
transitionWhile() wird aufgrund von Designfehlern, die von Entwicklern gemeldet wurden, durch navigateEvent.intercept() ersetzt. Das Verhalten von „intercept()“ entspricht dem von „transitwhile()“, aber anstelle eines obligatorischen Promise-Parameters wird eine optionale Handler-Funktion verwendet, die ein Promise zurückgibt. Dadurch kann der Browser steuern, wann der Handler ausgeführt wird, was später und intuitiver ist als bei transitionWhile().
googIPv6 von WebRTC-mediaConstraint entfernen
"googIPv6: false" kann verwendet werden, um die IPv6-Unterstützung in WebRTC zu deaktivieren, wie im folgenden Beispiel gezeigt.
new RTCPeerConnection({}, {mandatory:{googIPv6:false}});
IPv6 ist seit vielen Jahren standardmäßig aktiviert und sollte nicht deaktiviert werden können. Dies ist eine Legacy-API, die in der Spezifikation nicht vorhanden ist.