Nowości w Narzędziach deweloperskich w Chrome 126

Sofia Emelianova
Sofia Emelianova
GitHub

Ulepszenia panelu wydajności

Ta wersja zawiera kilka ulepszeń panelu Wydajność.

Przenoszenie i ukrywanie ścieżek w zaktualizowanym trybie konfiguracji ścieżek

Aby przejść do trybu konfiguracji ścieżki, kliknij prawym przyciskiem myszy nazwę ścieżki i wybierz Skonfiguruj ścieżki. Usunięto przycisk edycji, który wymagał dodatkowej przestrzeni.

Stan przed i po zastąpieniu przycisku Edytuj opcją menu.

Tryb konfiguracji ścieżek umożliwia zmianę kolejności ścieżek i ich ukrycie. Kliknij w górę lub w dół, aby przesunąć ścieżkę, lub kliknij , aby ją ukryć. Aby wyjść z trybu konfiguracji, u dołu kliknij Zakończ konfigurowanie ścieżek. Ta konfiguracja jest zachowywana w przypadku nowych prześledowań, ale nie w przypadku kolejnych sesji DevTools.

Problem z Chromium: 336266699.

Ignorowanie skryptów na wykresie płomienia

Wykres płomienia na ścieżce Główna obsługuje listę ignorowanych. Teraz możesz kliknąć skrypt prawym przyciskiem myszy na wykresie i wybrać Dodaj skrypt do listy ignorowanych skryptów.

Opcja menu umożliwiająca dodanie skryptu do listy ignorowanych fragmentów kodu, skryptów oznaczonych jako ignorowane oraz odpowiednich reguł w Ustawieniach.

Wykres zwija ignorowane skrypty, oznacza je jako Na liście ignorowanych i dodaje do Niestandardowych reguł wykluczenia w  Ustawienia > Lista ignorowanych. Ignorowane skrypty są zapisywane, dopóki nie usuniesz ich z wyszukiwania lub z niestandardowych reguł wykluczenia.

Problem z Chromium: 336266714.

Ogranicz wykorzystanie procesora 20-krotnie

Menu ograniczania szybkości procesora w sekcji Ustawienia nagrywania w panelu Wydajność zawiera teraz nową opcję 20-krotne spowolnienie. Dzięki temu możesz dokładniej odtwarzać i analizować problemy z wydajnością występujące w rzeczywistych warunkach, nawet na komputerach wysokiej klasy.

Zdjęcie przed i po dodaniu opcji „20x slowdonw” do sekcji „Ustawienia rejestrowania”.

Problem z Chromium: 324978881.

Wycofanie panelu Statystyki wydajności

Eksperymentalny panel Statystyki wydajności zostanie wycofany w 2024 r. Zespół Narzędzi deweloperskich pracuje nad zintegrowaniem najbardziej przydatnych funkcji z panelem Wydajność. W panelu Statystyki skuteczności pojawi się teraz u góry baner informujący o nadchodzącym wycofaniu tej funkcji.

Baner ostrzegawczy o wycofaniu w panelu „Statystyki wydajności”.

Więcej informacji znajdziesz w artykule Narzędzia do optymalizacji skuteczności w 2024 roku i później.

Jeśli chcesz podzielić się opinią na temat tego, co działa, a co nie i co można zrobić lepiej, skontaktuj się z nami.

Aby zastąpić ciągi nagłówka, wklej całe ciągi znaków.

Podczas zastępowania nagłówków możesz teraz wkleić cały ciąg nagłówka (HEADER_NAME: VALUE), a Narzędzia deweloperskie podzielą go w miejscu : na nazwę nagłówka i jego wartość.

W tym filmie możesz zobaczyć, jak to działa.

Podczas edytowania nagłówków panel Sieć będzie teraz ostrzegać, jeśli wpiszesz jakiekolwiek znaki inne niż alfanumeryczne, łączniki i znaki podkreślenia.

Ostrzeżenie obok nazwy nagłówka zawierającej nieobsługiwane znaki.

Dodatkowo opcje menu i przyciski Edytuj są wyłączone w przypadku adresów URL chrome://, co jest zgodne z oczekiwanym działaniem.

