Dicas do DevTools: depuração das navegações especulativas para carregamentos de página mais rápidos

Sofia Emelianova
Sofia Emelianova

Com a API Speculation Rules, é possível implementar um carregamento de página quase instantâneo com base em regras de especulação definidas por você. Isso permite que seu site faça a pré-busca e pré-renderização da maioria das páginas acessadas.

Assista ao vídeo e confira esta demonstração para saber como:

  • Inspecione especulações, regras e status em Aplicativo > Serviços em segundo plano > Carregamentos especulativos.
  • Alterne entre as renderizações pelo menu suspenso na barra de ações na parte superior e inspecione as renderizações usando todos os painéis do DevTools.
  • Status de pré-renderização do rastro em tempo real.

Como você pode saber onde o usuário vai clicar em seguida? Para ajudar a maximizar o potencial de carregamentos especulativos, o Chrome 121 agora pode acessar todos os links do documento em vez de uma lista fixa, mas só fazer a pré-renderização quando o usuário passar o cursor sobre um link e estiver prestes a clicar nele.

Assista a última parte do vídeo para aprender a implementar e depurar regras de documentos que acionam pré-renderizações ao passar o cursor ou ao passar o mouse. Esses eventos dão uma pequena vantagem para o carregamento especulativo das páginas antes da navegação. Confira esse recurso nesta demonstração.

Confira mais informações: