Chrome 133 bèta

Rachel Andrew

Gepubliceerd: 15 januari 2024

Tenzij anders vermeld, zijn de volgende wijzigingen van toepassing op de nieuwste Chrome-bètaversie voor Android, ChromeOS, Linux, macOS en Windows. Meer informatie over de hier vermelde functies vindt u via de meegeleverde links of in de lijst op ChromeStatus.com. Chrome 133 is een bètaversie sinds 15 januari 2024. U kunt de nieuwste versie downloaden op Google.com voor desktop of in de Google Play Store voor Android.

CSS en UI

Deze release voegt zeven nieuwe CSS- en UI-functies toe.

De geavanceerde CSS-functie attr()

Implementeert de uitbreiding op attr() zoals gespecificeerd in CSS Level 5, waardoor naast <string> ook andere typen mogelijk zijn en het in alle CSS-eigenschappen kan worden gebruikt (naast de bestaande ondersteuning voor het pseudo-element content ).

Lees meer in CSS attr() krijgt een upgrade .

CSS :open pseudo-klasse

De pseudo-klasse :open komt overeen met <dialog> en <details> wanneer deze geopend zijn, en komt overeen met <select> en <input> wanneer deze een picker bevatten en deze picker zichtbaar is.

CSS-scrollstatuscontainerquery's

Gebruik containerquery's om de afstammelingen van containers te stylen op basis van hun scrollstatus.

De querycontainer is ofwel een scrollcontainer, ofwel een element dat wordt beïnvloed door de scrollpositie van een scrollcontainer. De volgende statussen kunnen worden opgevraagd:

  • stuck : Een vastgeplakte container is aan een van de randen van het scrollvak vastgeplakt.
  • snapped : Een container die is uitgelijnd met scroll snap is momenteel horizontaal of verticaal vastgeklikt.
  • scrollable : Geeft aan of een scrollcontainer in de gevraagde richting kan worden gescrollt.

Een nieuw container-type: scroll-state maakt het mogelijk om containers op te vragen.

#sticky {
  position: sticky;
  container-type: scroll-state;
}

@container scroll-state(stuck: top) {
  #sticky-child {
    font-size: 75%;
  }
}

Leer meer over CSS scroll-state() .

CSS text-box , text-box-trim en text-box-edge

Om een ​​optimale balans in de tekstinhoud te bereiken, maken de eigenschappen text-box-trim en text-box-edge , samen met de eigenschap text-box shorthand, een nauwkeurigere controle van de verticale uitlijning van de tekst mogelijk.

De eigenschap text-box-trim specificeert de zijden die moeten worden bijgesneden, boven of onder, en de eigenschap text-box-edge specificeert hoe de rand moet worden bijgesneden.

Met deze eigenschappen kunt u de verticale afstand nauwkeurig regelen door gebruik te maken van de lettertype-eigenschappen. Lees meer in CSS text-box-trim .

De hint van het popover attribuut

