CLS de 0,4 para 0,06 em um fluxo de reserva de viagens
Os layout shifts estavam no fluxo de reservas, e a maioria acontecia depois do primeiro carregamento da página.
Uma single page application com layout shifts no fluxo de reservas
O Prijsvrij é um site holandês de viagens: buscar, comparar e reservar férias. Todo o site é uma single page application, e a mesma equipe opera o Prijsvrij.be e o D-reizen.
Passei dois dias de 4 horas no escritório deles. No primeiro dia, fiz a auditoria do site. No segundo, revisei os resultados com a equipe e expliquei, passo a passo, como corrigir primeiro os problemas mais urgentes.
A primeira tela, o fluxo de reservas e os cliques
A maioria dos layout shifts acontecia em soft navigations: o app troca o conteúdo sem carregar uma nova página. Um teste do Lighthouse na homepage nunca vê isso. Visitantes reais clicando pelas etapas da reserva veem, e o CrUX contabiliza esses layout shifts na URL que abriram primeiro.
Entreguei a auditoria no fim de março de 2026 e passei pelos pontos com os desenvolvedores em Den Bosch no dia 15 de abril, e online uma semana depois. O CLS foi a parte difícil, com mais causas do que o normal em um setup como esse. Os desenvolvedores corrigiram tudo nos três sites e, em maio, o CLS de desktop ficou verde em todos eles.
Em uma manhã de junho, o líder de front-end deles me mandou um e-mail. Ele tinha passado as últimas semanas fazendo ajustes no prijsvrij.nl com base nos dados do CoreDash pela conexão com o Claude Code, e os gráficos estavam indo na direção certa. Daria para incluir o D-reizen também? Em menos de uma hora, o D-reizen e o Prijsvrij.be já estavam no CoreDash.
O próximo é o INP. Quando analisei os dados no fim de junho, reconheci o padrão: já vi isso muitas vezes, e um plano passo a passo comprovado resolve, desde que cada etapa seja feita exatamente da forma certa. Isso cuida da maior parte. Só aí os problemas que estavam por baixo aparecem, e esses são sempre menores. Por isso sugeri um trabalho mais prático: mudanças pequenas e cirúrgicas, menos teoria e mais execução. Em julho nos reunimos no escritório deles, com almoço incluído, e continuamos nos encontrando a cada trimestre.
O LCP no celular sobe no período de férias, quando boa parte do tráfego vem de pessoas que também estão de férias. Ele continua bem abaixo de 2,5 segundos e já está caindo de novo.
Uma animação de carregamento só muda o layout shift de lugar
A animação parecia cobrir a espera. O layout shift acontecia no momento em que ela dava lugar aos detalhes do voo.
Tracking no clique custa a cada clique
Uma tag no click handler roda antes que a tela consiga mudar. Movida para depois da atualização, o visitante vê o resultado primeiro e a tag roda do mesmo jeito.
Uma single page application está sempre mudando
Cada release adiciona componentes e tags que a checagem anterior nunca viu. É por isso que volto a cada trimestre.
Layout shifts em uma single page app que o Lighthouse nunca vê?
Envie a URL do fluxo de reserva ou checkout e eu navego por ele como um visitante, incluindo as soft navigations.
Ou veja a consultoria. Mais resultados na página de clientes.
