CSS-bewegingspad, Back/Forward cache NotRestoredReason API, Document Picture-in-Picture en meer.
Tenzij anders aangegeven, zijn de beschreven 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 via de lijst op ChromeStatus.com. Chrome 116 is vanaf 19 juli 2023 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 twee nieuwe CSS-functies toe.
CSS-bewegingspad
Met Bewegingspad kunnen auteurs elk grafisch object positioneren en animeren langs een pad dat door de ontwikkelaar is opgegeven. Dit maakt een aantal krachtige nieuwe transformatiemogelijkheden mogelijk, zoals positionering met behulp van polaire coördinaten (met de functie ray() ) in plaats van de standaard rechthoekige coördinaten die worden gebruikt door de functie translate() , of het animeren van een element langs een gedefinieerd pad. Dit maakt het eenvoudiger om complexe en mooie 2D-ruimtelijke overgangen te definiëren. Een pad kan worden opgegeven als circle() , ellipse() , rect() , inset() , xywh() , polygon() , ray() en url() .
Animaties voor weergave en zichtbaarheid van inhoud
Chrome 116 ondersteunt de display en content-visibility in keyframe-animaties. Met deze ondersteuning kunnen ontwikkelaars exit-animaties maken, waarna het element automatisch wordt display: none of content-visibility: hidden zonder dat er JavaScript hoeft te worden geschreven om die schakelaar af te handelen nadat de animatie is voltooid. Hierdoor kunnen exit-animaties voor elementen puur in CSS worden toegevoegd.
Web-API's
AbortSignal.any()
Retourneert een signaal dat wordt afgebroken wanneer een van de bronsignalen wordt afgebroken. Ontwikkelaars kunnen dit gebruiken om onafhankelijke bronnen voor afbreken te combineren, bijvoorbeeld time-outs die zijn opgegeven met AbortSignal.timeout() en signalen die zijn gekoppeld aan een AbortController, en deze door te geven aan asynchrone API's zoals fetch() .
BYOB-ondersteuning voor ophalen
Chrome's implementatie van ReadableStream ondersteunt BYOB-lezers (bring-your-own-buffer) voor leesbare bytestreams. Nu is Response.body ook een leesbare bytestream in plaats van een "standaard" leesbare stream. Hierdoor kan de Fetch API worden gebruikt met BYOB-lezers, waardoor de overhead en kopieën van garbagecollection worden verminderd en de responsiviteit voor gebruikers wordt verbeterd. Blob.stream() profiteert nu ook van deze optimalisatie.
Achterwaartse/voorwaartse cache NotRestoredReason API
De NotRestoredReason API rapporteert de lijst met redenen waarom een pagina niet vanuit BFcache wordt weergegeven in een frameboomstructuur, via de PerformanceNavigationTiming API.
Documenteer Picture-in-Picture
Document Picture-in-Picture voegt een nieuwe API toe om een altijd zichtbaar venster te openen dat kan worden gevuld met willekeurige HTMLElements . Dit is een uitbreiding op de bestaande HTMLVideoElement API waarmee een HTMLVideoElement alleen in een Picture-in-Picture (PiP)-venster kan worden geplaatst. Hierdoor kunnen webontwikkelaars gebruikers een betere PiP-ervaring bieden.
Uitgebreide jokertekens in de oorsprong van het machtigingsbeleid
Jokertekens voor subdomeinen in toelatingslijsten boden enige waardevolle flexibiliteit, maar verschilden van bestaande wildcard-parsers en vereisten nieuw code- en specificatiewerk. Deze bedoeling zal die overhead verminderen door delen van de bestaande Content Security Policy-specificatie en scheme + wildcard domain en wildcard port op de toelatingslijst te hergebruiken. Concreet zou deze bedoeling de definitie van host-bron en schema-bron overnemen in plaats van oorsprong in de definitie van de Toelatingslijst, terwijl vereist wordt dat het padgedeelte leeg is (aangezien het machtigingsbeleid van toepassing is op overeenkomende oorsprong).
FedCM-bundel: Login Hint API, User Info API en RP Context API
Deze gebundelde update maakt aanpassingen mogelijk aan federatieve inlogstromen die gebruikmaken van Federated Credential Management API (FedCM).
Met de Login Hint API kan de Relying Party (RP) een hint opgeven over het gebruikersaccount dat zij in de FedCM-gebruikersinterface willen weergeven. Dit wordt vooral gebruikt om terugkerende gebruikers een betere UX te bieden.
Met de User Info API kan de identiteitsprovider (IdP) de gebruikersinformatie ophalen, zodat deze de inlogervaring voor terugkerende gebruikers kan personaliseren, bijvoorbeeld via gepersonaliseerde ‘Aanmelden met IdP’-knoppen.
Met de RP Context API kan de RP verzoeken dat het FedCM-dialoogvenster de titel "Aanmelden" vervangt door "Aanmelden", "Gebruiken" of "Doorgaan", om de werkelijke bedoeling voor de gebruiker op één lijn te brengen.
Niet-samengestelde muis en aanwijzer gaan naar/verlaten gebeurtenissen
Maak de eigenschap event.composed in mouseenter , mouseleave , pointerenter en pointerleave gebeurtenissen "false" om te voldoen aan de specificaties en om interop-lacunes op te lossen. Zowel de UI-gebeurtenissenspecificatie voor muisgebeurtenissen als de specificatie voor aanwijzergebeurtenissen definiëren deze gebeurtenissen als niet-samengesteld. Beide specificaties zijn een paar jaar geleden afgeweken van hun oorspronkelijke definities: https://github.com/w3c/uievents/pull/210 https://github.com/w3c/pointerevents/pull/461 Naast het aanpakken van de interop-kloof, Deze wijziging corrigeert ook een foutieve dubbele of drievoudige verzending van deze gebeurtenissen naar een schaduw-DOM-host in Chromium wanneer de schaduw-DOM ook naar de gebeurtenis luistert .
Verwijder document.open sandbox-overerving
Momenteel worden Sandbox-vlaggen van de beller momenteel toegepast op de opgeroepene wanneer document.open zich op een ander venster richt. Na deze wijziging zal dit niet meer het geval zijn.
Rapport Critical-CH veroorzaakte herstart in NavigationTiming
Websites kunnen aangeven dat een bepaalde clienthint cruciaal is voor de pagina door deze op te nemen in een Critical-CH HTTP-antwoordheader. Als u dit doet, wordt de verbinding opnieuw gestart als de hint in de Critical-CH HTTP-antwoordheader zou kunnen zijn opgenomen (maar niet was) in het aanvankelijk verzonden HTTP-verzoek. Deze bedoeling stelt voor om het readonly attribute DOMHighResTimeStamp criticalCHRestart; naar de PerformanceNavigationTiming interface.
Oorsprongsproeven zijn aan de gang
In Chrome 116 kunt u zich aanmelden voor de volgende nieuwe origin-proefversies .
COOP: eigenschappen beperken
Cross-Origin-Opener-Policy wordt gebruikt om de relatie tussen pop-ups en openers te verbreken en de veiligheid te vergroten. 'restrict-properties' is een voorgestelde waarde die de relatie beperkt in plaats van volledig verbreekt. Het zou crossOriginIsolated mogelijk maken in combinatie met COEP.
Schrijf u in voor de proefversie van COOP restrict-properties origins .
FedCM-inlogstatus-API
Met de IdP Sign-in Status API van de Federated Credential Management API (FedCM) kan een identiteitsprovider (IdP) aan de browser signaleren wanneer zijn gebruikers in-/uitloggen, zodat FedCM zijn privacy-eigenschappen kan verbeteren door de UX te optimaliseren.
Schrijf u in voor de FedCM Sign-in Status origin-proefperiode
EditContext-API
De EditContext API vereenvoudigt het proces van het integreren van een webapp met geavanceerde tekstinvoermethoden zoals VK-vormschrijven, handschriftpanelen, spraakherkenning en IME-composities. De API verbetert de toegankelijkheid en prestaties en ontgrendelt nieuwe mogelijkheden voor webgebaseerde editors.
Registreer u voor de EditContext API Origin-proefperiode
Lange animatieframetiming
Dit is een uitbreiding van lange taken. 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.
Registreer u voor de proefversie van Long Animation Frame Timing