Wat is er nieuw in DevTools, Chrome 141

Sofia Emelianova
Sofia Emelianova
GitHub

Chrome DevTools (MCP) voor uw AI-agent

Bekijk nu een preview van de nieuwe Chrome DevTools Model Context Protocol (MCP)-server. Deze brengt de kracht van Chrome DevTools naar AI-codeerassistenten.

Voorheen konden codeerders niet zien wat de code die ze genereerden daadwerkelijk deed wanneer deze in de browser werd uitgevoerd. De Chrome DevTools MCP-server brengt hier verandering in. AI-codeerassistenten kunnen webpagina's rechtstreeks in Chrome debuggen en profiteren van de debugmogelijkheden en prestatie-inzichten van DevTools. Dit verbetert hun nauwkeurigheid bij het identificeren en oplossen van problemen.

Ontdek zelf hoe het werkt:

Raadpleeg Chrome DevTools (MCP) voor uw AI-agent voor meer informatie.

Debug de netwerkafhankelijkheidsboom met Gemini

Het inzicht Prestaties > Inzichten > Netwerkafhankelijkheidsboom bevat nu de knop Debuggen met AI. Hiermee gaat u naar het AI- assistentiepaneel, zodat u de boom kunt bespreken en debuggen met behulp van Gemini.

Het voor- en na-inzicht van het toevoegen van de knop 'Debuggen met AI' aan de 'Netwerk afhankelijkheidsboom'.

Exporteer uw chats met Gemini

U kunt nu uw huidige chat met Gemini exporteren of het antwoord naar het klembord kopiëren door op de knop Gesprek exporteren in de bovenste actiebalk te klikken of op Antwoord kopiëren onder het bericht van Gemini in de chat.

Voor en na het toevoegen van de export- en kopieerknoppen aan AI-assistentie.

Blijvende spoorconfiguratie in het Prestatiepaneel

Wanneer u een opgenomen spoor configureert in het deelvenster Prestaties , slaat DevTools uw configuratie nu op en past deze toe wanneer u het spoor opnieuw importeert of een nieuw spoor opneemt.

Filter IP-beveiligde netwerkverzoeken

In het paneel Netwerk kunt u nu verzoeken filteren die naar IP Protection-proxy's worden verzonden.

Voor en na het toevoegen van het filter 'IP-beveiligde verzoeken' aan het paneel Netwerk.

Elementen > tabblad Lay-out voegt ondersteuning voor metselwerklay-out toe

U kunt nu de metselwerkindeling bekijken via het tabblad Elementen > Stijlen .

Metselwerklay-out is een lay-outmethode waarbij de ene as een typische, strikte rasterlay-out gebruikt, meestal kolommen, en de andere een metselwerklay-out.

Voor en na het toevoegen van de metselwerklay-outondersteuning aan Elementen - Lay-out.

Vuurtoren 12.8.2

Het Lighthouse- paneel draait nu Lighthouse 12.8.2.

Het meest opvallende in deze versie is dat Lighthouse gevonden problemen met aangepaste CSS-eigenschappen opsplitst in aparte foutmeldingen.

Zie ook de volledige lijst met wijzigingen .

Voor de basisbeginselen van het gebruik van het Lighthouse- paneel in DevTools raadpleegt u Lighthouse: Optimaliseer de snelheid van uw website .

Chromium-probleem: 40543651 .

Diverse hoogtepunten

Dit zijn enkele van de vele opvallende oplossingen en verbeteringen in deze release:

  • Prestatie : Request Idle callbackgebeurtenissen bevatten nu de timeout outeigenschap ( crbug.com/441679219 ).
  • Toegankelijkheid . Schermlezers lezen nu het volgende voor:
  • Netwerk : Als u met de rechtermuisknop op een netwerklogboekitem klikt, wordt het geselecteerd ( crbug.com/368510578 ).

Download de previewkanalen

Overweeg Chrome Canary , Dev of Beta als uw standaard ontwikkelbrowser te gebruiken. Deze previewkanalen geven u toegang tot de nieuwste DevTools-functies, laten u geavanceerde webplatform-API's testen en helpen u problemen op uw site te ontdekken voordat uw gebruikers dat doen!

Neem contact op met het Chrome DevTools-team

Gebruik de volgende opties om nieuwe functies, updates of iets anders met betrekking tot DevTools te bespreken.

Wat is er nieuw in DevTools

Een lijst met alles wat in de serie Wat is er nieuw in DevTools is behandeld.