Rysuję niektóre kształty (łuk, lineTo itp.) Do używania requestAnimationFrame
. Nic nadzwyczajnego, ale zauważam sporadyczne drgawki. Profilowałem przy użyciu inspektora osi czasu w narzędziach do Chrome Chrome i widzę dużą ilość czasu bezczynności na klatkę, z których niektóre obniżają FPS poniżej 60 (patrz zrzut ekranu). Czy istnieje znana przyczyna lub rozwiązanie tego problemu?Duże "bezczynne" paski w narzędziach uruchomieniowych Chrome Ramki osi czasu
12
A
Odpowiedz
4
Rysowanie kształtów na płótnie jest prawdopodobnie kosztowne pod względem obliczeniowym i musi podlegać "działaniu, które nie zostało zaprojektowane przez DevTools". Rozwiązałem problem z wydajnością, najpierw rysując kształty w buforze podręcznym poza ekranem, a następnie używając drawImage
, aby skopiować z powrotem do płótna głównego.
1
porównanie tych pików z wykresu pamięci. Z mojego doświadczenia wynika, że duże okresy spoczynku wydają się zbieżne ze zbieraniem śmieci.
Powiązane problemy
- 1. Nie można ustawić punktów przerwania w narzędziach uruchomieniowych Chrome, wersja 26.0.1410.64 m
- 2. Nieparzysty wynik konsoli w Chrome, liczby ujemne w narzędziach deweloperskich pamięci na osi czasu, błąd przeglądarki Chrome?
- 3. Narzędzia dla programistów Chrome brakuje widoków osi czasu
- 4. Emuluj starszą wersję chrome w narzędziach programistycznych
- 5. Jak utworzyć element w Narzędziach deweloperskich Chrome?
- 6. Obraz Czas dekodowania z narzędzia dewelopera na osi czasu Chrome
- 7. d3js set tickValues dla osi czasu osi
- 8. C# Kontrolka osi czasu
- 9. Wyłącz automatyczne zapisywanie zmian CSS w Narzędziach dla programistów Chrome
- 10. Ikony w menu znikają w narzędziach Google Chrome po aktualizacji
- 11. Najlepsza technika dla osi czasu
- 12. Przerwa po zmianie stylu w Narzędziach deweloperskich Chrome
- 13. Wyświetl zawartość odpowiedzi AJAX w narzędziach dla programistów Chrome?
- 14. Jak przeszukiwać zmienne zasięgu w Narzędziach Google Chrome dla programistów?
- 15. Pomiń wiersz podczas debugowania w narzędziach dla programistów Chrome
- 16. Zmiana plików JavaScript w Narzędziach programistycznych Google Chrome
- 17. "Skopiuj lokalizację z parametrami" w Narzędziach dla programistów Google Chrome?
- 18. Co jest odpowiednikiem karty DOM Firebug w narzędziach Chrome Dev?
- 19. Google Chrome copy Ścieżka CSS w Narzędziach dla programistów
- 20. Nie można edytować JavaScript w Narzędziach dla programistów Chrome
- 21. Pliki JavaScript nie pojawiają się w narzędziach dla programistów Chrome
- 22. zignorować konkretne pliki js w narzędziach narzędziowych Chrome podczas debugowania
- 23. Zachowaj podświetlanie elementu DOM w narzędziach Chrome/Firebug
- 24. Jak wyświetlać ruch z określonej domeny w Narzędziach deweloperskich Chrome
- 25. d3.js - wyświetla duże liczby na osi w skróconej formie
- 26. przesuwne okno średnia w całej osi czasu
- 27. Zatrzymaj pokaz slajdów jQuery, aby można było kierować element węzła w narzędziach do Chrome Chrome.
- 28. Pobieranie zestawów uruchomieniowych w Silverlight 3
- 29. d3 + crossfilter: osi czasu renderuje pikselowe pręty
- 30. Chrome DevTools: Trójkątna ikona ostrzegawcza na widoku osi czasu, co to jest?
Podobne pytania: [jeden] (http://stackoverflow.com/questions/12302286/what-causes-chrome-timeline-frame-to-have-so-much-empty-white-space?rq=1) , [dwa] (http://stackoverflow.com/questions/11423330/web-inspector-profiling-withframe-finding-the-foruse-forformance-problems), [three] (http: // stackoverflow.com/questions/18257206/extra-render-time-in-chrome-dev-tools-timeline-frames). Brak przydatnych informacji. Kilka odwołań do [tego posta G + autorstwa Nat Duca] (https://plus.google.com/+NatDuca/posts/BvMgvdnBvaQ?e=-RedirectToSandbox), ale nie robię nic z transformacjami 3D, więc nie mogę Myślę, że to ma zastosowanie. – endemic
Z [Dokumentacja DevTools] (https://developers.google.com/chrome-developer-tools/docs/timeline#frames_mode): "Możesz zauważyć obszary ramki, które są jasnoszare lub przezroczyste (puste w środku). regiony wskazują odpowiednio: 1.) Aktywność, która nie była oprzyrządowana przez program DevTools 2.) Czas bezczynności między cyklami odświeżania wyświetlacza Ramki w poniższym nagraniu pokazują zarówno aktywność bez narzędzi, jak i czas bezczynności. " Jednak to naprawdę nie wyjaśnia, jak rozwiązać problem. Jeśli klarowna część klatki jest bezczynna, dlaczego powoduje pomijanie klatek? – endemic
Mam ten sam problem; ramki kończą się na około 3 ms, ale z szalonymi czasami bezczynności, czasami 200 ms; co daje? zepsute narzędzia programistyczne? – AlexG