Nieuw in DevTools - November 2026

Matthias Rohmer

Gepubliceerd: 20 oktober 2026

Chrome 155 en Chrome 156 zijn in oktober naar de stabiele versie verzonden. In november hebben ze een nieuwe set foutopsporings- en ontwerpmogelijkheden naar je browser gebracht: CSS-stijlinsectie in DevTools voor agents, een interactieve position-area-editor voor CSS-ankerpositionering in Elementen en Web Install-manifest en diagnostische gegevens over advertentieherkomst in Applicatie. Je kunt ook ongebruikte contextvariabelen opsporen in Geheugen, waarschuwingen voor Early Hints-preloads en permanente overschrijvingen inspecteren in Netwerk en soepeler door tijdlijnen navigeren in Prestaties.

Ankergridregio's selecteren in de visuele editor voor positiegebieden op het tabblad Stijlen van het deelvenster Elementen naast de overlay voor ankerpositionering.
Ankergridregio's selecteren in de visuele editor voor positiegebieden op het tabblad Stijlen van het deelvenster Elementen naast de overlay voor ankerpositionering.

DevTools voor agents

De MCP-server van Chrome DevTools voegt inspectie van CSS-stijlen, ondersteuning voor configuratiebestanden en parsering van gesegmenteerde traceringen toe voor programmeeragents:

  • CSS-stijlen inspecteren: Inspecteer berekende en overeenkomende stijlen met de tool get_css_styles, die paginering (pageSize en pageIdx) ondersteunt en overeenkomende regels, overgenomen regels, pseudo-elementen, @keyframes en @-regels (@position-try, @property en @function) opmaakt.
  • Besturingselementen voor configuratiebestanden en paden: Beheer servermarkeringen met een speciaal configuratiebestand, stel aangepaste bestandssysteemroots in en gebruik standaard --allow-unrestricted-paths in de CLI.
  • Traceringsbuffer parseren in segmenten: Parseer grote prestatieopnamen met een parser voor traceringsbuffers in segmenten en een standaard traceringsbuffer van 1,2 GB. DevTools beperkt ook de instanties van de trace-engine per parse om geheugenlekken te voorkomen.
  • Dialoogvensterverwerking en consolepersistentie: Verwerk JavaScript-dialoogvensters die worden geactiveerd tijdens acties van de invoertool automatisch en bewaar de berichtgeschiedenis van de console voor navigatie in hetzelfde document.
  • Menu-update: Klik in het hoofdmenu van DevTools op Chrome DevTools voor agents downloaden om de installatie-instructies te openen.

Ga voor meer informatie naar de chrome-devtools-mcp-repository.

Elementen: Visuele editor voor positiegebied, impliciete ankerselectie en updates voor CSS-ontwerp

Het deelvenster Elementen introduceert visuele tools voor CSS-ankerpositionering en breidt CSS-inspectie uit:

  • Visuele position-area-editor: Klik op de inline staal naast een position-area-declaratie op het tabblad Stijlen om visueel ankergridregio's te selecteren, assen tegelijkertijd of afzonderlijk te configureren, het zoekwoord self aan of uit te zetten en zoekwoorden zonder as in te korten.
  • Impliciete ankerselectie op popover-versieringen: Klik met de rechtermuisknop op een popover-versiering in de DOM-boomstructuur als een element meerdere impliciete ankers heeft om een bijbehorend ankerelement te inspecteren en ernaartoe te gaan.
  • Overlay voor vak voor ankerpositionering: Inspecteer de marge, opvulling, rand en contentvakken van het door inzetstukken aangepaste containerblok (IMCB) rechtstreeks in de viewport-overlay als je elementen met ankerpositionering debugt.
  • wrap-reverse in de Flexbox-editor: Schakel flex-wrap: wrap-reverse rechtstreeks aan of uit via de visuele Flexbox-editor op het tabblad Stijlen.
  • Inactieve css-stijlen voor @starting-style en overgenomen regels: Inspecteer inactieve @starting-style-regels en Inherited from-secties met behouden handmatige uitvouw- en samenvouwstatussen voor updates.
  • Aangepaste eigenschappen met meerdere streepjes en automatische aanvulling van klassen: Inspecteer en bewerk aangepaste CSS-eigenschappen die beginnen met 3 of meer streepjes (zoals ---theme-color) en filter al toegepaste klassen uit de suggesties voor automatische aanvulling van Nieuwe klasse toevoegen.
