Chrome 148 bèta

Gepubliceerd: 8 april 2026

Tenzij anders vermeld, zijn de volgende wijzigingen van toepassing op de nieuwste Chrome-bètaversie voor Android, ChromeOS, Linux, macOS en Windows. Lees meer over deze functies via de meegeleverde links of ga naar ChromeStatus.com. Chrome bevindt zich in de bètafase vanaf deze release. U kunt de nieuwste bètaversie downloaden via Google.com voor desktop of via de Google Play Store voor Android.

CSS en UI

Naamgebaseerde containerquery's in CSS

Je kunt nu een CSS-container opvragen op basis van alleen de container-name , zonder een container-type aan het element toe te kennen.

#container {
  container-name: --foo;
}
@container --foo {
  input { background-color: green; }
}
<div id="container">
  <div><input></div>
</div>

Knip tekstoverloop bij gebruikersinteractie

Wanneer een gebruiker interactie heeft met tekst waarvoor text-overflow: ellipsis is ingesteld (bijvoorbeeld door te bewerken of door middel van cursornavigatie), verandert de tekst tijdelijk van een tekst met puntjes naar een afgeknipt gedeelte. Hierdoor kan de gebruiker de verborgen inhoud van het overloopgedeelte zien en ermee interageren. Deze functie is van toepassing op alle bewerkbare en niet-bewerkbare elementen. Voor formulierbesturingselementen zoals <textarea> en <input> wordt dit gedrag al ondersteund.

Stel dropEffect correct in voor dragEnter , dragLeave en dragOver gebeurtenissen.

De specificaties voor slepen en neerzetten vereisen dat het attribuut dropEffect van het dataTransfer object bepaalde vooraf bepaalde waarden heeft voor dragEnter , dragOver en dragLeave . dragEnter en dragOver moeten een dropEffect hebben op basis van de huidige effectAllowed . dragLeave moet altijd een none dropEffect hebben. Momenteel houdt Chrome zich niet aan deze regels. Vanaf Chrome 148 zal Chrome de specificatie respecteren en de juiste waarden aan dit attribuut toewijzen.

Video- en audio-elementen worden pas geladen wanneer ze geladen worden.

Deze functie voegt het attribuut loading toe aan <video> en <audio> ` elementen. Hierdoor kunnen ontwikkelaars het laden van mediabronnen uitstellen tot het element zich in de buurt van de viewport bevindt door loading="lazy" te gebruiken. Dit komt overeen met het bestaande lazy loading-gedrag voor <img> en <iframe> elementen, wat de laadsnelheid van de pagina verbetert en het dataverbruik vermindert.

CSS-functie at-rule() voor het detecteren van kenmerken

Deze functie voegt een at-rule() `-functie toe aan CSS @supports , waarmee ontwikkelaars kunnen detecteren of CSS `at-rules` worden ondersteund.

Voeg het trefwoord revert-rule toe

Het trefwoord revert-rule zet de cascade terug naar de vorige regel, net zoals revert-layer de cascade terugzet naar de vorige laag. Bijvoorbeeld:

div { color: green; }
div { color: revert-rule; /* Effectively green */ }

Dit is vooral handig bij voorwaardelijke regels, omdat je hiermee de huidige regel kunt opheffen als aan een voorwaarde niet wordt voldaan:

div {
  display: if(style(--layout: fancy): grid; else: revert-rule);
}

Ondersteuning voor text-decoration-skip-ink: all

Deze functie voegt ondersteuning toe voor de waarde ' all voor de CSS-eigenschap text-decoration-skip-ink . De eigenschap text-decoration-skip-ink ondersteunt al auto en none . De waarde all breidt dit uit door onvoorwaardelijk inktoverslaan toe te passen op alle tekens, inclusief CJK-tekens. auto laat CJK-tekens daarentegen niet overgeslagen, omdat inktoverslaan vaak ongewenste visuele resultaten oplevert voor ideografische schriften op de gebruikelijke onderstreepposities. Met text-decoration-skip-ink: all kunnen auteurs die text-underline-position of text-underline-offset hebben aangepast om conflicten met CJK-tekens te voorkomen, expliciet kiezen voor inktoverslaan voor die tekens.

Web-API's

Manifestleden lokaliseren