De Popover API specificeert het gedrag voor twee waarden van het attribuut popover : auto en manual . Deze beschrijving geeft een derde waarde weer: popover=hint . Hints, die meestal geassocieerd worden met "tooltip"-achtige gedragingen, hebben een iets ander gedrag. Het belangrijkste verschil is dat een hint ondergeschikt is aan auto bij het openen van geneste stapels popovers. Het is dus mogelijk om een ​​ongerelateerde hint popover te openen terwijl een bestaande stapel ` auto popovers open blijft.

Het canonieke voorbeeld is dat een <select> -kiezer geopend is ( popover=auto ) en dat er een tooltip wordt weergegeven die verschijnt wanneer er met de muis overheen wordt bewogen ( popover=hint ). Deze actie sluit de <select> -kiezer niet.

Verbeteringen in de positionering van popover-elementen en ankers.

Voegt een imperatieve manier toe om aanroeprelaties tussen popovers in te stellen met popover.showPopover({source}) . Maakt het mogelijk voor aanroeprelaties om impliciete verwijzingen naar ankerelementen te creëren.

Een popover die binnen een aanroeper is genest, mag deze niet opnieuw aanroepen.

In het volgende geval wordt de pop-up correct geactiveerd wanneer je op de knop klikt, maar het is niet de bedoeling dat de pop-up sluit wanneer je er vervolgens op klikt.

<button popovertarget=foo>Activate
  <div popover id=foo>Clicking me shouldn't close me</div>
</button>

Voorheen gebeurde dit doordat de klik op de popover doorsijpelde naar de <button> en de aanroeper activeerde, waardoor de popover werd gesloten. Dit is nu aangepast naar het verwachte gedrag.

Web-API's

Animation.overallProgress

Biedt ontwikkelaars een handige en consistente weergave van de voortgang van een animatie over de iteraties heen, ongeacht de aard van de tijdlijn. Zonder de eigenschap overallProgress moet u handmatig berekenen hoe ver een animatie is gevorderd, rekening houdend met het aantal iteraties van de animatie en of de currentTime van de animatie een percentage van de totale tijd is (zoals bij scroll-gestuurde animaties) of een absolute tijdsduur (zoals bij tijdgestuurde animaties).

De pause() -methode van het Atomics object

Voegt de pause() methode toe aan het Atomics -naamruimteobject om de CPU te laten weten dat de huidige code een spinlock uitvoert.

CSP-hashrapportage voor scripts

Complexe webapplicaties moeten om veiligheidsredenen vaak bijhouden welke subbronnen ze downloaden.

Met name aankomende industriestandaarden en best practices (zoals PCI-DSS v4) vereisen dat webapplicaties een inventaris bijhouden van alle scripts die ze downloaden en uitvoeren.

Deze functie bouwt voort op CSP en de Reporting API om de URL's en hashes (voor CORS/same-origin) van alle scriptbronnen die het document laadt, te rapporteren.

DOM-statusbehoudende verplaatsing

Voegt een DOM-primitief ( Node.prototype.moveBefore ) toe waarmee je elementen in een DOM-structuur kunt verplaatsen zonder de status van het element te resetten.

Bij het verplaatsen in plaats van verwijderen en invoegen, blijft de volgende status behouden:

  • <iframe> -elementen blijven geladen.
  • Het actieve element blijft in focus.
  • Pop-ups, volledig scherm en modale dialoogvensters blijven open.
  • CSS-overgangen en -animaties worden voortgezet.

Toon het attribuut attributionsrc op <area>

Zorgt ervoor dat de weergave van het attribuut attributionsrc op <area> overeenkomt met het bestaande verwerkingsgedrag van het attribuut, zelfs wanneer het niet was weergegeven.

Daarnaast is het logisch om het attribuut te ondersteunen voor <area> , aangezien dat element een volwaardig navigatieoppervlak is, en Chrome dit al ondersteunt voor de andere oppervlakken van <a> en window.open

Geef de vergrove cross-origin renderTime weer in element timing en LCP (ongeacht Timing-Allow-Origin ).

Elementtiming en LCP-items hebben een renderTime attribuut, dat is uitgelijnd met het eerste frame waarin een afbeelding of tekst werd getekend.

Dit attribuut wordt momenteel beschermd voor afbeeldingen van verschillende oorsprong door een Timing-Allow-Origin header op de afbeeldingsbron te vereisen. Deze beperking is echter eenvoudig te omzeilen (bijvoorbeeld door een afbeelding van dezelfde oorsprong en een afbeelding van een andere oorsprong in hetzelfde frame weer te geven).

Omdat dit tot verwarring heeft geleid, zijn we van plan deze beperking op te heffen en in plaats daarvan alle rendertijden met 4 ms te verhogen wanneer het document niet cross-origin-geïsoleerd is. Dit lijkt voldoende om te voorkomen dat er nuttige informatie over de decodeertijd van cross-origin-afbeeldingen uitlekt.

Herstel responseStart en introduceer firstResponseHeadersStart

Met 103 Early Hints ingeschakeld, hebben reacties twee tijdstempels:

  • Wanneer de eerste aanwijzingen arriveren (103)
  • Wanneer de laatste headers binnenkomen (bijv. 200)

Toen Chrome 115 firstInterimResponseStart introduceerde om het meten van deze twee tijdstempels mogelijk te maken, hebben we ook de betekenis van responseStart (gebruikt door Time to First Byte (TTFB) ) gewijzigd in "de uiteindelijke headers". Dit zorgde voor een compatibiliteitsprobleem met browsers en tools die deze veelgebruikte metriek niet op dezelfde manier hadden aangepast.

Chrome 133 draait deze wijziging responseStart terug om dit compatibiliteitsprobleem op te lossen en introduceert in plaats daarvan firstResponseHeadersStart , zodat websites de tijd tot de laatste headers kunnen meten, terwijl de oorspronkelijke definitie van TTFB behouden blijft.

De FileSystemObserver interface

De FileSystemObserver interface informeert websites over wijzigingen in het bestandssysteem. Websites kunnen wijzigingen in bestanden en mappen, waarvoor de gebruiker eerder toestemming heeft verleend, op het lokale apparaat van de gebruiker of in het Bucket File System (ook wel bekend als het Origin Private File System), detecteren en ontvangen basisinformatie over de wijziging, zoals het type wijziging.

Invriezen in de energiebesparende stand

Wanneer Energiebesparing is ingeschakeld, zal Chrome een 'browsecontextgroep' die langer dan vijf minuten verborgen en stil is geweest, bevriezen als een subgroep van frames van dezelfde oorsprong binnen die groep een drempelwaarde voor CPU-gebruik overschrijdt, tenzij:

  • Biedt functionaliteit voor audio- of videoconferenties (gedetecteerd door identificatie van microfoon, camera of scherm-/venster-/tabbladopname of een RTCPeerConnection met een 'open' RTCDataChannel of een 'live' MediaStreamTrack).
  • Bestuurt een extern apparaat (gedetecteerd via WebUSB, Web Bluetooth, WebHID of Web Serial).
  • Bevat een webvergrendeling of een IndexedDB-verbinding die een versie-update of een transactie op een andere verbinding blokkeert.

Het bevriezen van de uitvoering houdt in dat de uitvoering wordt gepauzeerd. Dit is formeel gedefinieerd in de Page Lifecycle API.

De drempelwaarde voor CPU-gebruik wordt zo ingesteld dat ongeveer 10% van de achtergrondtabbladen wordt bevroren wanneer Energiebesparing is ingeschakeld.

Meerdere importkaarten

Importmaps moeten momenteel geladen worden vóórdat een ES-module geladen wordt, en er kan slechts één importmap per document zijn. Dit maakt ze kwetsbaar en potentieel traag in de praktijk: elke module die vóór hen geladen wordt, kan de hele app laten crashen, en in apps met veel modules worden ze een grote, blokkerende factor, omdat de volledige map voor alle mogelijke modules eerst geladen moet worden.

Deze functie maakt het mogelijk om meerdere importkaarten per document te gebruiken door ze op een consistente en voorspelbare manier samen te voegen.

Opslagtoegangsheaders

Biedt een alternatieve manier voor geauthenticeerde embeds om zich aan te melden voor niet-gepartitioneerde cookies. Deze headers geven aan of niet-gepartitioneerde cookies worden (of kunnen worden) opgenomen in een bepaald netwerkverzoek en stellen servers in staat om reeds verleende 'storage-access'-machtigingen te activeren. Het bieden van een alternatieve manier om de 'storage-access'-machtiging te activeren, maakt gebruik door niet-iframe-bronnen mogelijk en kan de latentie voor geauthenticeerde embeds verminderen.

Ondersteuning voor het maken van ClipboardItem met Promise<DOMString>

Het ClipboardItem , de invoer voor de asynchrone clipboard write() methode, accepteert nu naast Blobs ook stringwaarden in de constructor. ClipboardItemData kan een Blob, een string of een Promise zijn die resulteert in een Blob of een string.

WebAssembly Memory64

Het memory64-voorstel voegt ondersteuning toe voor lineaire WebAssembly-geheugens met een grootte groter dan 2^32 bits. Het biedt geen nieuwe instructies, maar breidt de bestaande instructies uit om 64-bits indexen voor geheugens en tabellen mogelijk te maken.

Web Authentication API: PublicKeyCredential getClientCapabilities() methode

Met de methode `PublicKeyCredential getClientCapabilities() kunt u bepalen welke WebAuthn-functies door de client van de gebruiker worden ondersteund. De methode retourneert een lijst met ondersteunde mogelijkheden, waardoor ontwikkelaars authenticatieprocessen en -workflows kunnen afstemmen op de specifieke functionaliteit van de client.

