Nowości w Narzędziach deweloperskich (Chrome 61)

Kayce Basques

Nowe funkcje i duże zmiany w Narzędziach deweloperskich w Chrome 61 to między innymi:

• Symulacja ograniczenia przepustowości urządzeń mobilnych. Ustaw jednocześnie ograniczanie wykorzystania procesora i sieci na symulują telefony średniej klasy lub niskiej jakości.
• Wykorzystanie miejsca na dane. Zobacz, ile pamięci używa źródło z podziałem na technologię. (IndexedDB, pamięć podręczna, lokalna, sesja itp.).
• Sygnatury czasowe w pamięci podręcznej. Zobacz, kiedy skrypt service worker zapisał odpowiedź w pamięci podręcznej.
• Włącz FPS Meter w menu poleceń.
• Zmieniaj działanie kółka myszy i trackpada w panelu Wydajność.
• Natywne debugowanie modułów ES6

Zapoznaj się z wersją wideo tych informacji o wersji poniżej lub przeczytaj dalszą część, aby dowiedzieć się więcej.

Symulowanie słabszych i średnich urządzeń mobilnych w trybie urządzenia

Menu Ograniczanie w trybie urządzenia jest teraz domyślnie wyświetlane i pozwala symulować niedrogich lub średniej klasy komórki za pomocą kilku kliknięć.

Rysunek 1. Menu ograniczania

Rysunek 2. Najedź kursorem na menu Ograniczanie lub otwórz menu Ustawienia przechwytywania, aby wyświetlić definicje telefonów średniej klasy i telefonów niskobudżetowych.

Wyświetl wykorzystanie miejsca na dane

Nowa sekcja Użycie na karcie Wyczyść pamięć w panelu Aplikacja pokazuje, ilość miejsca używanego przez źródło, a także maksymalny limit serwera pierwotnego na tym urządzeniu.

Rysunek 3. Sekcja Użycie pokazuje, że https://airhorner.com wykorzystuje 66,9 KB na limit miejsca początkowego wynoszący 15214 MB

Sprawdzanie, kiedy skrypt service worker buforuje odpowiedzi

Nowa kolumna Czas w pamięci podręcznej na karcie Pamięć podręczna pokazuje, kiedy skrypt service worker odpowiedzi.

Rysunek 4. Kolumna Czas w pamięci podręcznej

Włączanie FPS Meter w menu poleceń

FPS Meter możesz teraz włączyć w menu poleceń.

Rysunek 5. włączanie FPS Meter w menu poleceń;

Ustaw działanie kółka myszy, aby powiększać lub przewijać w przypadku nagrań wydajności

Otwórz Ustawienia i określ nowe ustawienie Działanie kółka myszy kółka myszy działają w panelu Wydajność.

na przykład gdy użyjesz kółka myszy w sekcji Głównej nagrania lub przesuniesz palcem 2 palcami na trackpadzie domyślnym zachowaniem jest powiększanie lub pomniejszanie. Po zmianie parametru wybierz Przewiń, ten gest przewija się teraz w górę lub w dół.

Rysunek 6. Ustawienie Działanie kółka myszy na wykresie fleksyjnym.

Obsługa debugowania modułów ES6

Moduły ES6 są dostarczane natywnie w Chrome 61. Niewiele się tu dzieje jeśli chodzi o w Narzędziach deweloperskich, ponieważ debugowanie działa zgodnie z oczekiwaniami. Spróbuj ustawić punkty przerwania w zapoznaj się z implementacją ES6-Module-implementacji ES6-modułu ES6Paul dotyczącego usługi TodoMVC opracowanej przez Paula Irlandzkiego, aby się przekonać.

Pobierz kanały podglądu

Zastanów się, czy nie ustawić Chrome w wersji Canary, Dev lub beta jako domyślnej przeglądarki do programowania. Te kanały wersji testowej dają dostęp do najnowszych funkcji Narzędzi deweloperskich, umożliwiają testowanie najnowocześniejszych interfejsów API platformy internetowej i wykrywanie problemów w witrynie, zanim użytkownicy ją zobaczą.

Kontakt z zespołem ds. Narzędzi deweloperskich w Chrome

Skorzystaj z poniższych opcji, aby porozmawiać o nowych funkcjach i zmianach w poście lub o innych kwestiach związanych z Narzędziami deweloperskimi.

• Prześlij nam sugestię lub opinię na crbug.com.
• Aby zgłosić problem z Narzędziami deweloperskimi, kliknij Więcej opcji   > Pomoc > Zgłoś problemy z Narzędziami deweloperskimi w Narzędziach deweloperskich.
• Opublikuj tweeta na stronie @ChromeDevTools.
• Napisz komentarz w filmach w YouTube o nowościach w Narzędziach deweloperskich lub o filmach w YouTube ze wskazówkami dotyczącymi Narzędzi deweloperskich.

Co nowego w Narzędziach deweloperskich

Lista wszystkich tematów, które zostały omówione w serii Co nowego w Narzędziach deweloperskich.