Nowości w Narzędziach deweloperskich w Chrome 126

Sofia Emelianova
Sofia Emelianova
GitHub

Ulepszenia panelu wydajności

W tej wersji wprowadziliśmy kilka ulepszeń w panelu Skuteczność.

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. Usunęliśmy przycisk edycji, który wymagał więcej miejsca.

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

Tryb konfiguracji ścieżki pozwala zmieniać kolejność ścieżek i je ukrywać. Kliknij w górę lub w dół, aby przenieść ścieżkę, lub kliknij , aby 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.

Ignoruj skrypty na wykresie płomieniowym

Wykres płomieniowy na ścieżce głównej umożliwia obsługę list ignorowanych. Możesz teraz kliknąć prawym przyciskiem myszy skrypt na wykresie i wybrać Dodaj skrypt do listy ignorowanych.

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 je do niestandardowych reguł wykluczania w Ustawienia > Lista ignorowanych. Ignorowane skrypty są zapisywane, dopóki nie usuniesz ich ze śledzenia lub z niestandardowych reguł wykluczania.

Problem z Chromium: 336266714.

Ogranicz wykorzystanie procesora 20-krotnie

W menu ograniczania CPU w Ustawieniach przechwytywania w panelu Wydajność pojawi się nowa opcja 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.

Panel ze statystykami wydajności zostanie wycofany

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

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

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

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

Aby zastąpić ciągi znaków w nagłówku, 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 w miejscu : podzielą ciąg znaków 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 z nieobsługiwanymi znakami.

Dodatkowo opcje menu i przycisk Edytuj są wyłączone w przypadku adresów URL typu chrome://, co odpowiada zamierzonemu działaniu.

Problemy z Chromium: 330967147, 337012362, 328210785.

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

Zrzuty stosu w panelu Pamięć mają nowe filtry pomagające wykrywać typowe przypadki niewydajnego wykorzystania pamięci, takie jak zduplikowane ciągi znaków, obiekty przechowywane w odłączonych węzłach DOM czy konsoli Narzędzi deweloperskich.

Dodano opcje filtra „przed” i „po” odnoszące się do typowych przypadków niewydajnego wykorzystania pamięci.

Problem z Chromium: 337094903.

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

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

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

Problem z Chromium: 338094915.

Wyłączanie ostrzeżeń dotyczących XSS-a za pomocą flagi wiersza poleceń

Jeśli automatyzujesz korzystanie z Chrome lub w inny sposób otworzysz Narzędzia deweloperskie z poziomu wiersza poleceń na potrzeby debugowania, często warto wyłączyć ostrzeżenie o 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 szereg zmian, takich jak usunięcie kategorii PWA, reorganizacja kategorii SEO, wycofanie ogólnych oszczędności, nowe kontrole i zmiany w kontroli. Zobacz pełną listę zmian.

Podstawowe informacje na temat korzystania z panelu Lighthouse w Narzędziach deweloperskich znajdziesz w artykule Lighthouse: optymalizacja szybkości witryny.

Problem z Chromium: 772558.

Różne wyróżnienia

Oto kilka ważnych 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łomienisty i zmieniają się dane (337999939).
  • Konsola: skrót Ctrl + ` zamyka teraz Konsolę w szufladzie tylko wtedy, gdy jest ona aktywna (40875466, 328210785).
  • Autouzupełnianie: poprawiono parsowanie adresów (335409093, 335409707).
  • Ułatwienia dostępu: komunikaty czytnika ekranu w przypadku zlokalizowanych ciągów są poprawione (324930007).

Pobierz kanały podglądu

Rozważ użycie przeglądarki Chrome Canary, Dev lub Beta jako domyślnej przeglądarki deweloperskiej. Te kanały wersji testowej dają dostęp do najnowszych funkcji Narzędzi deweloperskich, umożliwiają testowanie najnowocześniejszych interfejsów API platform internetowych i pomagają w wykrywaniu problemów w witrynie przed użytkownikami.

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

Użyj poniższych opcji, aby omówić nowe funkcje, aktualizacje lub inne informacje związane z Narzędziami deweloperskimi.

Co nowego w Narzędziach deweloperskich

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