Een impliciet ankerelement selecteren in het contextmenu van de popover-adorner in de DOM-boomstructuur van het deelvenster Elementen.
Een impliciet ankerelement selecteren in het contextmenu van de popover-adorner in de DOM-boomstructuur van het deelvenster Elementen.

Chromium-problemen: 553335561, 438724570, 413061413, 397184392, 539424116, 533783988

Toepassing: Diagnostische gegevens van manifest voor webinstallatie, herkomst van advertenties en updates van opslagtabel

De deelvensters Application (App) en Issues (Problemen) voegen diagnostische gegevens toe voor Web Install-manifesten, de herkomst van advertentiescripts en opslaginspectie:

  • Diagnostische gegevens van manifest voor webinstallatie: Inspecteer manifestfouten voor webinstallatie (navigator.install en <install>) in het deelvenster Problemen. Dit omvat ophaalfouten, syntaxisfouten, ongeldige start_url-waarden, ontbrekende namen of ID's en ontbrekende manifesten, met rechtstreekse links naar het betreffende manifestbestand.
  • Documentatie over de kolom en statistiek Advertentieherkomst: Check de nieuwe kolom Advertentieherkomst in het gedeelte Advertenties van het deelvenster App om na te gaan of een advertentiescript overeenkomt met een bovenliggende scriptketen of een filterlijstregel, naast documentatietooltips en links naar Meer informatie over advertentiestatistieken.
  • Ergonomie van IndexedDB- en Cookies-tabellen: Vouw geneste objecten in het IndexedDB-gegevensraster uit met dynamische rijhoogten die je scrollpositie behouden en verwijder geselecteerde rijen in de tabel Cookies met het toetsenbord of het contextmenu.
De kolom Advertentieherkomst en de tooltip Herkomst in het gedeelte Advertenties van het deelvenster Applicatie inspecteren naast een fout in het manifest voor webinstallatie in de lade Problemen.
De kolom Advertentieherkomst en de tooltip Afstamming in het gedeelte Advertenties van het deelvenster Applicatie inspecteren naast een manifestfout voor webinstallatie in de lade Problemen.

Chromium-problemen: 333795265, 553428200, 514957134, 555304817, 555304814, 562142155

Netwerk: Early Hints-voorlaadwaarschuwingen en permanente overschrijvingen

Het deelvenster Netwerk verfijnt de diagnostische gegevens van Early Hints, lokale overschrijvingen en aangepaste headerworkflows:

  • Waarschuwing voor preload van Early Hints als het cachegeheugen uitstaat: Bekijk een waarschuwing in het gedeelte met Early Hints-headers als 103 Early Hints-reacties preloadlinks bevatten terwijl Cachegeheugen uitzetten actief is. Hierin wordt uitgelegd waarom Chrome die preloads negeert.
  • Permanente lokale overschrijvingen en aangepaste headerkolommen: Lever lokale overschrijvingen van de reactietekst aan via paginanavigatie, behoud aangepaste kolomconfiguraties voor verzoek- en reactieheaders en de sorteervolgorde bij opnieuw laden, en kopieer afgekapte onbewerkte verzoekpayloads vanuit het contextmenu.
Een waarschuwing voor vooraf laden van Early Hints inspecteren op het tabblad Headers van het deelvenster Netwerk met Cachegeheugen uitzetten aangezet en een lokale reactieoverschrijving actief.
Een waarschuwing voor Early Hints-preload inspecteren op het tabblad Headers van het deelvenster Netwerk met Cachegeheugen uitzetten aangezet en een lokale overschrijving van de reactie actief.

