Układ i renderowanie z szybkością 60 kl./s
Zadbaj o dobrą organizację dzięki kolekcji
Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
Osiągnięcie 60 kl./s w projektach ma bezpośredni wpływ na zaangażowanie użytkowników i jest kluczowe dla sukcesu firmy. W tej rozmowie Nat i Tom rozmawiali o procesie renderowania w Chrome, o tym, co jest częstą przyczyną pominięć i jak ich uniknąć.
Prezentacje
- Klatka ma 16 ms. Zawiera kod JavaScript, obliczenia stylu, malowanie i komponowanie.
- Malowanie jest wyjątkowo drogie. Burza w farbie to miejsce, w którym niepotrzebnie powtarzasz drogie farby.
- Warstwy służą do buforowania malowanych elementów.
- Moduły obsługi wprowadzania (dotykowe i detektory myszy) mogą zabijać reakcje. Jeśli to możliwe, unikaj ich. Tam, gdzie nie można ograniczyć ich do minimum.
O ile nie stwierdzono inaczej, treść tej strony jest objęta licencją Creative Commons – uznanie autorstwa 4.0, a fragmenty kodu są dostępne na licencji Apache 2.0. Szczegółowe informacje na ten temat zawierają zasady dotyczące witryny Google Developers. Java jest zastrzeżonym znakiem towarowym firmy Oracle i jej podmiotów stowarzyszonych.
Ostatnia aktualizacja: 2025-07-25 UTC.
[[["Łatwo zrozumieć","easyToUnderstand","thumb-up"],["Rozwiązało to mój problem","solvedMyProblem","thumb-up"],["Inne","otherUp","thumb-up"]],[["Brak potrzebnych mi informacji","missingTheInformationINeed","thumb-down"],["Zbyt skomplikowane / zbyt wiele czynności do wykonania","tooComplicatedTooManySteps","thumb-down"],["Nieaktualne treści","outOfDate","thumb-down"],["Problem z tłumaczeniem","translationIssue","thumb-down"],["Problem z przykładami/kodem","samplesCodeIssue","thumb-down"],["Inne","otherDown","thumb-down"]],["Ostatnia aktualizacja: 2025-07-25 UTC."],[],["Maintaining 60fps is vital for user engagement. The rendering pipeline involves JavaScript, styling, painting, and compositing within a 16ms frame. Painting is resource-intensive, particularly in \"Paint Storms,\" where it's repeatedly done unnecessarily. Layers cache painted elements to reduce this burden. Input handlers, such as touch and mousewheel listeners, can significantly impact responsiveness; thus, their usage should be minimized.\n"]]
