6 métricas para avaliar o desempenho do seu site

O trabalho de quem gerencia um site vai além de mantê-lo atualizado. É necessário acompanhar de perto o seu desempenho, para avaliar se ele está atendendo aos objetivos propostos. 

Para isso, existem métricas específicas que você deve analisar e estudar de forma minuciosa. Confira agora 6 métricas que você pode utilizar para avaliar o desempenho do seu site. 

1 - Largest Contentful Paint (LCP)

Medir a velocidade do carregamento de um conteúdo em uma página web e o tempo que ela leva para ficar visível para os usuários é de extrema importância, mas também um desafio para desenvolvedores. 

Nem sempre a métrica mais complexa é a melhor. Uma das maneiras mais precisas de medir o carregamento de um conteúdo de uma página é verificando o momento em que o maior elemento foi renderizado.

A métrica Largest Contentful Paint mostra na janela de visualização (viewport) o tempo de renderização desse elemento maior. 

2 - First Contentful Paint

Essa métrica não diz respeito apenas ao tempo de resposta de um site, mas está centrada na experiência do usuário e no que ele percebe primeiro no site, não no que carrega em segundo plano. 

Ao otimizar a primeira exibição de conteúdo do seu site, além de acelerar o tempo de carregamento,você aumenta a classificação de velocidade da página, e mostra aos visitantes que suas solicitações estão sendo tratadas e que o carregamento não parou. 

A First Contentful Paint do seu site é quando o navegador renderiza o primeiro elemento DOM em sua página, o que inclui imagens, elementos de tela (não brancos) ou bloco de texto. 

Explicando de maneira mais simples, é quando o usuário pode ver alguma parte da página mudar e muitas vezes isso vem como uma barra de cabeçalho ou imagem de fundo. Esse elemento pode não ser a primeira coisa renderizada, mas será a primeira que o usuário poderá ver, tornando-o primordial para o UX do seu site. 

3 - Time to Interactive

Essa é uma métrica de desempenho que mede a capacidade de resposta e carregamento do seu site. Ela auxilia a identificar quando uma página parece interativa, mas na verdade não é. Um TTI rápido ajuda a garantir que a página seja utilizável. 

Essa métrica é importante porque é centrada no usuário e mede a rapidez com que os visitantes conseguem interagir totalmente com sua página. Para os visitantes de um site, um TTI lento pode dar a impressão de que o site não responde, está quebrado ou não funciona. 

4 - Speed Index

Essa métrica afere a rapidez com que o conteúdo é exibido durante o carregamento da página. Depende do tamanho da porta de visualização do navegador e não é um marco na linha do tempo de carregamento de sua página, o que o difere de outras métricas como First Contentful Paint (FCP) ou Largest Contentful Paint (LCP).  

Ele representa o resultado de um cálculo que reflete a experiência da página do seu visitante utilizando uma análise quadro a quadro do comportamento de carregamento da página. 

O Speed Index está muito ligado a outros tempos de carregamento de página, o que o torna uma referência geral útil para avaliar o desempenho do seu site em sua totalidade. 

5 - Total Blocking Time

Total Blocking Time é uma das métricas de desempenho do Lighthouse e foi introduzida em 2020. Ela quantifica a capacidade de resposta de carregamento da sua página à entrada do usuário. Em outras palavras, mede o tempo total de bloqueio da sua página web, impedindo que o usuário interaja com ela. 

O navegador usa o que é chamado de thread principal para analisar HTML, construir DOM, executar CSS e JavaScript, processar eventos de usuário e realizar outras tarefas importantes.

Quando qualquer uma dessas tarefas é executada por mais de 50 ms, o encadeamento principal é considerado "bloqueado" porque o navegador não pode interromper uma tarefa em andamento.

Se o thread principal estiver bloqueado, sua página não poderá responder às entradas do usuário, como toques na tela, pressionamentos de teclas ou cliques do mouse. O tempo excedente além de 50 ms é considerado o tempo de bloqueio individual para aquela solicitação.

A soma de todos esses tempos de bloqueio é o Total Blocking Time da sua página. 

6 - Cumulative Layout Shift

Também introduzida em 2020 pelo Lighthouse, Cumulative Layout Shift mensura a mudança inesperada de elementos da web enquanto a página está sendo renderizada. Isso é quantificado como uma pontuação agregada de todas as mudanças de layout individuais em sua página. É uma das métricas que compõem o Web Vitals, do Google.

Um site com CLS baixo tem uma exibição de página estável, que não altera os elementos e garante um carregamento consistente e previsível de todo o conteúdo do site. 

Caso contrário, quando uma página é carregada, determinados elementos mudam inesperadamente, o que afeta a interação do usuário. Esses elementos podem ser botões, imagens, vídeos, formulários de contato ou outros. 

Google PageSpeed Insights

Além das 6 métricas que listamos acima, o Google PageSpeed Insights também ajuda bastante na análise e no direcionamento das otimizações necessárias. Ele classifica a velocidade do site com uma pontuação que varia entre 1 e 100. Quanto maior, e a partir de 80 pontos, de acordo com os critérios do Google, é considerada uma nota boa.   

Portanto, fica claro o quanto é importante analisar o seu site e acompanhar estas métricas periodicamente, para garantir a melhor experiência do visitante da sua página.