O tempo para interação da página (TTI, na sigla em inglês) é uma métrica de laboratório para medir a capacidade de resposta da carga. Ele ajuda a identificar casos em que uma página parece interativa, mas na verdade não é. Uma TTI rápida ajuda a garantir que a página seja usável.
O que é TTI?
A métrica TTI mede o tempo desde o início do carregamento da página até o carregamento dos principais sub-recursos e é capaz de responder de maneira confiável e rápida à entrada do usuário.
Para calcular o TTI com base no rastreamento de desempenho de uma página da Web, siga estas etapas:
- Comece com a Primeira exibição de conteúdo (FCP, na sigla em inglês).
- Procure avançar no tempo por uma janela silenciosa de pelo menos cinco segundos, em que a janela silenciosa é definida como: não há tarefas longas e no máximo duas solicitações GET de rede em andamento.
- Pesquisa para trás a última tarefa longa antes da janela silenciosa, parando na FCP se nenhuma tarefa longa for encontrada.
- O TTI é o horário de término da última tarefa longa antes da janela silenciosa (ou o mesmo valor de FCP, se nenhuma tarefa longa for encontrada).
O diagrama a seguir ajudará a visualizar as etapas acima:
Historicamente, os desenvolvedores têm otimizado páginas para tempos de renderização rápidos, às vezes à custa de TTI.
Técnicas como a renderização pelo servidor (SSR, na sigla em inglês) podem criar cenários em que uma página parece interativa, ou seja, com links e botões visíveis na tela. No entanto, ela não realmente é interativa porque a linha de execução principal está bloqueada ou porque o código JavaScript que controla esses elementos não foi carregado.
Quando os usuários tentam interagir com uma página que parece interativa, mas na verdade não é, eles provavelmente respondem de duas maneiras:
- Na melhor das hipóteses, eles ficarão irritados porque a página demora para responder.
- Na pior das hipóteses, ele vai presumir que a página está corrompida e provavelmente sair. Eles podem até perder a confiança no valor da sua marca.
Para evitar esse problema, faça o possível para minimizar a diferença entre FCP e TTI. Nos casos em que houver uma diferença perceptível, deixe claro por meio de indicadores visuais que os componentes na página ainda não são interativos.
Como medir o TTI
TTI é a métrica mais bem medida no laboratório. A melhor maneira de medir o TTI é executando uma auditoria de desempenho do Lighthouse no seu site. Consulte a documentação do Lighthouse sobre TTI para ver detalhes de uso.
Ferramentas de laboratório
O que é uma boa pontuação de TTI?
Para oferecer uma boa experiência ao usuário, os sites precisam ter um tempo de interação de menos de cinco segundos quando testado em um hardware móvel médio.
Para mais detalhes sobre como a TTI da sua página afeta sua pontuação de desempenho do Lighthouse, consulte Como o Lighthouse determina sua pontuação de TTI.
Como melhorar o TTI
Para saber como melhorar o TTI de um site específico, execute uma auditoria de desempenho do Lighthouse e preste atenção às oportunidades específicas sugeridas pela auditoria.
Para saber como melhorar o TTI em geral (para qualquer site), consulte estes guias de desempenho:
- Minificar JavaScript
- Pré-conectar às origens necessárias
- Pré-carregar solicitações principais
- Reduzir o impacto do código de terceiros
- Minimizar a profundidade crítica da solicitação
- Reduzir o tempo de execução do JavaScript
- Minimizar o trabalho da linha de execução principal
- Reduzir o número de solicitações e o tamanho das transferências