Podsumowanie narzędzi deweloperskich – zmienianie kolejności kart, konsola na 2 i detektory zdarzeń platformy

Zmień kolejność kart DevTools w dowolny sposób; zobacz dokładnie, gdzie zostały powiązane zdarzenia frameworku, i zablokuj żądania sieciowe, aby sprawdzić, które skrypty innych firm spowalniają działanie aplikacji.

Lepsza nawigacja po panelu: konsola na 2. poziomie, możliwość zmiany kolejności kart i przydatne podkreślenia

Po zbadaniu, które obszary DevTools są najczęściej używane, doszliśmy do wniosku, że panel Konsoli pełnoekranowej nie powinien znajdować się na ostatnim miejscu na głównym pasku kart. Panel jest na drugim miejscu i zajmuje drugą kartę. Ma to szczególne znaczenie w przypadku niższej rozdzielczości, gdy nie możemy wyświetlić wszystkich kart jednocześnie.

Ale to rozumiemy. Klasyczne kolejność jest częścią pamięci mięśniowej i przez jakiś czas poczujesz zawroty głowy. A może po prostu nie znosicie konsoli pełnoekranowej? Nie martw się, mamy coś dla Ciebie. Teraz możesz zmienić kolejność kart, przeciągając je, tak jak tutaj:

Zmiany, które wprowadzisz na pasku kart, zostaną zachowane i będą działać zarówno na kartach natywnych, jak i na kartach dostarczanych przez rozszerzenia. W bonusie dodaliśmy płynne, animowane podkreślenia. Bo jesteśmy mili.

Obsługa detektorów zdarzeń platformy

Zdarzenia tworzone przez frameworki JS, takie jak jQuery, czasami sprawiały problemy podczas pracy z Narzędziami deweloperskimi. Dzieje się tak, ponieważ większość frameworków otacza natywne zdarzenia DOM w interfejsie API zdarzeń niestandardowych, więc analiza tego interfejsu nie ujawnia zbyt wielu informacji o tym, co się dzieje:

Detektory frameworka wyłączone

Dzięki nowej opcji „Detektory frameworku” na karcie Detektor zdarzeń DevTools rozpoznaje część owijania platformy i automatycznie ją rozwiązuje. Zdarzenia powiązane z ramami wyglądają i działają dokładnie tak samo jak ich natywne odpowiedniki. Informują, gdzie zostały powiązane:

Detektory frameworka włączone

Najlepsze z reszty

  • Niestandardowe formatery obiektów umożliwiają przetłumaczonemu językowi, takiemu jak CoffeeScript, lepsze formatowanie obiektów w konsoli Narzędzi deweloperskich.
  • Podczas nagrywania na osi czasu wyświetla się nowe, lepiej wyglądające okno, które pozwala na szybkie sprawdzenie stanu, czasu i wykorzystania bufora.

    Wskazówka dotycząca osi czasu.
  • W tym samym duchu panel sieci wyświetla teraz przydatną wskazówkę, gdy jest pusty:

    Wskazówka dotycząca sieci.
  • Teraz możesz filtrować treści mieszane w panelu sieci, korzystając z danych wejściowych filtra i ustawiając je na mixed-content:displayed


Jak zawsze przekazuj nam swoje opinie na Twitterze lub w komentarzach poniżej oraz zgłaszaj błędy na stronie crbug.com/new.

Do zobaczenia w przyszłym miesiącu! Paul Bakaus i zespół Narzędzi deweloperskich