Wat is er nieuw in DevTools, Chrome 142

Matthias Rohmer

Code suggesties van Gemini

U kunt nu door AI gegenereerde type-ahead-suggesties krijgen in de panelen Console en Bronnen .

Functie voor code-suggestie in de panelen Console en Bronnen

Om deze functie in te schakelen, gaat u naar Instellingen > AI-innovaties en schakelt u Codesuggesties in.

Verbeteringen voor de DevTools MCP-server

Sinds de lancering van de openbare preview van de DevTools MCP-server met v0.2.1 hebben we met bijdragen van de community diverse verbeteringen doorgevoerd en v0.9.0 uitgebracht.

  • Ondersteuning voor Node.js is uitgebreid tot Node.js 20.
  • Netwerkverzoeken en consoleberichten kunnen worden gepagineerd om tokens op te slaan en worden gefilterd op basis van het type verzoek (bijvoorbeeld scripts, stylesheets, afbeeldingen) en het type bericht (logboek, waarschuwing, fout).
  • Schermafbeeldingen kunnen naar een specifiek pad en in verschillende formaten worden uitgevoerd.
  • Met configureerbare gereedschapscategorieën kunt u bepalen welke mogelijkheden beschikbaar zijn, waardoor onnodige ruis wordt verminderd.
  • U kunt nu startargumenten doorgeven aan het Chrome-exemplaar dat door de MCP-server wordt gebruikt.

Zie het openbare changelog op GitHub voor de volledige lijst met wijzigingen en opgeloste bugs. Lees meer over de DevTools MCP-server in de aankondigingsblogpost .

Snellere toegang tot AI-assistentie

DevTools bevat nu meer links die AI-ondersteuning openen. Het contextmenu-item Vraag AI is hernoemd naar Debuggen met AI en aangepast met directe acties waarmee AI je kan helpen, op basis van context.

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

De nieuwe toegangspunten tot AI-ondersteuning in DevTools

Debug de volledige prestatietracering met Gemini

Nadat u een trace hebt vastgelegd in het Prestatiepaneel , kunt u nu met Gemini chatten over de volledige trace, gerelateerde prestatie-inzichten en veldgegevens zonder vooraf een specifieke context te selecteren, allemaal binnen hetzelfde gesprek. Zo kunt u prestatieproblemen holistischer bekijken voordat u er dieper op ingaat.

Nadat u met behulp van Gemini een mogelijk probleem hebt geïdentificeerd, kunt u naadloos een specifieker contextitem selecteren, zoals een traceergebeurtenis of een prestatie-inzicht, voor nadere inspectie en de chat voortzetten.

Ook zijn alle inzichten in Prestaties > Inzichten nu beschikbaar zodat u met Gemini kunt chatten.

Wissel lade-oriëntatie

De lade kan nu ook naar de zijkant worden verplaatst. Zo kunt u panelen naast elkaar bekijken in plaats van gestapeld. 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 hulpmiddelen.

Nieuwe schakelaar in de lade om de oriëntatie te veranderen

Google Developer Programma

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

Besturingselementen voor het Google Developer-profiel in de DevTools-instellingen

Badges zijn een opt-in-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 opvallende oplossingen en verbeteringen in deze release:

  • Het paneel Toepassing ondersteunt nu opslaginspectie voor alle typen werknemers, waaronder servicewerkers, gedeelde werknemers en toegewijde werknemers.
  • :target-current wordt nu weergegeven in het paneel Stijlen .
  • Het paneel Netwerk kan nu verzoeken filteren op basis van een nieuwe Is ad-related Booleaanse waarde.

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.