Chromium-problemen: 548701038, 559925510, 563542902, 556269542, 377410082

Geheugen: Detectie van dode contextvelden in momentopnamen van heap

Het deelvenster Geheugen herkent nu ongebruikte afsluitingsvariabelen die bewaard blijven in V8-uitvoeringscontexten. DevTools parseert V8-bereikmetadata die zijn ingesloten in momentopnamen van heap om closures te correleren met gedeelde Context-objecten. Daarna worden dode contextvelden gemarkeerd die in leven worden gehouden door gerelateerde langdurige closures wanneer geen enkele live closure ze opent, gesorteerd op geheugenimpact.

Een momentopname van heap filteren op Objecten die worden bewaard door contexten in het deelvenster Geheugen om een dode contextvariabele te inspecteren die wordt bewaard door een gedeelde V8-uitvoeringscontext.
Een momentopname van heap filteren op Objecten die worden bewaard door contexten in het deelvenster Geheugen om een dode contextvariabele te inspecteren die wordt bewaard door een gedeelde V8-uitvoeringscontext.

Chromium-problemen: 497855658

Prestaties: soepelere tijdlijnnavigatie en behouden status van de aanroepstructuur

Het deelvenster Prestaties biedt een responsievere navigatie in de flame chart en behoudt je analysecontext in verschillende deelvensters:

  • Soepelere tijdlijnnavigatie: Zoomen, pannen en slepen van de tijdlijnoverzichtskaart loopt niet meer achter.
  • Status van aanroeptree en bottom-up behouden: Wissel tussen DevTools-vensters zonder je uitgevouwen nodes, selectie of scrollpositie te verliezen op de tabbladen Aanroeptree en Bottom-up.
Een ingezoomd bereik van de tijdlijnoverzichtskaart en uitgevouwen JavaScript-activiteitsnodes inspecteren op het tabblad Aanroeptree van het deelvenster Prestaties.
Een ingezoomd tijdlijnbereik van de minimap en uitgevouwen JavaScript-activiteitsnodes inspecteren op het tabblad Aanroeptree van het deelvenster Prestaties.

Chromium-problemen: 553831653, 561396590

Andere hoogtepunten

Chrome 155 en Chrome 156 bevatten ook de volgende verbeteringen in de DevTools-deelvensters:

  • Sensoren: Overschrijf navigator.cpuPerformance rechtstreeks via de nieuwe bediening CPU-prestatieniveau in het deelvenster Sensoren of laat de actieve voorinstellingen voor CPU-beperking weerspiegelen. (Chromium-problemen: 449760252, 526856234, 526857820)
  • Apparaatmodus: Behoud je schaal- en zoomvoorkeuren voor automatisch aanpassen per geëmuleerd apparaat en behoud de overschrijving van Save-Data als je de apparaatwerkbalk aan- of uitzet. (Chromium-problemen: 561306841, 555160483)
  • Kleurkiezer: Bekijk APCA-contrastkleursuggesties voor lichte tekst op donkere achtergronden en converteer kleuren buiten het kleurengamma naar oklab() en oklch() zonder NaN-waarden. (Chromium-problemen: 560325669, 558821258)
  • Toegankelijkheid: Identificeer actieve schakelaars voor reguliere expressiefilters met een niet-gekleurde indicatorstip, laat namen van lettertype-eigenschappen aankondigen door schermlezers in CSS-overzicht en navigeer met verbeterde toetsenbordfocusringen en zichtbaarheid met hoog contrast in deelvensters. (Chromium-problemen: 556764882, 555848535, 555599825, 553804654)
De CPU-prestatielaag overschrijven in de lade Sensoren en suggesties voor contrastverhoudingen en oklch-waarden inspecteren in de kleurkiezer.
Het CPU-prestatieniveau overschrijven in de lade Sensoren en suggesties voor contrastverhoudingen en oklch-waarden inspecteren in de kleurkiezer.

Chromium-problemen: 449760252, 526856234, 526857820, 561306841, 555160483, 560325669, 558821258, 556764882, 555848535, 555599825, 553804654