Wat is er nieuw in DevTools, Chrome 126

Sofia Emelianova
Sofia Emelianova
GitHub

Verbeteringen aan het prestatiepaneel

Deze versie brengt diverse verbeteringen aan het Prestatiepaneel .

Verplaats en verberg sporen met de bijgewerkte spoorconfiguratiemodus

U kunt nu de modus voor spoorconfiguratie openen door met de rechtermuisknop op de spoornaam te klikken en 'Sporen configureren' te selecteren. De bewerkingsknop die extra ruimte nodig had, is verwijderd.

Het voor en na het vervangen van de bewerkingsknop door een menuoptie.

Met de trackconfiguratiemodus kunt u de volgorde van tracks wijzigen en ze verbergen. Klik op up of down om de track te verplaatsen of klik op hide. Om de configuratiemodus te verlaten, klikt u onderaan op Finish configuring tracks . Deze configuratie blijft behouden voor nieuwe traces, maar niet voor volgende DevTools-sessies.

Chromium-probleem: 336266699 .

Negeer scripts in de vlamgrafiek

De vlamgrafiek in het hoofdspoor biedt ondersteuning voor een negeerlijst. U kunt nu met de rechtermuisknop op een script in de grafiek klikken en Script toevoegen aan negeerlijst selecteren.

De menuoptie om het script toe te voegen aan de lijst met te negeren scripts, scripts die als genegeerd zijn gemarkeerd en de bijbehorende regels in Instellingen.

De grafiek vouwt genegeerde scripts samen, markeert ze als ' Op negeerlijst' en voegt ze toe aan de aangepaste uitsluitingsregels in > Negeerlijst . Genegeerde scripts worden bewaard totdat u ze uit de trace of uit de aangepaste uitsluitingsregels verwijdert.

Chromium-probleem: 336266714 .

Verlaag de CPU 20 keer

Het CPU- throttlingmenu in de Capture-instellingen van het Prestatiepaneel krijgt een nieuwe optie voor 20x vertraging . Zo kunt u nu realistische prestatieproblemen nauwkeuriger reproduceren en analyseren, zelfs op high-end computers.

Voor en na het toevoegen van de optie '20x vertragen' aan de 'Opname-instellingen'.

Chromium-probleem: 324978881 .

Het paneel Prestatie-inzichten wordt verouderd

Het experimentele paneel Prestatie-inzichten wordt in 2024 verouderd. Het DevTools-team werkt aan de integratie van de meest nuttige functies in het paneel Prestatie . Het paneel Prestatie-inzichten toont nu bovenaan een banner die u informeert over de aanstaande veroudering.

De waarschuwingsbanner voor veroudering in het deelvenster 'Prestatie-inzichten'.

Zie Prestatietools in 2024 en daarna voor meer informatie.

Als u feedback hebt over wat wel en niet werkt en wat volgens u beter kan, horen we dat graag .

Plak hele headerstrings om ze te overschrijven

Bij het overschrijven van headers kunt u nu een volledige headerstring ( HEADER_NAME : VALUE ) plakken. DevTools zal de string bij : opsplitsen in een headernaam en de bijbehorende waarde.

Bekijk dit in actie in de onderstaande video.

Wanneer u kopteksten bewerkt, waarschuwt het paneel Netwerk u nu als u andere tekens dan alfanumerieke tekens, afbreekstreepjes en onderstrepingstekens hebt ingevoerd.

De waarschuwing naast een headernaam met niet-ondersteunde tekens.

Bovendien zijn de overschrijvingsmenuopties en de bewerkingsknoppen voor chrome:// -URL's uitgeschakeld, wat overeenkomt met het beoogde gedrag.

Chromium-problemen: 330967147 , 337012362 , 328210785 .

Overmatig geheugengebruik detecteren met nieuwe filters in heapsnapshots

Heap snapshots in het paneel Geheugen krijgen nieuwe filters waarmee u veelvoorkomende gevallen van inefficiënt geheugengebruik kunt vinden, zoals gedupliceerde strings, objecten die worden bewaard door losgekoppelde DOM-knooppunten en de DevTools Console .

Voor en na het toevoegen van filteropties voor veelvoorkomende gevallen van inefficiënt geheugengebruik.

Chromium-probleem: 337094903 .

Inspecteer opslagbuckets in Toepassing > Opslag

U kunt nu opslagbuckets inspecteren in een speciale boom in de sectie Toepassing > Opslag . Deze boom, die voorheen experimenteel was, is standaard ingeschakeld.

De voor- en na-instelling van de opslagbucketboom in de sectie Opslag.

Chromium-probleem: 338094915 .

Schakel self-XSS-waarschuwingen uit met een opdrachtregelvlag

Als u het gebruik van Chrome automatiseert of DevTools op een andere manier opent vanaf de opdrachtregel om fouten op te sporen, wilt u waarschijnlijk de self-XSS-waarschuwing uitschakelen die in elke nieuwe DevTools-sessie verschijnt.

Het self-xss waarschuwingsvenster in de console.

U kunt dit dialoogvenster nu uitschakelen door de opdrachtregelvlag --unsafely-disable-devtools-self-xss-warnings aan Chrome door te geven.

Chromium-probleem: 41491762 .

Vuurtoren 12.0.0

Het Lighthouse- paneel draait nu Lighthouse 12.0.0.

Deze update brengt een aantal wijzigingen met zich mee, waaronder de verwijdering van de PWA-categorie, een reorganisatie van de SEO-categorie, de afschaffing van de algemene besparingen, nieuwe audits en auditwijzigingen. Bekijk 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: 772558 .

Diverse hoogtepunten

Dit zijn enkele opmerkelijke oplossingen en verbeteringen in deze release:

  • Prestatie :
    • De instellingen voor langzame vastlegging ( Geavanceerde verfinstrumentatie inschakelen en CSS-selectorstatistieken inschakelen ) worden nu automatisch gewist tijdens de volgende DevTools-sessie.
    • Het tabblad Selectorstatistieken scrolt nu niet meer automatisch naar beneden als u in- of uitzoomt op het vlamdiagram en de gegevenswijzigingen ( 337999939 ).
  • Console : De sneltoets Ctrl + ` sluit nu de console in de lade alleen als deze in focus is ( 40875466 , 328210785 ).
  • Automatisch invullen : Adresverwerking is opgelost ( 335409093 , 335409707 ).
  • Toegankelijkheid : Schermlezeraankondigingen voor gelokaliseerde strings zijn opgelost ( 324930007 ).

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 dat in de serie Wat is er nieuw in DevTools is behandeld.