Nowości w DevTools w Chrome 133

Sofia Emelianova
Sofia Emelianova
GitHub

Stała historia czatu z AI

Panel Pomoc AI przechowuje teraz lokalnie historię czatu w różnych sesjach, dzięki czemu możesz wyświetlać poprzednie rozmowy z Gemini nawet po ponownym załadowaniu narzędzi deweloperskich lub Chrome.

Ulepszenia panelu wydajności

Ta wersja wprowadza szereg ulepszeń w panelu Wydajność.

Statystyki dostarczania obrazów

Na karcie Skuteczność > Statystyki możesz teraz wyróżnić obrazy, których rozmiar pliku możesz zoptymalizować. Kliknij obraz w statystykach, aby zobaczyć go podświetlonego na ścieżce Sieć.

Panel Skuteczność z wyróżnionymi statystykami wyświetlania obrazu.

Więcej informacji o optymalizacji dostarczania obrazów znajdziesz w artykule Wydajne kodowanie obrazów.

Klasyczna i nowoczesna nawigacja przy użyciu klawiatury

W panelu Skuteczność możesz teraz wybrać preferowany styl nawigacji za pomocą klawiatury. Główne różnice są następujące:

  • Klasyczny: powiększanie za pomocą kółka myszy (przesuwanie po touchpadzie w górę lub w dół) i przewijanie w pionie za pomocą Shift + kółko myszy.
  • Nowoczesny: przewijanie w pionie za pomocą kółka myszy, przewijanie w poziomie za pomocą Shift + kółko myszy oraz powiększanie za pomocą Command/Control + kółko myszy.

Aby wybrać preferowany styl, w prawym górnym rogu panelu kliknij Pokaż skróty i wybierz Klasyczny lub Nowoczesny. W oknie skrótów znajdziesz też ściągę z dostępnymi skrótami.

Okno skrótów z dostępnymi skrótami dla panelu Wydajność.

Ignorowanie nieistotnych skryptów na wykresie płomieniowym

Aby lepiej skupić się na kodzie, możesz teraz dodawać nieistotne skrypty do listy ignorowanych fragmentów kodu bezpośrednio w panelu Skuteczność. Panel automatycznie zwinie nadmierne zagnieżdżenia.

Aby dodać skrypty do listy ignorowanych, na górnym pasku działań kliknij Pokaż okno ustawień listy ignorowanych fragmentów kodu i w polu wpisywania wpisz wyrażenie regularne. Wykres płomieniowy zastosuje nową regułę podczas pisania.

Narzędzia deweloperskie zapisują dodane reguły listy ignorowania w  Ustawienia > Lista ignorowania. Możesz je włączać i wyłączać w oknie dialogowym.

Wskaźnik osi czasu i wyróżnienie zakresu po najechaniu kursorem

Aby ułatwić Ci zrozumienie śladu skuteczności, panel Skuteczność wykonuje teraz te czynności:

  • Gdy najedziesz kursorem na Oś czasu, pojawi się pionowy znacznik obejmujący cały ślad wydajności.
  • Podświetla zakres na osi czasu, gdy najedziesz kursorem na elementy na ścieżce głównej.

Zalecane ustawienia ograniczania

Panel Skuteczność zawiera teraz zalecenia dotyczące ustawień ograniczania zarówno w przypadku danych na żywo, jak i w odpowiednich menu Ustawienia przechwytywania.

Przed i po dodaniu rekomendacji dotyczących ograniczania przepustowości do menu ustawień.

Zalecane ograniczenie procesora to (na razie) najczęściej używane 4x slowdown, a zalecenia dotyczące sieci są oparte na danych z Raportu na temat użytkowania Chrome, jeśli są włączone w danych na żywo.

Dodatkowo w panelu Skuteczność obok każdego śladu w menu Ostatnie sesje na pasku działań wyświetlane są użyte ustawienia ograniczania przepustowości.

Znaczniki czasu w nakładce

Markery czasu zostały przeniesione ze ścieżki Timings na dół śladu. Są teraz nakładane na wszystkie ścieżki i widoczne nawet wtedy, gdy ścieżka Timings jest ukryta.

