Wykrywanie zacięć w interfejsie

Android renderuje interfejs, generując klatkę z aplikacji i wyświetlając ją na ekranie. Jeśli aplikacja ma problemy z powolnym renderowaniem interfejsu, system musi pomijać klatki. Gdy tak się dzieje, użytkownik widzi na ekranie powtarzające się migotanie, które nazywamy zacięciem.

Zacięcie zwykle występuje z powodu spowolnienia lub blokowania asynchronicznego wywołania w wątku UI (w większości aplikacji jest to wątek główny). Aby zidentyfikować problem, możesz użyć śladów systemowych.

Jeśli używasz Jetpack Compose, najlepszym sposobem na zbadanie wydajności renderowania w śladzie jest włączenie śledzenia kompozycji. Więcej informacji o typowych problemach z wydajnością Compose znajdziesz w artykule Wydajność Jetpack Compose.

W przypadku aplikacji Compose wykonaj czynności opisane w tym przewodniku, gdy potrzebujesz widoku aplikacji na poziomie makro. Wprowadzone tutaj śledzenie systemu pomaga zidentyfikować zacięcia spowodowane problemami na poziomie systemu, które blokują wątek główny, takimi jak intensywne operacje wejścia-wyjścia na dysku, agresywne czyszczenie pamięci lub wąskie gardła renderowania GPU. Jeśli zacięcie występuje tylko w warstwie interfejsu, skorzystaj z przewodnika Jetpack Compose Performance. Ten przewodnik pomoże Ci rozwiązać problemy z wydajnością związane z Compose, takie jak nadmierne ponowne komponowanie, odczytywanie stanu w niewłaściwej fazie lub używanie niestabilnych parametrów.

Wykrywanie zacięć w Androidzie 12 lub nowszym

W przypadku urządzeń z Androidem 12 (poziom interfejsu API 31) lub nowszym przechwycony ślad jest wyświetlany na ścieżce Zacięte klatki w panelu Wyświetlacz w CPU Profilerze.

Aby wykryć zacięcie:

  1. W Android Studio kliknij Widok > Okna narzędzi > Profiler lub na pasku narzędzi kliknij Profil .

    Jeśli pojawi się okno Wybierz docelowe wdrożenie , wybierz urządzenie, na którym chcesz wdrożyć aplikację na potrzeby profilowania. Jeśli urządzenie jest podłączone przez USB, ale nie widzisz go na liście, upewnij się, że masz włączone debugowanie USB.

  2. Kliknij dowolne miejsce na osi czasu CPU , aby otworzyć CPU Profiler.

  3. W menu konfiguracji w CPU Profilerze wybierz Ślad systemowy i kliknij Nagraj. Gdy skończysz korzystać z aplikacji, kliknij Zatrzymaj.

  4. Pod sekcją Wyświetlacz powinna się pojawić ścieżka Zacięte klatki. Domyślnie profiler wyświetla tylko zacięte klatki jako kandydatów do analizy. W każdej zaciętej klatce czerwona część wskazuje czas, o jaki klatka przekroczyła termin renderowania. Zrzut ekranu ścieżki „Klatki z zacięciami”

  5. Gdy znajdziesz zaciętą klatkę, kliknij ją. Opcjonalnie możesz nacisnąć M, aby dostosować powiększenie i skupić się na wybranej klatce. Odpowiednie zdarzenia są wyróżnione w tych wątkach: wątek główny, RenderThread i Zakończenie GPU. Zrzut ekranu programu profilującego wyświetlający klatki z zacięciami i główne wątki

  6. Opcjonalnie możesz wyświetlić wszystkie klatki lub podział czasu renderowania, zaznaczając odpowiednio pola wyboru Wszystkie klatki i Cykl życia. Zrzut ekranu profilera jak powyżej, ale z zaznaczonymi polami wyboru Wszystkie ramki i Cykl życia

Wykrywanie zacięć w Androidzie 11

W przypadku urządzeń z Androidem 11 (poziom interfejsu API 30) przechwycony ślad jest wyświetlany w sekcji Cykl życia klatki w CPU Profilerze.

Sekcja Cykl życia klatki z różnymi ścieżkami