Deze functie ondersteunt lokalisatie van manifestleden, waardoor apps hun namen, beschrijvingen, pictogrammen en snelkoppelingen kunnen aanpassen aan de taal en regio van de gebruiker. Ontwikkelaars leveren gelokaliseerde waarden aan in het webapp-manifest. De browser selecteert automatisch de juiste bronnen op basis van de taalinstellingen van de gebruiker, wat taalondersteuning biedt voor verschillende markten.

Ondersteuning voor Open Font Format avar2 voor tekstvorming en glyph-weergave.

Versie 2 van de avar tabel (Axis Variations) stelt lettertypeontwerpers in staat variabele lettertypen te creëren met betere controle over interpolatie. Waar de oorspronkelijke specificatie voor variabele lettertypen assen onafhankelijk van elkaar behandelt, laat avar2 assen elkaar beïnvloeden. Dit resulteert in lettertypen die gebruiksvriendelijker zijn voor contentauteurs en maakt compacte opslag mogelijk.

Avar2 werkt met dezelfde bekende concepten van lettertypevariaties, maar hiermee kunt u variabele deltawaarden toepassen op de ontwerpassen zelf. Dit kan over een reeks van meerdere assen.

Je kunt bijvoorbeeld meta-schuifregelaars maken die meerdere variatie-assen tegelijk aansturen. Dit ontlast de gebruiker van het nauwkeurig afstellen en het vinden van een bruikbare optie binnen de ontwerpmogelijkheden van het lettertype.

Avar2 geeft lettertypeontwerpers meer controle over de bruikbare variatieruimte van hun lettertype en stelt hen in staat de aanpassing van ontwerpassen over meerdere assen te coördineren. Door de relaties tussen assen wiskundig te definiëren binnen de avar versie 2-tabel, kunnen lettertypen complexe ontwerpen realiseren met minder masters. Dit leidt tot kleinere bestandsgroottes omdat de interpolatie efficiënter wordt opgeslagen.

Webauthenticatie Directe gebruikersinterface-modus

Deze nieuwe modus voor navigator.credentials.get() zorgt ervoor dat de inlogpagina van de browser wordt weergegeven als de browser direct een toegangscode of wachtwoord voor de site kent. Anders wordt de promise afgewezen met NotAllowedError als er geen dergelijke inloggegevens beschikbaar zijn. Hierdoor kan de site voorkomen dat een inlogpagina wordt getoond als de browser een keuze aan inloggegevens kan aanbieden die waarschijnlijk succesvol zullen zijn. Het blijft echter wel mogelijk om een ​​inlogpagina te tonen in gevallen waarin dergelijke inloggegevens niet beschikbaar zijn.

Ondersteuning voor de Web Serial API op Android

De Web Serial API biedt een interface voor het verbinden met seriële apparaten. Deze apparaten kunnen verbinding maken via een seriële poort op het systeem van de gebruiker of via verwijderbare USB- en Bluetooth-apparaten die een seriële poort emuleren. De API wordt nu ondersteund op Android.

Gebruikers, met name in het onderwijs, bij hobbyisten en in de industrie, sluiten randapparatuur aan op hun computers die aangepaste software vereisen om te besturen. Robotica wordt bijvoorbeeld vaak gebruikt om computerprogrammering en elektronica te onderwijzen op scholen. Dit vereist software waarmee code naar een robot kan worden geüpload of waarmee deze op afstand kan worden bestuurd. In een industriële of hobbyomgeving wordt een apparaat, zoals een freesmachine, lasersnijder of 3D-printer, bestuurd door een programma dat draait op een aangesloten computer. Deze apparaten worden vaak aangestuurd door kleine microcontrollers via een seriële verbinding.

WebGPU linear_indexing

Deze functionaliteit voegt twee nieuwe ingebouwde waarden voor compute shaders toe om de gebruikerservaring te verbeteren. Deze waarden zijn geïmplementeerd voor alle backends (als polyfills van bestaande ingebouwde waarden).

SharedWorker ondersteuning op Android

SharedWorker is lange tijd uitgeschakeld geweest op Android vanwege zorgen over de onvoorspelbare levenscyclus van het proces. Chrome-ontwikkelaars waren van mening dat SharedWorker instanties onverwacht konden worden beëindigd zonder gebruikers of webontwikkelaars hiervan op de hoogte te stellen. Dit werd als onacceptabel beschouwd.

