Wykrywanie problemów z wydajnością renderowania

Sofia Emelianova
Sofia Emelianova
Kayce Basques
Kayce Basques

Aby wykrywać problemy z wydajnością renderowania, zapoznaj się z informacjami o opcjach związanych z wydajnością na karcie Renderowanie.

Wyróżnianie obszarów, które zostały ponownie pomalowane, miganiem farby

Gdy ta opcja jest włączona, Chrome wyświetla na ekranie zielone światło, gdy następuje ponowne renderowanie.

Aby wyświetlić obszary, które są ponownie malowane:

  1. Otwórz kartę Renderowanie w tym demo i sprawdź opcję Błyskaniecie.
  2. Zwróć uwagę na przemalowanie zaznaczone na zielono.
Podświetlanie obszarów renderowania

Jeśli na innej stronie widzisz, że cały ekran lub jego fragmenty, które nie powinny być wypełnione kolorem, migają na zielono, rozważ dalsze zbadanie sprawy.

Podświetlanie regionów przesunięcia układu

Przesunięcia układu powodują nieoczekiwane ponowne renderowanie i mogą być nie tylko uciążliwe, ale i szkodliwe.

Screencast pokazujący negatywny wpływ niestabilnego układu na wrażenia użytkowników.

Aby wyświetlić lokalizację i czas zmiany układu na stronie:

  1. Otwórz kartę Renderowanie i zaznacz opcję Regiony przesunięcia układu.

  2. Odśwież stronę. Obszary przesunięcia układu są krótko wyróżnione na fioletowo.

Przesunięcie układu

Wyświetlanie warstw i płytek z obciętymi krawędziami

Użyj opcji Bokiny warstwy, aby wyświetlić nakładkę bokunów warstwypłytek u góry strony.

Aby włączyć obramowania warstw:

  1. Otwórz kartę Wyświetlanie i zaznacz pole Obrzeża warstwy.
  2. Zauważ, że obramowania warstwy są pomarańczowe i oliwkowe, a kafelki – cyjanowe.