O desempenho é um aspecto fundamental da experiência do usuário. A velocidade de carregamento das páginas e a rapidez com que elas respondem às entradas do usuário podem ter um impacto significativo na percepção das pessoas sobre seu site e podem fazer a diferença entre a permanência ou o abandono do site. Nesta página, você encontra muitas informações sobre vários tópicos de desempenho da Web que vão ajudar a acelerar seu site e manter essa velocidade.
Você é iniciante em performance? Temos um curso abrangente para ajudar você a começar.
Comece a melhorar a performance medindo-a no seu site com o PageSpeed Insights.
Saiba mais sobre as três Core Web Vitals, como elas funcionam e por que são importantes para uma boa experiência do usuário.
Depois de aprender sobre as métricas do Core Web Vitals, esses guias podem ajudar você a entender como otimizar melhor as métricas.
Conheça melhor as Core Web Vitals com uma coleção de guias que analisam as métricas em mais detalhes.
Descubra novos recursos para melhorar a performance que estão disponíveis na linha de base.
Leia sobre como as empresas melhoraram as Core Web Vitals e, como resultado, notaram um aumento nas métricas de negócios.
Saiba como usar o Chrome DevTools para depurar problemas de desempenho no seu site.
CURSO

A performance da Web é uma área de conteúdo complexa e multifacetada, mas não é impossível aprender. Se você não tem experiência com performance, nosso curso vai ajudar você a começar a trabalhar, primeiro apresentando os conceitos básicos de performance, permitindo que você avance para temas mais avançados. Depois de concluir o curso, você poderá aplicar o que aprendeu em pouco tempo.

Não é possível melhorar a performance do seu site sem medir primeiro. O PageSpeed Insights é uma ferramenta que mede o desempenho do seu site usando métricas importantes centradas no usuário e pode ajudar a identificar áreas que podem melhorar o desempenho do site.

As métricas Core Web Vitals são um conjunto de três métricas com foco na experiência do usuário. Elas medem a performance e a usabilidade das páginas, incluindo o tempo de carregamento percebido, a estabilidade visual e a capacidade de resposta à entrada do usuário. Se você ainda não conhece as Core Web Vitals, estes guias vão mostrar como elas funcionam e ter um ponto de partida para otimizá-las.

A LCP é uma métrica que mede o tempo que leva para o maior conteúdo aparecer em uma página. As páginas com LCP baixo indicam aos usuários que a página está carregando rapidamente.
A CLS é uma métrica que mede a estabilidade do layout observando a página para detectar mudanças inesperadas no layout. Páginas com baixo CLS sinalizam para os usuários que o layout de uma página é estável e não muda inesperadamente à medida que eles tentam interagir.
O INP é uma métrica que mede a capacidade de resposta de uma página à entrada do usuário. As páginas com INP baixo indicam aos usuários que uma página responde rapidamente quando eles interagem com ela, fazendo com que seu site pareça mais confiável e agradável de usar.
Cada uma das Core Web Vitals pode ser otimizada para melhorar a experiência do usuário. Cada um desses guias é detalhado e mostra como você pode aplicar técnicas comprovadas para melhorar o desempenho e a confiabilidade do seu site, para que os usuários permaneçam mais engajados e menos propensos a abandonar o site.
Aprenda a otimizar a LCP para que os usuários possam acessar o conteúdo mais importante da página o mais rápido possível.
Aprenda a otimizar a CLS para que os usuários tenham a expectativa de que seu site vai permanecer estável e mais utilizável.
Aprenda a otimizar o INP para que os usuários saibam que o site vai responder rapidamente às interações.
As três métricas Core Web Vitals e como otimizar elas são um ótimo começo, mas há ainda mais tópicos para absorver. Esta coleção de conteúdo ajudará você a entender como medi-los e depurá-los, além de conhecer algumas práticas recomendadas adicionais relacionadas a avisos de cookies, carrosséis e outras questões comuns sobre a interface do usuário.
Melhorar a performance não apenas melhora a experiência do usuário, como também pode ajudar a empresa a crescer. Saiba como essas empresas melhoraram as Core Web Vitals e observaram um aumento nas métricas de negócios.
Saiba como a Disney+ Hotstar aumentou em 100% as visualizações de cards semanais em dispositivos de sala de estar ao reduzir a INP em 61%.
Saiba como a plataforma de gerenciamento de consentimento da PubTech reduziu a INP nos sites dos clientes em até 64% e melhorou a visibilidade dos anúncios em até 1,5%.
Saiba como a Taboola usou a API Long Animation Frames (LoAF) para melhorar a INP em até 36% nos sites dos parceiros editores.

Os indicadores de baseline informam aos desenvolvedores da Web quando os recursos da plataforma da Web podem ser usados com segurança em todos os principais mecanismos de navegador. Confira alguns recursos relacionados à performance da Web que agora estão disponíveis como padrão.

A propriedade CSS content-visibility passou a estar disponível como baseline em setembro de 2024.
O formato de imagem AVIF passou a estar disponível como referência em janeiro de 2024.
O pré-carregamento do módulo se tornou o novo valor de referência disponível em setembro de 2023.
O cabeçalho de resposta HTTP Server-Timing passou a estar disponível como padrão em março de 2023.

O Chrome DevTools é um conjunto de ferramentas para depuração de aplicativos da Web, incluindo ferramentas para ajudar a entender e melhorar o desempenho deles.

O painel "Network" no DevTools mostra todos os recursos que uma página carrega e quanto tempo levou para fazer isso. Saiba como usar esse painel para identificar problemas de desempenho relacionados ao carregamento de recursos.
O painel Performance no DevTools mostra informações extremamente detalhadas sobre o desempenho de uma página durante uma sessão de gravação, incluindo a atividade na linha de execução principal, a atividade da rede e outras ferramentas que podem ajudar a identificar e corrigir problemas de desempenho.
O painel "Memory" mostra quanta memória está sendo usada pelo JavaScript de uma página. Ao aprender a usar esse painel, você pode descobrir e corrigir problemas relacionados à memória causados pelo JavaScript de uma página.