Sekcja Cykl życia klatki zawiera nazwę warstwy i 4 ścieżki. Każda ścieżka reprezentuje jeden etap potoku renderowania klatek. Elementy sekcji Cykl życia klatki są następujące:

  1. Cykl życia klatki (nazwa warstwy): tytuł sekcji zawiera nazwę warstwy w nawiasach. Warstwa to pojedyncza jednostka kompozycji.
  2. Aplikacja: ta ścieżka pokazuje czas od momentu, gdy bufor został wyjęty z kolejki przez aplikację, do momentu, gdy został do niej ponownie dodany. Zwykle odpowiada to zdarzeniom śledzenia w RenderThread.
  3. Czekaj na GPU: ta ścieżka pokazuje, jak długo bufor był własnością GPU. Jest to czas od momentu wysłania bufora do GPU do momentu, gdy GPU zakończy pracę nad buforem. Nie oznacza to, że w tym czasie GPU pracowało tylko nad tym buforem. Szczegółowe informacje o tym, nad czym GPU pracuje w danym czasie, znajdziesz w Android GPU Inspector.
  4. Kompozycja: ta ścieżka pokazuje czas od momentu, gdy SurfaceFlinger przyłączy się do bufora i wyśle go do kompozycji, do momentu, gdy bufor zostanie wysłany na wyświetlacz.
  5. Klatki na wyświetlaczu: ta ścieżka pokazuje, jak długo klatka była wyświetlana na ekranie.

Sekcja Cykl życia klatki pokazuje, jak bufor klatek przemieszcza się między różnymi etapami potoku renderowania. Klatki są oznaczone kolorami według numeru klatki, co ułatwia śledzenie konkretnej klatki.

Android Studio wyświetla też wszystkie klatki w śladzie w formacie tabeli na karcie Wszystkie klatki.

Tabela ze wszystkimi ramkami w śladzie na karcie Wszystkie ramki.

Kolumny Numer klatki, Aplikacja, Czekaj na GPU i Kompozycja reprezentują te same dane co ścieżki w sekcji Cykl życia klatki opisane powyżej. Kolumna Czas trwania klatki reprezentuje czas od początku Aplikacji do początku Klatek na wyświetlaczu. Jest to zasadniczo czas potrzebny na renderowanie klatki od początku do końca.

Aby szybko znaleźć najkrótszą lub najdłuższą klatkę, możesz posortować tabelę klatek według dowolnej kolumny. Tabela obsługuje też elementy sterujące stronicowaniem, które ułatwiają poruszanie się po setkach klatek.

Aby wykryć i zbadać zacięcia w Androidzie 11, wykonaj te czynności:

  1. Posortuj tabelę Wszystkie klatki według kolumny Aplikacja w kolejności malejącej, aby najdłuższe klatki były wyświetlane jako pierwsze.

    Kolumna Aplikacja posortowana w kolejności malejącej

  2. Znajdź najdłuższe klatki i zaznacz wiersz tabeli. Spowoduje to powiększenie wybranej klatki w widoku osi czasu po lewej stronie.

    Widok osi czasu obok tabeli klatek

  3. Poszukaj odpowiednich wątków w sekcjach Cykl życia klatki i Wątki.

    Sekcje Cykl życia ramek i Wątki

Wykrywanie zacięć w Androidzie 10 lub starszym

W przypadku urządzeń z Androidem 10 (poziom interfejsu API 29) lub starszym odpowiednie informacje o potoku graficznym systemu operacyjnego są wyświetlane w jednej sekcji śladu systemowego profilera procesora o nazwie Wyświetlacz.

Okno interfejsu wyświetlacza

  • Klatki: ta sekcja pokazuje zdarzenia śledzenia wątku UI i RenderThread zdarzenia śledzenia w aplikacji. Zdarzenia trwające dłużej niż 16 ms są oznaczone kolorem czerwonym, aby wyróżnić potencjalne zacięte klatki, ponieważ przekraczają one limit czasu renderowania przy 60 klatkach na sekundę (fps).
  • SurfaceFlinger: ta sekcja pokazuje, kiedy SurfaceFlinger przetwarza bufory klatek. SurfaceFlinger to proces systemowy odpowiedzialny za wysyłanie buforów na wyświetlacz.
  • VSYNC: ta sekcja wyświetla VSYNC, czyli sygnał synchronizujący potok wyświetlania. Ścieżka wyświetla sygnał VSYNC-app, który pokazuje, kiedy aplikacja zaczyna działać zbyt późno. Zwykle dzieje się tak, ponieważ wątek UI jest zajęty. Powoduje to widoczne migotanie na ekranie podczas animacji i zwiększa opóźnienie wejścia, dopóki animacja lub przewijanie się nie skończy. Jest to szczególnie ważne w przypadku wyświetlaczy o wysokiej częstotliwości odświeżania, ponieważ mogą one występować częściej niż 60 razy na sekundę lub z różną częstotliwością.
  • BufferQueue: ta sekcja pokazuje, ile buforów klatek jest w kolejce i czeka na przetworzenie przez SurfaceFlinger. W przypadku aplikacji wdrożonych na urządzeniach z Androidem 9 (poziom interfejsu API 28) lub nowszym ta ścieżka pokazuje liczbę buforów w kolejce BufferQueue powierzchni aplikacji (0, 1, lub 2). BufferQueue może pomóc Ci zrozumieć stan buforów obrazów, gdy przemieszczają się między komponentami graficznymi Androida. Na przykład wartość 2 oznacza, że aplikacja używa obecnie potrójnego buforowania, co powoduje dodatkowe opóźnienie wejścia.

Sekcja Wyświetlacz zawiera przydatne sygnały do wykrywania potencjalnych zacięć, np. gdy wątek UI lub RenderThread trwa dłużej niż 16 ms. Aby sprawdzić dokładne szczegóły przyczyny zacięcia, możesz zbadać sekcję Wątki, która pokazuje wątki związane z renderowaniem interfejsu.

Sekcja Wątki w obszarze Wyświetlacz

Na ilustracji powyżej sekcja Wątki pokazuje wątek UI (java.com.google.samples.apps.iosched), RenderThread i wątek GPU completion. Są to wątki związane z renderowaniem interfejsu, które mogą przyczyniać się do zacięć.

Aby wykryć zacięcia w Androidzie 10 lub starszym, wykonaj te czynności:

  1. Spójrz na ścieżkę Klatki w sekcji Wyświetlacz. Czerwone klatki są kandydatami do analizy.

    Sekcja Ramki w obszarze Wyświetlacz

  2. Gdy znajdziesz potencjalnie zaciętą klatkę, powiększ ją, naciskając W lub przewijając kółko myszy przytrzymując Control (Command w systemie macOS). Powiększaj, aż zaczniesz widzieć zdarzenia śledzenia w wątku UI i RenderThread.

    Śledzenie zdarzeń w wątku UI i wątku renderowania

    Na ilustracji powyżej Choreographer#doFrame pokazuje, kiedy wątek UI wywołuje Choreographer w celu koordynowania animacji, układu widoku, rysowania obrazu, i powiązanych procesów. DrawFrames pokazuje, kiedy RenderThread tworzy i wysyła do GPU rzeczywiste polecenia rysowania.

  3. Jeśli w wątku głównym widzisz szczególnie długie zdarzenie śledzenia, powiększ je, aby zobaczyć, który komponent interfejsu lub funkcja typu „composable” opóźnia klatkę.

Zaawansowana analiza za pomocą Perfetto

Zadanie profilowania śladu systemowego w Android Studio jest obsługiwane przez Perfetto. Jeśli masz do czynienia ze złożonymi problemami z renderowaniem i potrzebujesz niestandardowych zapytań SQL lub zaawansowanej nawigacji po osi czasu, możesz przeprowadzić analizę śladu poza IDE.

Wyeksportuj ślad systemowy z Android Studio, klikając ikonę Eksportuj ślad w panelu Profiler, a następnie przeciągnij powstały plik do internetowego interfejsu Perfetto. Zapewnia to dedykowane środowisko do analizy wydajności na poziomie systemu. Informacje o tym, jak interpretować szczegóły potoku graficznego systemu operacyjnego, takie jak VSYNC, SurfaceFlinger i ścieżki osi czasu klatek , znajdziesz w oficjalnej dokumentacji Perfetto.

Więcej informacji

Więcej informacji o tym, jak zmniejszyć zacięcia, znajdziesz w artykule Typowe przyczyny zacięć.