Google przebudowuje Dart DevTools od podstaw w Flutter

Trzepotanie jest wieloplatformowy framework programowania, którego celem jest rozwiązanie problemów związanych z tworzeniem aplikacji wieloplatformowych bez bałaganu związanego z nienatywnym kodem. Dzięki znajomości języka programowania Dart programista może tworzyć aplikacje na Androida, iOS, internetowe i stacjonarne z ujednoliconym interfejsem użytkownika. Trzepotanie 1.9 wprowadził obsługę macOS i Cataliny w stanie alfa, podczas gdy W wersji 1.12 wsparcie przekroczyło stan przedalfa i v1.17 Fluttera i v2.8 Darta wydali pierwsze stabilne wydania w 2020 roku. Dzisiaj Google udostępnia nową wersję DevTools dla kodu Dart i Flutter, która została przebudowana od podstaw w Flutter i zawiera kilka ulepszeń.

W poprzednim ogłoszeniu Google wspomniał o zamiarze zamiany aktualnej wersji Dart DevTools na nową wersję Flutter. Stało się to teraz, gdy nowe DevTools zostało przebudowane od podstaw we Flutter. Ta nowa wersja DevTools dodaje ulepszenia, takie jak zmiany na stronach wydajności i pamięci, a także zupełnie nową stronę sieciową.

Ale po co odbudowywać coś, skoro nadal działa? Zespół stojący za Flutterem twierdzi, że korzyści związane z produktywnością są ważne przy budowaniu wysokiej wydajności interfejsów użytkownika, a najlepszym sposobem wykazania zaufania do tych twierdzeń jest przyjęcie tych samych narzędzi sobie. Przebudowa w Flutter umożliwia także programistom wybranie modelu dystrybucji po napisaniu kodu, który stanowi odejście od obecnego schematu podejmowania decyzji, w którym narzucałby model dystrybucji kod.

DevTools jest dostarczany jako aplikacja internetowa, która ułatwia integrację narzędzia z istniejącym doświadczeniem narzędziowym we wszystkich platformy docelowe i IDE. DevTools to samodzielny zestaw narzędzi, który działa w przeglądarce i działa z aplikacjami mobilnymi, komputerowymi i internetowymi. aplikacje.

DevTools zawiera następujące funkcje:

• Inspektor Flutter: narzędzie do wizualizacji i eksploracji drzew widżetów. Możesz wybierać widżety w uruchomionej aplikacji, spowalniać wszystkie animacje, wyświetlać linie bazowe tekstu i nie tylko.
  • Jedną z nowych funkcji jest Eksplorator układu, który można znaleźć w zakładce Flutter Inspector obok Drzewa szczegółów. Eksplorator układu pozwala sprawdzić model układu elastycznego Fluttera. Zespół podaje przykład tego, jak to narzędzie może pomóc na przykład w debugowaniu, dlaczego rząd widżetów nie wygląda tak, jak oczekiwał programista.

• Widok osi czasu: pokazuje czas kompilacji dla każdej klatki i wykres płomienia. Ułatwia to identyfikację problematycznych ramek w kontekście.
  • To okienko zawiera teraz nowy przycisk Śledź kompilacje widżetów, który dodaje czasy kompilacji wszystkich widżetów aplikację na oś czasu (kosztem wydajności kompilacji profilu — więc nie jest ona włączona domyślny). Jest to przydatne, gdy chcesz dowiedzieć się, które dokładnie widżety znajdują się za wolną klatką.

• Widok pamięciowy: pokazuje, jak Twoja aplikacja wykorzystuje pamięć w danym momencie.
  • Ten widok pokazuje teraz mapę cieplną przydzielonej pamięci i umożliwia także śledzenie pamięci platformy.

• Widok wydajności: Jest to tradycyjny profiler procesora. Umożliwia nagranie sesji aplikacji i sprawdzenie, w jakich funkcjach procesor spędza najwięcej czasu. Możesz to wykorzystać, aby zdecydować, gdzie spędzić czas na optymalizacji.
• DevTools zawiera nawet własne Debuger. Może to być przydatne, jeśli nie używasz IDE, ale nadal potrzebujesz opcji dodawania punktów przerwania, przeglądania kodu krokowego, podglądania wartości zmiennych i tak dalej.

• Widok sieciowy: to zupełnie nowość.
  • Jak sama nazwa wskazuje, pozwala sprawdzać ruch sieciowy. Możesz zobaczyć całą historię żądań wysłanych przez Twoją aplikację od momentu jej uruchomienia i uzyskać szczegółowe informacje na temat każdego z nich. Dzięki temu nie musisz samodzielnie rejestrować tych zdarzeń podczas próby debugowania problemu z siecią.
  • Karta Sieć aktualnie pokazuje ruch HTTP; przyszłe ulepszenia obejmują pokazywanie ogólny ruch we/wy gniazda.
  • Żądania sieciowe są także wyświetlane w widoku Oś czasu, dzięki czemu można je zobaczyć w kontekście.
• Widok logowania: pokazuje zdarzenia z Twojej aplikacji i frameworka. Dzięki niemu możesz łatwo filtrować wiadomości (na przykład możesz określić „-gc”, aby odfiltrować zdarzenia Garbage Collectora lub „flutter.frame”, aby pokazać tylko zdarzenia ramki). W Dart rejestrowanie wiadomości można ustrukturyzować, a widok Rejestrowanie korzysta z tego.

Aby w pełni wykorzystać DevTools, możesz przeczytać dokumentacja. Jeśli znajdziesz jakieś błędy lub chcesz zagłosować na nowe funkcje, możesz to zrobić na stronie GitHub.