Een recente discussie op GitHub suggereert echter dat de onvoorspelbare aard van de proceslevenscyclus van SharedWorker mogelijk niet zo'n groot probleem is als eerder werd gedacht. Op basis hiervan schakelt Chrome SharedWorker op Android weer in, terwijl tegelijkertijd dit gedrag wordt onderzocht om een ​​stabiele en betrouwbare ervaring te garanderen.

Verlengde levensduur voor gedeelde werknemers

Deze update voegt een nieuwe optie, extendedLifetime: true , toe aan de SharedWorker constructor. Hiermee wordt ervoor gezorgd dat de shared worker actief blijft, zelfs nadat alle huidige clients zijn afgesloten. Het belangrijkste gebruiksscenario is om pagina's asynchroon werk te laten uitvoeren dat JavaScript vereist, zelfs nadat een pagina is afgesloten, zonder dat een service worker nodig is.

Prompt API

De Prompt API biedt webontwikkelaars directe toegang tot een door de browser geleverd AI-taalmodel voor gebruik op het apparaat. Het API-ontwerp biedt gedetailleerde controle, afgestemd op de structuur van cloud-API's. Hierdoor kunt u websites stapsgewijs verbeteren met modelinteracties die zijn afgestemd op individuele gebruiksscenario's. Dit vormt een aanvulling op taakgebaseerde taalmodel-API's (bijvoorbeeld de Summarizer API ) en diverse API's en frameworks voor gegeneraliseerde inferentie op het apparaat met door ontwikkelaars geleverde machine learning-modellen. De eerste implementatie ondersteunt tekst-, beeld- en audio-input, evenals responsbeperkingen die ervoor zorgen dat de gegenereerde tekst voldoet aan vooraf gedefinieerde reguliere expressies en JSON Schema-formaten.

Dit ondersteunt een breed scala aan toepassingen. Zo kan het bijvoorbeeld bijschriften bij afbeeldingen genereren, visuele zoekopdrachten uitvoeren, audio transcriberen, geluidsgebeurtenissen classificeren, tekst genereren volgens specifieke instructies en informatie of inzichten extraheren uit multimodaal bronmateriaal.

Deze API is al beschikbaar in Chrome-extensies. Deze intent houdt de beschikbaarheid op het web bij. Er is een bedrijfsbeleid, GenAILocalFoundationalModelSettings , beschikbaar om het downloaden van het onderliggende model uit te schakelen, waardoor deze API niet beschikbaar is. Bedrijfsbeheerders kunnen ook het beleid BuiltInAIAPIsEnabled instellen om het gebruik van de Built-In AI API te blokkeren, terwijl andere GenAI-functies op het apparaat wel toegestaan ​​blijven.

Logboek voor taalondersteuning:

  • Chrome versie 139 en eerder ondersteunde alleen Engels ( 'en' ).
  • Chrome 140 biedt nu ook ondersteuning voor Spaans en Japans ( 'es' en 'ja' ).

Profiteer van veilige betalingsbevestigingsmogelijkheden.

Deze functie voegt een nieuwe statische methode toe aan de Payment Request API waarmee webontwikkelaars de mogelijkheden van de browserimplementatie voor beveiligde betalingsbevestiging kunnen opvragen. Dit helpt webontwikkelaars te weten welke mogelijkheden beschikbaar zijn voor beveiligde betalingsbevestiging. Ze kunnen vervolgens beslissen of ze beveiligde betalingsbevestiging met die mogelijkheden willen gebruiken.

IDNA ContextJ-regels

IDNA is het mechanisme voor niet-ASCII-tekens in domeinnamen. Het codeert een URL zoals http://네이버.한국/ als http://xn--950bt9s8xi.xn--3e0b707e/ (een redirect naar naver.com).

De URL-specificatie stelt de CheckJoiners vlag in, waardoor de ContextJ regels in IDNA2008 worden ingeschakeld. Dit verbiedt ZWNJ (U+200C ZERO WIDTH NON-JOINER) en ZWJ (U+200D ZERO WIDTH JOINER) op de meeste plaatsen in URL's. De implementatie geeft de UIDNA_CHECK_CONTEXTJ optie door aan ICU, waar deze regel wordt geïmplementeerd.

Hergebruik no-store-images bij dezelfde broncode-hertoewijzing.