WebGPU: 1-component vertex-formaten (en unorm8x4-bgra)

Voegt extra vertexformaten toe die niet aanwezig waren in de eerste versie van WebGPU vanwege gebrek aan ondersteuning of oude macOS-versies (die door geen enkele browser meer worden ondersteund). De 1-component vertexformaten stellen applicaties in staat om alleen de noodzakelijke gegevens op te vragen, terwijl ze voorheen minstens twee keer zoveel gegevens moesten opvragen voor 8- en 16-bits gegevenstypen. Het unorm8x4-bgra-formaat maakt het iets gemakkelijker om BGRA-gecodeerde vertexkleuren te laden met behoud van dezelfde shader.

Het X25519-algoritme van de Web Cryptography API

Het "X25519"-algoritme biedt hulpmiddelen om sleutelovereenkomst uit te voeren met behulp van de X25519-functie zoals gespecificeerd in [RFC7748]. De algoritme-identifier "X25519" kan in de SubtleCrypto-interface worden gebruikt om toegang te krijgen tot de geïmplementeerde bewerkingen: generateKey, importKey, exportKey, deriveKey en deriveBits.

Nieuwe oorsprongsproeven

In Chrome 133 kun je je aanmelden voor de volgende nieuwe Origin-proefversies .

Schakel de vriesfunctie uit in de energiebesparende modus.

