60 QPS de layout e renderização
Mantenha tudo organizado com as coleções
Salve e categorize o conteúdo com base nas suas preferências.
Atingir 60 fps nos seus projetos se correlaciona diretamente com o engajamento do usuário e é crucial para o sucesso. Nesta palestra, Nat e Tom falaram sobre o pipeline de renderização do Chrome, algumas causas comuns para a queda de frames e como evitá-los.
Apresentações
- Um frame tem 16 ms. Ele contém JavaScript, cálculos de estilo, pintura e composição.
- A pintura é extremamente cara. Em uma Tempestade de tinta, é necessário repetir o trabalho de pintura desnecessariamente.
- As camadas são usadas para armazenar em cache elementos pintados.
- Os gerenciadores de entrada (listeners de toque e mousewheel) podem eliminar a capacidade de resposta. Evite-os se puder. Quando não for possível reduzi-los.
Exceto em caso de indicação contrária, o conteúdo desta página é licenciado de acordo com a Licença de atribuição 4.0 do Creative Commons, e as amostras de código são licenciadas de acordo com a Licença Apache 2.0. Para mais detalhes, consulte as políticas do site do Google Developers. Java é uma marca registrada da Oracle e/ou afiliadas.
Última atualização 2025-07-25 UTC.
[[["Fácil de entender","easyToUnderstand","thumb-up"],["Meu problema foi resolvido","solvedMyProblem","thumb-up"],["Outro","otherUp","thumb-up"]],[["Não contém as informações de que eu preciso","missingTheInformationINeed","thumb-down"],["Muito complicado / etapas demais","tooComplicatedTooManySteps","thumb-down"],["Desatualizado","outOfDate","thumb-down"],["Problema na tradução","translationIssue","thumb-down"],["Problema com as amostras / o código","samplesCodeIssue","thumb-down"],["Outro","otherDown","thumb-down"]],["Última atualização 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"]]