Problemy z Chromium: 330967147, 337012362, 328210785.

Wykrywanie nadmiernego wykorzystania pamięci za pomocą nowych filtrów w zrzutach sterty

Zrzuty pamięci podręcznej w panelu Pamięć mają teraz nowe filtry, które mogą pomóc w wykrywaniu typowych przypadków nieefektywnego wykorzystania pamięci, takich jak duplikowane ciągi znaków, obiekty zachowane przez odłączone węzły DOM oraz Konsola w Narzędziach deweloperskich.

Opcje filtrowania przed i po dodaniu w przypadku typowych przypadków nieefektywnego wykorzystania pamięci.

Problem z Chromium: 337094903.

Sprawdzanie zasobników pamięci masowej w sekcji Aplikacja > Pamięć

Możesz teraz sprawdzać zbiory danych w specjalnym drzewie w sekcji Aplikacja > Miejsce na dane. To drzewo, które wcześniej było eksperymentalne, zostało włączone domyślnie.

Widok przed i po włączeniu drzewa zasobników na dane w sekcji Miejsce na dane.

Problem z Chromium: 338094915.

Wyłączanie ostrzeżeń o samoistnym XSS za pomocą flagi wiersza poleceń

Jeśli automatyzujesz korzystanie z Chrome lub otwierasz Narzędzia deweloperskie z poziomu wiersza poleceń na potrzeby debugowania, często będziesz musiał wyłączyć ostrzeżenie przed samoistnym XSS, które pojawia się w każdej nowej sesji Narzędzi deweloperskich.

Okno z ostrzeżeniem o samoistnym atakach XSS w Konsoli

Możesz teraz wyłączyć to okno, przekazując do Chrome --unsafely-disable-devtools-self-xss-warnings flagę wiersza poleceń.

Problem z Chromium: 41491762.

Lighthouse 12.0.0

Panel Lighthouse korzysta teraz z wersji Lighthouse 12.0.0.

Ta aktualizacja wprowadza kilka zmian, w tym usunięcie kategorii PWA, reorganizację kategorii SEO, wycofanie ogólnych oszczędności, nowe kontrole i zmiany dotyczące kontroli. Zobacz pełną listę zmian.

Podstawy korzystania z panelu Lighthouse w Narzędziach deweloperskich znajdziesz w artykule Lighthouse: optymalizacja szybkości witryny.

Problem z Chromium: 772558.

Inne najciekawsze momenty

Oto kilka istotnych poprawek i ulepszeń w tej wersji:

  • Skuteczność:
    • Ustawienia powolnego przechwytywania (Włącz zaawansowaną instrumentację renderowania i Włącz statystyki selektora CSS) są teraz automatycznie usuwane w następnej sesji Narzędzi deweloperskich.
    • Karta Statystyki selektora nie przewija się już automatycznie w dół, gdy powiększasz wykres płomienia i zmieniają się dane (337999939).
  • Konsola: skrót Ctrl + ` zamyka teraz Konsolę w szufladzie tylko wtedy, gdy jest ona aktywna (40875466, 328210785).
  • Autouzupełnianie: rozwiązano problem z parsowaniem adresów (335409093, 335409707).
  • Ułatwienia dostępu: naprawiono komunikaty czytnika ekranu dla zlokalizowanych ciągów znaków (324930007).

Pobieranie kanałów podglądu

Rozważ użycie jako domyślnej przeglądarki deweloperskiej wersji Canary, Dev lub Beta przeglądarki Chrome. Te kanały wersji wstępnej zapewniają dostęp do najnowszych funkcji DevTools, umożliwiają testowanie najnowocześniejszych interfejsów API platformy internetowej i pomagają znaleźć problemy w witrynie, zanim zrobią to użytkownicy.

Kontakt z zespołem Narzędzi deweloperskich w Chrome

Aby omówić nowe funkcje, aktualizacje lub inne kwestie związane z Narzędziami deweloperskimi, skorzystaj z tych opcji.

Co nowego w Narzędziach deweloperskich

Lista wszystkich tematów omawianych w cyklu artykułów Co nowego w Narzędziach deweloperskich.