Wat is er nieuw in DevTools (Chrome 61)

Kayce Basken

Nieuwe functies en grote veranderingen voor DevTools in Chrome 61 zijn onder meer:

Bekijk de videoversie van deze releaseopmerkingen hieronder of lees verder voor meer informatie.

Simuleer low-end en mid-tier mobiele apparaten in de apparaatmodus

Het Device Mode Throttling -menu is nu standaard zichtbaar en laat je nu met een paar klikken een low-end of mid-tier mobiel apparaat simuleren.

Het throttling-menu

Figuur 1 . Het throttling-menu

Definities van het Throttling-menu

Figuur 2 . Beweeg de muis over het Throttling -menu of open het menu Capture-instellingen om de definities voor mid-tier mobiel en low-end mobiel te bekijken

Opslaggebruik bekijken

In de nieuwe sectie Gebruik op het tabblad Opslag wissen van het paneel Applicaties kunt u zien hoeveel opslagruimte een oorsprong gebruikt, evenals het maximale quotum voor de oorsprong op dit apparaat.

Het gedeelte Gebruik

Figuur 3 . Uit het gedeelte Gebruik blijkt dat https://airhorner.com 66,9 KB gebruikt van het oorspronkelijke quotum van 15214 MB

Bekijk wanneer een servicemedewerker antwoorden in de cache heeft opgeslagen

In de nieuwe kolom Tijd in cache op het tabblad Cache-opslag kunt u zien wanneer een servicemedewerker antwoorden in de cache heeft opgeslagen.

De kolom Tijd in cache

Figuur 4 . De kolom Tijd in cache

Schakel de FPS-meter in vanuit het Commandomenu

U kunt nu de FPS-meter inschakelen via het Commandomenu .

De FPS-meter inschakelen via het Commandomenu

Figuur 5 . De FPS-meter inschakelen via het Commandomenu

Stel het muiswielgedrag in om te zoomen of te scrollen met prestatie-opnamen

Open Instellingen en stel de nieuwe Flamechart-muiswielactie- instelling in om te wijzigen hoe muiswielen zich gedragen in het paneel Prestaties .

Wanneer u bijvoorbeeld een muiswiel gebruikt in het hoofdgedeelte van een opname, of wanneer u met twee vingers over een trackpad veegt, is het standaardgedrag in- of uitzoomen. Wanneer u de instelling wijzigt in Scrollen , scrolt dit gebaar nu omhoog of omlaag.

De instelling 'Flamechart muiswielactie'

Figuur 6 . De actie-instelling van het Flamechart-muiswiel

Ondersteuning voor foutopsporing voor ES6-modules

ES6-modules worden standaard geleverd in Chrome 61. Er gebeurt hier niet veel met betrekking tot DevTools, behalve dat foutopsporing werkt zoals je zou verwachten. Probeer een aantal breekpunten in te stellen en door Paul Irish's ES6-Module-implementatie van TodoMVC te stappen om het zelf te zien.

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 .