Przed i po przeniesieniu markerów na dół ścieżki.

Ścieżka Timings zachowuje niestandardowe wywołania mark() i measure().

Zrzuty stosu wywołań JavaScriptu w sekcji Podsumowanie

Na karcie Skuteczność > Podsumowanie są teraz wyświetlane ślady wywołań JavaScript, w tym wywołań asynchronicznych.

Przed i po dodaniu śladów stosu na karcie Podsumowanie.

Ustawienia plakietki przeniesione do menu w Elementach

Ustawienia plakietki w panelu Elementy zostały przeniesione z domyślnie ukrytego paska działań do odpowiedniego menu kontekstowego.

Przed i po przeniesieniu ustawień plakietki do menu.

Nowy panel „Co nowego”

Panel Co nowego ma nowy wygląd, który jest bardziej zgodny z designem Chrome.

Stary i nowy wygląd panelu „Nowości”.

Problem z Chromium: 325441858.

Lighthouse 12.3.0

Panel Lighthouse działa teraz w wersji 12.3.0.

Ta aktualizacja dodaje m.in. nowe audyty, które sprawdzają prawidłowe izolowanie źródła za pomocą COOP i silną zasadę HSTS. Zobacz pełną listę zmian.

Podstawowe informacje o korzystaniu z panelu Lighthouse w Narzędziach deweloperskich znajdziesz w artykule Lighthouse: optymalizacja szybkości witryny.

Problem w Chromium: 40543651.

Różne wyróżnione informacje

Oto kilka ważnych poprawek i ulepszeń w tej wersji:

  • Źródła: gdy debuger jest wstrzymany, nie przełącza się już nieoczekiwanie na kontekst skryptu service worker, jeśli został utworzony po wstrzymaniu (373893057).
  • Skuteczność:
    • Po najechaniu kursorem na skrypty w wykresie płomieniowym etykietki narzędzi zawierają teraz adresy URL (jeśli są dostępne) (368541957).
    • Podsumowanie: wykres kołowy jest zastępowany wykresem słupkowym.
    • Pole wyboru Dane rozszerzenia w sekcji Ustawienia przechwytywania zostało zmienione na Wyświetlaj ścieżki niestandardowe.
    • Na karcie Statystyki znajduje się teraz sekcja Zatwierdzone statystyki (N), która jest domyślnie zwinięta.
  • Aplikacja > Pamięć: możesz tworzyć wpisy w pamięci z pustymi kluczami, ponieważ są one technicznie prawidłowe (373703285).
  • Tryb urządzenia jest teraz wyłączony na chrome:// stronach (40186276).
  • Sieć:
    • Gdy odpowiednie ustawienie jest włączone, kliknięcie Eksportuj HAR powoduje otwarcie menu z 2 opcjami (po usunięciu danych poufnych i z danymi poufnymi). Wcześniej menu otwierało się po długim kliknięciu (378076279).
    • Skopiuj jako cURL używa teraz atrybutu -b, aby pomijać pliki cookie i być bardziej czytelne, zamiast -H 'cookie:...' (40791742).
  • Ułatwienia dostępu: możesz teraz przesuwać karty w panelach w lewo lub w prawo za pomocą menu kontekstowego (383164782).
  • Blokowanie żądań sieciowych: to ustawienie menu poleceń jest teraz zsynchronizowane z odpowiednim polem wyboru (378058733).

Pobieranie kanałów podglądu

Rozważ używanie Chrome w wersji Canary, deweloperskiej lub beta jako domyślnej przeglądarki do programowania. Te kanały wersji testowych zapewniają dostęp do najnowszych funkcji Narzędzi deweloperskich, umożliwiają testowanie najnowocześniejszych interfejsów API platformy internetowej i pomagają znajdować problemy w witrynie, zanim zrobią to użytkownicy.

Kontakt z zespołem Narzędzi deweloperskich w Chrome

Skorzystaj z tych opcji, aby porozmawiać o nowych funkcjach, aktualizacjach lub innych kwestiach związanych z Narzędziami deweloperskimi.

Co nowego w Narzędziach deweloperskich

Lista wszystkich tematów omówionych w serii Nowości w Narzędziach deweloperskich.