Deze functie zorgt ervoor dat het hergebruik van beschikbare afbeeldingen in hetzelfde document Cache-Control: no-store reload-regel omzeilt wanneer dezelfde src waarde opnieuw wordt toegewezen aan een <img> -element. Voorheen haalde Blink de afbeelding opnieuw op, zelfs als deze al was gedecodeerd en beschikbaar was in het document. Dit sluit aan bij het bestaande gedrag van Gecko en WebKit.

Voeg het veld contentType toe aan Resource Timing.

Deze functie voegt het veld contentType toe aan PerformanceResourceTiming om een ​​tekenreeks op te slaan die overeenkomt met het inhoudstype van de opgehaalde bron, zoals geretourneerd door de server.

Onderdruk aanwijzergebeurtenissen bij het starten van de sleepbeweging

Volgens de HTML-specificatie moet de user agent, zodra een sleepbeweging start, de juiste gebeurtenissen naar de sleepbron sturen om aan te geven dat de gebeurtenisstroom van de aanwijzer is beëindigd en dat er geen verdere gebeurtenissen van deze aanwijzer meer verwacht hoeven te worden. Deze code was gedeeltelijk geïmplementeerd voor muisgebeurtenissen en volledig geïmplementeerd voor aanraaksleepbewegingen op Android. Met deze functie wil Chrome volledig voldoen aan deze specificatievereiste op alle andere platforms. In de praktijk betekent dit dat de sleepbron, nadat een sleepbeweging is gestart, nu de gebeurtenissen pointercancel , pointerout en pointerleave ontvangt om aan te geven dat de huidige gebeurtenisstroom is beëindigd.

WebRTC-datakanaal: onderhandel altijd over datakanalen.

Deze functie implementeert een WebRTC-extensie, alwaysNegotiateDataChannels , die een manier definieert voor een applicatie om datakanalen in een SDP-aanbod te onderhandelen voordat een datakanaal wordt aangemaakt. Dit onderhandelt ook over de data m= sectie vóór eventuele audio- of video m secties en gebruikt deze als de 'offerer-tagged m= sectie' voor [BUNDLE] .

Dit betekent dat als je een RTCPeerConnection aanmaakt met alwaysNegotiateDataChannels: true en vervolgens createOffer() aanroept, er een offer wordt aangemaakt met een applicatie-m-regel in de SDP. Bijvoorbeeld:

  const pc = new RTCPeerConnection({
    alwaysNegotiateDataChannels: true});
  const offer = await pc.createOffer();

Als je ook een audiotransceiver en een datakanaal toevoegt, onderhandelt het aanbod over een applicatie-m-lijn gevolgd door een audio-m-lijn in de SDP:

  const pc = new RTCPeerConnection({
    alwaysNegotiateDataChannels: true});
  pc.addTransceiver('audio');
  pc.createDataChannel('somechannel');
  const offer = await pc.createOffer();

Nieuwe oorsprongsproeven

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

Agentic Federated Login

Een set FedCM-extensies om agent-browsers te helpen gebruikers veilig in te loggen op websites met behulp van hun gefedereerde accounts.

Toegangslijsten

Verbindingslijsten met toegestane eindpunten is een functie die is ontworpen om expliciete controle te bieden over externe eindpunten door verbindingen te beperken die via de Fetch API of andere webplatform-API's vanuit een document of worker worden geïnitieerd. De voorgestelde implementatie verspreidt een lijst met geautoriseerde eindpunten vanaf de server via een HTTP-antwoordheader. Voordat de user agent namens een pagina een verbinding tot stand brengt, evalueert de agent de bestemming aan de hand van deze lijst met toegestane eindpunten. Verbindingen met geverifieerde eindpunten zijn toegestaan, terwijl verbindingen die niet overeenkomen met de vermeldingen in de lijst worden geblokkeerd.

Containertiming

Met de Container Timing API kunt u bijhouden wanneer geannoteerde DOM-secties op het scherm worden weergegeven en hun initiële weergave hebben voltooid. U kunt subsecties van de DOM markeren met het attribuut containertiming (vergelijkbaar met elementtiming voor de Element Timing API) en prestatiegegevens ontvangen wanneer die sectie voor het eerst is weergegeven. Deze API stelt u in staat de timing van verschillende componenten op uw pagina's te meten.

Declaratieve CSS-modulescripts

