Wat is er nieuw in DevTools, Chrome 126

Sofia Emelianova
Sofia Emelianova
GitHub

Verbeteringen in het prestatiepaneel

Deze versie brengt verschillende verbeteringen aan in het Prestatiepaneel .

Verplaats en verberg tracks met de bijgewerkte trackconfiguratiemodus

U kunt nu de trackconfiguratiemodus openen door met de rechtermuisknop op de tracknaam te klikken en Tracks configureren te selecteren. De bewerkingsknop die extra ruimte nodig had, is verwijderd.

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

In de trackconfiguratiemodus kunt u de volgorde van de tracks wijzigen en verbergen. Klik op omhoog of omlaag om de track te verplaatsen of klik op verbergen. Om de configuratiemodus te verlaten, klikt u onderaan op Configuratie van tracks voltooien . Deze configuratie blijft bestaan ​​voor nieuwe traceringen, maar niet voor volgende DevTools-sessies.

Chroomuitgave: 336266699 .

Negeer scripts in het vlammendiagram

Het vlammendiagram in het hoofdspoor voegt ondersteuning voor negeerlijsten toe. U kunt nu met de rechtermuisknop op een script in het diagram klikken en Script toevoegen aan negeerlijst selecteren.

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

Het diagram vouwt genegeerde scripts samen, markeert ze als Op negeerlijst en voegt ze toe aan de aangepaste uitsluitingsregels in Instellingen > Negeerlijst . Genegeerde scripts worden opgeslagen totdat u ze uit de tracering of uit de aangepaste uitsluitingsregels verwijdert.

Chroomuitgave: 336266714 .

Verlaag de CPU twintig keer

Het CPU- throttling-menu in Capture-instellingen van het Prestatiepaneel krijgt een nieuwe 20x vertragingsoptie . U kunt nu dus nauwkeuriger prestatieproblemen in de echte wereld reproduceren en analyseren, zelfs op geavanceerde computers.

De voor en na het toevoegen van de '20x slowdonw'-optie aan de 'Capture-instellingen'.

Chroomuitgave: 324978881 .

Het paneel Prestatie-inzichten wordt beëindigd

Het experimentele paneel Prestatie-inzichten wordt in 2024 beëindigd. Het DevTools-team werkt aan de integratie van de nuttigste functies in het paneel Prestaties . In het deelvenster Prestatie-inzichten wordt nu bovenaan een banner weergegeven die u informeert over de aanstaande beëindiging.

De waarschuwingsbanner voor beëindiging in het venster 'Prestatie-inzichten'.

Zie Prestatietools in 2024 en daarna voor meer informatie.

Als u feedback heeft over wat werkt, wat niet werkt en wat volgens u beter kan, horen wij dat graag van u .

Plak volledige headerreeksen om ze te overschrijven

Wanneer u headers overschrijft , kunt u nu een volledige headertekenreeks plakken ( HEADER_NAME : VALUE ) en DevTools zal de tekenreeks op : splitsen in een headernaam en de bijbehorende waarde.

Bekijk dit in actie in de volgende video.

Bij het bewerken van kopteksten waarschuwt het netwerkpaneel u nu als u andere tekens dan alfanumerieke tekens, koppeltekens en onderstrepingstekens hebt ingevoerd.

De waarschuwing naast een headernaam met niet-ondersteunde tekens.

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

Chroomuitgaves: 330967147 , 337012362 , 328210785 .

Vind overmatig geheugengebruik met nieuwe filters in heap-snapshots

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

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

Chroomuitgave: 337094903 .

Inspecteer opslagbuckets in Toepassing > Opslag

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

De voor en na het inschakelen van de opslagbucketsboom in de sectie Opslag.

Chroomuitgave: 338094915 .

Schakel zelf-XSS-waarschuwingen uit met een opdrachtregelvlag

Als u het Chrome-gebruik automatiseert of DevTools op een andere manier opent vanaf de opdrachtregel voor foutopsporing, wilt u vaak de zelf-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 door te geven aan Chrome.

Chroomuitgave: 41491762 .

Vuurtoren 12.0.0

Het Lighthouse- paneel draait nu Lighthouse 12.0.0.

Deze update brengt een aantal wijzigingen met zich mee, waaronder verwijdering van PWA-categorieën, reorganisatie van SEO-categorieën, beëindiging van algehele besparingen, nieuwe audits en auditwijzigingen. Bekijk de volledige lijst met wijzigingen .

Zie Lighthouse: Websitesnelheid optimaliseren voor meer informatie over de basisprincipes van het gebruik van het Lighthouse -paneel in DevTools.

Chroomuitgave: 772558 .

Diverse hoogtepunten

Dit zijn enkele opmerkelijke oplossingen en verbeteringen in deze release:

  • Prestatie :
    • De instellingen voor langzaam vastleggen ( Geavanceerde verfinstrumentatie inschakelen en CSS-selectorstatistieken inschakelen ) worden nu automatisch gewist in de volgende DevTools-sessie.
    • Het tabblad Selectorstatistieken schuift nu niet automatisch naar beneden als u inzoomt op het vlammendiagram en de gegevens veranderen ( 337999939 ).
  • Console : De sneltoets Ctrl + ` sluit nu de console in de lade alleen als deze in focus is ( 40875466 , 328210785 ).
  • Automatisch aanvullen : het parseren van adressen is opgelost ( 335409093 , 335409707 ).
  • Toegankelijkheid : schermlezeraankondigingen voor gelokaliseerde tekenreeksen zijn opgelost ( 324930007 ).

Download de voorbeeldkanalen

Overweeg om Chrome Canary , Dev of Beta te gebruiken als uw standaard ontwikkelingsbrowser. Met deze voorbeeldkanalen krijgt u toegang tot de nieuwste DevTools-functies, kunt u geavanceerde webplatform-API's testen en kunt u problemen op uw site opsporen voordat uw gebruikers dat doen!

Neem contact op met het Chrome DevTools-team

Gebruik de volgende opties om de nieuwe functies, updates of iets anders gerelateerd aan DevTools te bespreken.

Wat is er nieuw in DevTools

Een lijst met alles wat aan bod is gekomen in de serie Wat is er nieuw in DevTools .