Tenzij anders aangegeven, zijn de volgende wijzigingen van toepassing op de nieuwste release van het Chrome-bètakanaal voor Android, ChromeOS, Linux, macOS en Windows. Lees meer over de hier genoemde functies via de aangeboden links of uit de lijst op ChromeStatus.com . Chrome 123 is vanaf 21 februari 2024 een bètaversie. Je kunt het nieuwste downloaden op Google.com voor desktop of in de Google Play Store op Android.
CSS
Deze release voegt vijf nieuwe CSS-functies toe.
CSS light-dark()
kleurfunctie
Met de light-dark()
-functie in CSS kunnen ontwikkelaars het kleurenschema gemakkelijker aanpassen aan de voorkeur van een gebruiker voor de lichte of donkere modus.
Gebruik light-dark()
om twee verschillende kleurwaarden op te geven binnen één CSS-eigenschap. De browser (of het apparaat) kiest automatisch de juiste kleur op basis van de berekende color-scheme
van het element. Bijvoorbeeld met de volgende CSS:
- Als de gebruiker een licht thema heeft geselecteerd, heeft het
.target
element een limoenachtergrond. - Als de gebruiker een donker thema heeft geselecteerd, heeft het
.target
element een groene achtergrond.
html {
color-scheme: light dark;
}
.target {
background-color: light-dark(lime, green);
}
CSS beeld-in-beeld weergavemodus
Voegt ondersteuning toe aan de CSS display-mode
voor de picture-in-picture
waarde. Hierdoor kunnen webontwikkelaars specifieke CSS-regels schrijven die alleen worden toegepast wanneer (een deel van) de webapp in picture-in-picture-modus wordt weergegeven.
Lees meer over deze mediafunctie in de Picture-in-Picture-documentatie .
align-content CSS-eigenschap voor blokken
De CSS-eigenschap align-content
wordt nu ondersteund op blokcontainers en tabelcellen. Voorheen werd deze eigenschap alleen ondersteund voor raster- en flexitems. display: block
, display: list-item
en display: table-cell
kunnen nu bijvoorbeeld worden uitgelijnd met align-content
.
Meer informatie vindt u in Ondersteuning voor align-content
in blok- en tabelindelingen .
De CSS-eigenschap field-sizing
Met behulp van de eigenschap field-sizing
kunnen ontwikkelaars vaste standaardgroottes van formulierbesturingselementen uitschakelen en hun grootte afhankelijk maken van hun inhoud. Dit biedt een manier om automatisch groeiende tekstvelden te maken.
De CSS-eigenschap text-spacing-trim
Deze eigenschap past spatiëring toe op Chinese, Japanse en Koreaanse (CJK) leestekens om de visueel aantrekkelijke typografie te produceren zoals gedefinieerd door JLREQ (Vereisten voor Japanse tekstlay-out) en CLREQ (Vereisten voor Chinese tekstlay-out).
Veel CJK-interne tekens bevatten glyph-interne spaties. De CJK-punt en de CJK-haakjes sluiten hebben bijvoorbeeld gewoonlijk glyph-interne spaties op de rechterhelft van hun glyph-ruimten, om ze een constante vooruitgang te geven ten opzichte van andere ideografische karakters. Maar als ze op een rij verschijnen, worden de interne spaties van de glyph buitensporig groot. Deze functie past dergelijke buitensporige afstanden aan.
De eigenschap text-spacing-trim
accepteert een van de volgende vier waarden: normal
, trim-start
, space-all
en space-first
. Lees meer in Introductie van vier nieuwe internationale functies in CSS .
Web-API's
Sta het maken van WebAuthn-referenties toe in een cross-origin iframe
Met deze functie kunnen webontwikkelaars WebAuthn-referenties (dat wil zeggen 'publickey'-referenties, ook wel toegangssleutels genoemd) maken in cross-origin iframes. Er zijn twee voorwaarden vereist voor deze nieuwe vaardigheid:
- Het iframe heeft een toestemmingsbeleid
publickey-credentials-create-feature
. - Het iframe heeft een tijdelijke gebruikersactivatie.
Hierdoor kunnen ontwikkelaars toegangssleutels maken in ingebedde scenario's, zoals na een identiteitsversterkingsstroom waarbij de Relying Party een federatieve identiteitservaring biedt.
Functiebundel voor attributierapportage
Chrome 123 voegt triggergegevensaanpassing en aggregeerbare waardefilters toe aan de Attribution Reporting API, gericht op:
- Extra API-configureerbaarheid voor rapportage op gebeurtenisniveau door ondersteuning van maatwerk voor triggergegevenskardinaliteit en -waarden.
- Extra API-configureerbaarheid voor samenvattende rapporten door filters in aggregeerbare waarden te ondersteunen.
Meting van cross-app- en webattributie
Breidt de Attribution Reporting API uit, zodat conversies die op internet plaatsvinden, kunnen worden toegeschreven aan gebeurtenissen die buiten de browser plaatsvinden, binnen andere applicaties.
Het voorstel hier maakt gebruik van ondersteuning op besturingssysteemniveau voor attributie. Het geeft de ontwikkelaar met name de mogelijkheid om evenementen op het mobiele internet samen te voegen met evenementen in de Privacy Sandbox van Android, hoewel ook ondersteuning voor andere platforms kan worden geïmplementeerd.
blocking=render
op inline modulescripts
Dit is een kleine wijziging die een kunstmatige beperking van <script blocking="render">
verwijdert. Vóór deze wijziging vereist <script blocking="render"type="module">
een src
attribuut, zelfs als deze src
een gegevens-URI is. Dit is een onnodige beperking, omdat inline modulescripts die andere scripts importeren nog steeds in staat moeten zijn om te renderen.
De motivatie hiervoor is dat weergaveovergangen tussen documenten vaak afhankelijk zijn van render-blocking scripts voor aanpassing, dus het gemakkelijker maken van render-blocking scripts om te schrijven zou deze functie ondersteunen.
Document beeld-in-beeld: sta toe dat de focus()
API de opener focust
U kunt nu opener.focus()
vanuit een beeld-in-beeldvenster van een document gebruiken om de focus op systeemniveau te brengen naar het tabblad dat eigenaar is van het beeld-in-beeldvenster van het document.
Hierdoor kunnen ontwikkelaars het originele tabblad indien nodig weer naar de voorgrond brengen. Bijvoorbeeld wanneer de gebruiker toegang nodig heeft tot een UI-ervaring die niet in het kleinere beeld-in-beeld-venster past.
Importeer attributen with
syntaxis
Importattributen zijn een JavaScript-functie waarmee u importaangiften kunt annoteren, bijvoorbeeld import xxx from "mod" with { type: "json" }
. Chrome heeft oorspronkelijk een eerdere versie van het voorstel geleverd (in Chrome 91) met assert
als zoekwoord. Deze versie is vervolgens bijgewerkt voor gebruik with
enkele wijzigingen die nodig waren tijdens de integratie met HTML voor JSON- en CSS-modules.
jitterBufferTarget
Met het jitterBufferTarget
kenmerk kunnen toepassingen een doeltijdsduur in milliseconden aan media specificeren die de jitterbuffer RTCRtpReceiver
moet vasthouden. Dit beïnvloedt de hoeveelheid buffering die door de user-agent wordt gedaan, wat op zijn beurt de hertransmissies en het herstel van pakketverlies beïnvloedt. Door de doelwaarde te wijzigen, kunnen toepassingen de afweging bepalen tussen afspeelvertraging en het risico dat er geen audio- of videoframes meer beschikbaar zijn als gevolg van netwerkjitter.
Lange animatieframetiming
De Long Animation Frames API is een uitbreiding van de Long Tasks API . Het meet de taak samen met de daaropvolgende weergave-update, waarbij informatie wordt toegevoegd zoals langlopende scripts, weergavetijd en tijd besteed aan geforceerde lay-out en stijl, ook wel layout thrashing genoemd.
Ontwikkelaars kunnen dit gebruiken als een diagnose voor "traagheid", die wordt gemeten door INP , door de oorzaken te vinden van congestie in de hoofdthread, wat vaak de oorzaak is van slechte INP.
NavigatieActivering
De NavigationActivation-interface voegt navigation.activation
toe. Hiermee wordt de status opgeslagen over wanneer het huidige document werd geactiveerd (bijvoorbeeld wanneer het werd geïnitialiseerd of hersteld vanuit de back/forward cache).
Dit betekent dat ontwikkelaars aangepaste pagina's kunnen aanbieden op basis van waar de gebruiker vandaan navigeert. Voer bijvoorbeeld een andere animatie uit als deze van de startpagina komt.
pagina-onthullingsevenement
De pagereveal
gebeurtenis wordt geactiveerd op het vensterobject van een document bij de eerste weergavemogelijkheid nadat een document: in eerste instantie is geladen, is hersteld vanuit de back-forward cache of is geactiveerd vanuit een pre-render.
Het kan door een pagina-auteur worden gebruikt om een pagina-invoerervaring in te stellen, zoals een weergaveovergang vanuit een vorige status.
PointerEvent.deviceId voor inkten met meerdere pennen
Omdat apparaten met geavanceerde peninvoermogelijkheden steeds gangbaarder worden, is het belangrijk dat het webplatform zich blijft ontwikkelen om deze geavanceerde functies volledig te ondersteunen om rijke ervaringen voor zowel eindgebruikers als ontwikkelaars te ontsluiten. Eén van die verbeteringen is de mogelijkheid voor de digitalisator van een apparaat om meer dan één penapparaat te herkennen dat er tegelijkertijd mee communiceert. Deze functie is een uitbreiding op de PointerEvent
interface en bevat een nieuw kenmerk, deviceId
, dat een sessie-persistente, documentgeïsoleerde, unieke identificatie vertegenwoordigt die een ontwikkelaar op betrouwbare wijze kan gebruiken om individuele pennen te identificeren die interactie hebben met de pagina.
Toegangscontroles voor privénetwerken voor navigatieverzoeken: modus met alleen waarschuwingen
Voordat website A naar een andere site B in het privénetwerk van de gebruiker navigeert, doet deze functie het volgende:
- Controleert of het verzoek vanuit een beveiligde context is geïnitieerd.
- Verzendt een preflightverzoek en controleert of B reageert met een header die toegang tot privénetwerken toestaat.
Er zijn al functies voor subresources en werkrollen, maar deze toevoeging is specifiek bedoeld voor navigatieverzoeken.
Deze controles worden uitgevoerd om het privénetwerk van de gebruiker te beschermen. Omdat deze functie de 'alleen waarschuwing'-modus is, zullen de verzoeken niet mislukken als een van de controles mislukt. In plaats daarvan wordt er een waarschuwing weergegeven in DevTools, om ontwikkelaars te helpen zich voor te bereiden op de komende handhaving.
Sec-CH-UA-Form-Factor-clienthint
Deze hint geeft de "vormfactor" van de user-agent of het apparaat aan, zodat de site zijn reactie kan aanpassen.
API voor statische routering van servicemedewerkers
Met deze API kunnen ontwikkelaars de routing configureren en eenvoudige dingen die servicemedewerkers doen, ontlasten. Als aan de voorwaarde wordt voldaan, vindt de navigatie plaats zonder dat servicemedewerkers worden gestart of JavaScript wordt uitgevoerd, waardoor webpagina's prestatieboetes als gevolg van onderscheppingen van servicemedewerkers kunnen vermijden. Zie de vorige blogpost over deze API voor meer informatie.
Update voor gedeelde opslag
Deze update ondersteunt het uitvoeren van cross-origin worklets zonder dat u een iframe hoeft te maken.
zstd Inhoudscodering
Zstandard, of zstd, is een datacompressiemechanisme dat wordt beschreven in RFC8878. Het is een snel, verliesvrij compressie-algoritme, gericht op real-time compressiescenario's op zlib-niveau en betere compressieverhoudingen. Het zstd
token is toegevoegd als een IANA-geregistreerd Content-Encoding-token.
Door ondersteuning voor zstd
als inhoudscodering toe te voegen, kunnen pagina's sneller worden geladen en wordt minder bandbreedte gebruikt, en wordt er minder tijd, CPU en stroom besteed aan compressie op onze servers, wat resulteert in lagere serverkosten.
Nieuwe oorsprongsproeven
In Chrome 123 kunt u zich aanmelden voor de volgende nieuwe origin-proefversies .
WebAssembly JavaScript belooft integratie
Om responsieve applicaties die met WebAssembly zijn geschreven te ondersteunen, is het noodzakelijk om functies te bieden waarmee WebAssembly-programma's kunnen worden opgeschort en hervat.
Het primaire initiële gebruik van belofte-integratie is om WebAssembly-programma's waarvan de bron afhankelijk is van synchrone API's, toe te staan asynchrone API's te gebruiken die steeds vaker voorkomen op het webplatform.
Schrijf u in voor de proefversie van Promise Integration Origin .
Verhuizingen
Chrome 123 verwijdert de volgende functie.
De window-placement
voor window-management
machtigingen en machtigingsbeleid
In Chrome 111 is window-management
toegevoegd als een alias voor toestemming window-placement
en tekenreeksen voor toestemmingsbeleid. Dit was onderdeel van een grotere poging om de strings te hernoemen door uiteindelijk window-placement
af te schaffen en te verwijderen. De terminologiewijziging verbetert de levensduur van de descriptor naarmate de Window Management API in de loop van de tijd evolueert.
Beëindigingswaarschuwingen voor de alias window-placement
zijn begonnen in Chrome 113 en worden nu verwijderd.