Declaratieve CSS-modulescripts zijn een uitbreiding van de bestaande scriptgebaseerde CSS-modulescripts. Ze stellen ontwikkelaars in staat om declaratieve stylesheets te delen met shadow roots, inclusief declaratieve shadow roots. Ontwikkelaars kunnen inline stijlmodules definiëren met <style type="module" specifier="foo"> en een declaratieve module toepassen op een declaratieve shadow DOM door te verwijzen naar specifier of een URL, zoals <template shadowrootmode="open" shadowrootadoptedstylesheets="foo"> .

HTML-in-canvas

HTML-in-canvas is een nieuwe API waarmee je DOM-elementen direct in een canvas of WebGL/WebGPU-textuur kunt weergeven, terwijl de interactiviteit en toegankelijkheid van de inhoud behouden blijven. De API bestaat uit drie onderdelen: een attribuut om canvas-elementen in te schakelen ( layoutsubtree ), methoden om kindelementen te tekenen ( 2d: drawElementImage , webgl:texElementImage2D , webgpu: copyElementImageToTexture ) en een manier om de transformatie van het element correct op het scherm bij te werken voor interactiviteit.

Lange animatieframes stijlduur

Deze functie voegt informatie over styleDuration en forcedStyleDuration toe aan de Long Animation Frame API. Hierdoor kunnen ontwikkelaars onderscheid maken tussen de duur van de stijl en de duur van de lay-out.

OpaqueRange

OpaqueRange vertegenwoordigt een live tekstbereik binnen de waarde van een formulierbesturingselement (bijvoorbeeld een <textarea> of een tekstveld <input> ), zodat ontwikkelaars met waardetekst kunnen werken met behulp van bereikachtige API's.

Het maakt bewerkingen mogelijk zoals getBoundingClientRect() , getClientRects() , en het gebruik met de CSS Highlights API voor UI-elementen zoals inline suggesties, highlights en verankerde popovers. Het behoudt de inkapseling door alleen waarde-offsets bloot te leggen (en null terug te geven voor startContainer en endContainer ), zodat DOM-eindpunten en de interne structuur niet worden blootgesteld.

Verwerkingsinstructies parseren in HTML

Verwerkingsinstructies (syntaxis: <?target data> ) zijn een bestaande DOM-constructie die beschikbaar is in XML. Deze constructie stelt knooppuntobjecten die geen elementen zijn in staat om semantische betekenis te geven voor de verwerking van een document. Je kunt ze bijvoorbeeld gebruiken om bereiken aan te duiden voor streaming of highlighting zonder dat er nieuwe DOM-elementen nodig zijn en zonder dat de DOM-structuur verandert wat CSS betreft. Je kunt ze ook gebruiken als richtlijnen voor de HTML-parser over hoe te bufferen en te streamen.

Toestemmingsbeleid: focus-zonder-gebruikersactivering

Dit beleid geeft embedders controle over programmatische focus vanuit ingesloten content via het focus-without-user-activation permissiebeleid. Wanneer het beleid voor een frame is geweigerd, worden programmatische focusoproepen ( element.focus() , autofocus , window.focus() , dialog.showModal() en focus op popovers) geblokkeerd, tenzij ze worden geactiveerd door de gebruiker. Focus die door de gebruiker wordt geïnitieerd, zoals klikken of tabben, wordt nooit beïnvloed. U kunt het beleid instellen via een Permissions-Policy HTTP-antwoordheader of het iframe allow attribuut. Focusdelegatie wordt ondersteund. Een ouderframe dat focus heeft, kan programmatisch focus doorgeven aan een kind-iframe, zelfs als het kind het beleid geweigerd heeft. Zodra een frame focus heeft, kan het de focus binnen zijn eigen subboom verplaatsen.

API-bemonsteringsparameters prompt

Deze functie voegt samplingparameters toe aan de Prompt API. Deze parameters bepalen hoe tokens uit het model worden gesampled, waardoor ontwikkelaars controle krijgen over de creativiteit of willekeurigheid van de output. Daarnaast worden attributen toegevoegd aan de LanguageModel instantie om de ingestelde waarden uit te lezen. Er wordt ook een statische LanguageModel -functie toegevoegd om de standaard- en maximumwaarden van deze parameters op te halen. De eerste implementatie voegt de parameters temperature en topK toe.

HTML-installatie-element voor webapps

Met deze functie kan een website gebruikers op een expliciete manier vragen om een ​​webapplicatie te installeren. Het element accepteert optioneel twee attributen, waarmee je content van een andere bron kunt installeren.