Met deze proefperiode kunnen websites ervoor kiezen om het vastlopen tijdens het gebruik van de energiebesparingsmodus, dat standaard in Chrome 133 is ingebouwd, uit te schakelen.

Afschrijvingen en verwijderingen

Deze versie van Chrome introduceert de onderstaande afschrijvingen en verwijderingen. Ga naar ChromeStatus.com voor lijsten met geplande afschrijvingen, huidige afschrijvingen en eerdere verwijderingen.

Deze versie van Chrome verwijdert één nieuwe functie.

Schaf de WebGPU maxInterStageShaderComponents -limiet af.

De maxInterStageShaderComponents limit is afgeschaft vanwege een combinatie van factoren. De beoogde verwijderingsdatum is in Chrome versie 135.

  • Redundantie met maxInterStageShaderVariables : Deze limiet dient al een vergelijkbaar doel, namelijk het beheersen van de hoeveelheid gegevens die tussen shaderfasen wordt doorgegeven.
  • Kleine verschillen: Hoewel er kleine verschillen zijn in de manier waarop de twee limieten worden berekend, zijn deze verschillen gering en kunnen ze effectief worden beheerd binnen de maxInterStageShaderVariables -limiet.
  • Vereenvoudiging: Het verwijderen van maxInterStageShaderComponents stroomlijnt de shader-interface en vermindert de complexiteit voor ontwikkelaars. In plaats van twee afzonderlijke limieten met subtiele verschillen te beheren, kunnen ze zich concentreren op de beter benoemde en uitgebreidere maxInterStageShaderVariables .

In deze versie van Chrome zijn twee functies verwijderd.

Voorheen negeerde Chrome, wanneer een bron vooraf werd opgehaald met <link rel=prefetch> , de cache-eigenschappen (met name max-age en no-cache ) bij het eerste gebruik binnen vijf minuten om hernieuwd ophalen te voorkomen. Nu verwijdert Chrome dit speciale geval en gebruikt het de normale HTTP-cache-eigenschappen.

Dit betekent dat webontwikkelaars de juiste caching-headers (Cache-Control of Expires) moeten toevoegen om de voordelen van <link rel=prefetch> te kunnen benutten.

Dit heeft ook gevolgen voor de niet-standaard <link rel=prerender> .

Verwijder de Chrome-welkomstpagina die wordt geactiveerd bij de eerste keer opstarten met de standaardvoorkeuren.

Het toevoegen van chrome://welcome aan de first_run_tabs eigenschap van het initial_preferences bestand heeft nu geen effect meer. Dit is verwijderd omdat die pagina overbodig is, aangezien de eerste opstartervaring al wordt geactiveerd op desktopplatforms.