Wat is er nieuw in DevTools, Chrome 142

Code suggesties van Gemini

Je kunt nu door AI gegenereerde suggesties voor automatisch aanvullen krijgen in de panelen Console en Bronnen .

Code-suggestiefunctie in de console- en broncodepanelen

Om deze functie in te schakelen, ga je naar Instellingen > AI-innovaties en schakel je Code suggesties in.

Verbeteringen voor de DevTools MCP-server

Sinds de lancering van de publieke preview van de DevTools MCP-server met versie 0.2.1 hebben we diverse verbeteringen doorgevoerd met bijdragen van de community en versie 0.9.0 uitgebracht.

  • De ondersteuning voor Node.js is uitgebreid naar Node.js 20.
  • Netwerkverzoeken en consoleberichten kunnen gepagineerd worden om tokens te besparen en gefilterd worden op basis van verzoektype (bijvoorbeeld scripts, stylesheets, afbeeldingen) en berichttype (log, waarschuwing, fout).
  • Screenshots kunnen naar een specifiek pad en in verschillende formaten worden opgeslagen.
  • Configureerbare toolcategorieën stellen u in staat te organiseren welke functionaliteiten beschikbaar zijn, waardoor onnodige ruis wordt verminderd.
  • Je kunt nu opstartargumenten doorgeven aan het Chrome-exemplaar dat door de MCP-server wordt gebruikt.

Bekijk het openbare wijzigingslogboek op GitHub voor een volledige lijst met wijzigingen en bugfixes, en lees meer over de DevTools MCP-server in het aankondigingsblogbericht .

Snellere toegang tot AI-ondersteuning

DevTools bevat nu meer links die AI-ondersteuning bieden. Het contextmenu-item 'Vraag AI' is hernoemd naar 'Foutopsporing met AI' en aangevuld met concrete acties waarmee AI u kan helpen, afhankelijk van de context.

Met de extra nieuwe knop in de rechterbovenhoek van DevTools kunt u AI-ondersteuning overal binnen DevTools openen.

De nieuwe ingang wijst op AI-ondersteuning binnen DevTools.

Debug de volledige prestatietrace met Gemini.

Nadat je een trace hebt vastgelegd in het paneel Prestaties , kun je nu met Gemini chatten over de volledige trace, gerelateerde prestatie-inzichten en veldgegevens, zonder vooraf specifieke context te hoeven selecteren. Dit alles binnen hetzelfde gesprek. Zo kun je prestatieproblemen holistischer bekijken voordat je er dieper op ingaat.

Nadat je met behulp van Gemini een potentieel probleem hebt geïdentificeerd, kun je naadloos een specifiekere context selecteren, zoals een traceergebeurtenis of een prestatie-inzicht, voor nader onderzoek en het gesprek voortzetten.

Ook alle inzichten in Prestaties > Inzichten zijn nu beschikbaar om met Gemini te bespreken.

Ladeoriëntatie wisselen

De lade kan nu ook naar de zijkant worden verplaatst. Hierdoor kunt u panelen naast elkaar bekijken in plaats van boven elkaar. Klik met de rechtermuisknop op een paneelnaam in de hoofdtabbalk en selecteer 'Verplaatsen naar lade' om het geselecteerde paneel naar de lade te verplaatsen.

Voeg extra panelen toe aan de lade via > Meer gereedschap.

Nieuwe schakelaar in het zijpaneel om de oriëntatie te wijzigen

Google Ontwikkelaarsprogramma

Het Google Developer Program is nu geïntegreerd in DevTools, met directe links voor profielbeheer en nieuwe badges die je kunt verdienen.

Instellingen voor het Google Developer Profile in de DevTools-instellingen

Badges zijn een optionele functie. Om badges in te schakelen, ga je naar Instellingen > Voorkeuren > Account en schakel je 'Badges verdienen' in.

Diverse hoogtepunten

Dit zijn enkele van de vele belangrijke bugfixes en verbeteringen in deze release:

  • Het toepassingspaneel ondersteunt nu opslaginspectie voor alle soorten werknemers, waaronder servicemedewerkers, gedeelde medewerkers en dedicated medewerkers.
  • :target-current wordt nu weergegeven in het paneel Stijlen .
  • Het netwerkpaneel kan nu verzoeken filteren op basis van een nieuwe boolean Is ad-related .

Download de previewkanalen

Overweeg om Chrome Canary , Dev of Beta als standaard ontwikkelbrowser te gebruiken. Deze preview-versies geven je toegang tot de nieuwste DevTools-functies, stellen je in staat om geavanceerde API's van webplatformen te testen en helpen je problemen op je site te vinden voordat je gebruikers ze tegenkomen!

Neem contact op met het Chrome DevTools-team.

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

Wat is er nieuw in DevTools?

Een lijst van alles wat is behandeld in de serie 'Wat is nieuw in DevTools' .