Otimizando a pintura do navegador: Guia de desempenho do JavaScript

Páginas lentas frustram os usuários e prejudicam o engajamento, mas o gargalo geralmente não é a rede, mas a forma como o navegador renderiza os pixels. Entender o caminho crítico de renderização é essencial para criar aplicativos web modernos e de alto desempenho. Neste curso baseado em texto, você aprenderá a identificar, analisar e eliminar gargalos de renderização. Você fará a transição de escrever código que simplesmente funciona para criar JavaScript e CSS altamente otimizados que minimizam as repinturas, evitam refluxos desnecessários e garantem interações suaves com o usuário. O que você vai aprender: - Entenda o caminho de renderização crítico do navegador, do DOM e CSSOM à árvore de layout e camadas de tinta. - Analise como a execução do JavaScript e as alterações no CSS acionam refluxos e repinturas dispendiosos. - Pratique identificar gargalos de desempenho usando ferramentas de desenvolvedor de navegador e perfis de desempenhamento. - Aplique propriedades CSS como contenção e transformação para descarregar o trabalho do thread principal. - Otimize animações e transições para rodar sem problemas em sessenta quadros por segundo. - Implemente estratégias de renderização modernas para melhorar os Core Web Vitals e a experiência geral do usuário. O curso começa com a arquitetura do navegador fundamental e a terminologia de renderização antes de passar para técnicas de otimização práticas e práticas de criação de perfis. Você lerá explicações claras, analisará exemplos de código e completará exercícios escritos para reforçar seu aprendizado. Este curso é projetado para iniciantes e intermediários desenvolvedores front-end que querem aprofundar sua compreensão dos internos do navegador; nenhuma experiência prévia de otimização de desempenho é necessária. Comece a dominar o desempenho de renderização do navegador hoje mesmo e ofereça experiências web ultrarrápidas.