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

Sofia Emelianova
Sofia Emelianova

A API Speculation Rules permite implementar um carregamento de página quase instantâneo com base nas regras de especulação definidas. Isso permite que o site faça o pré-carregamento e a pré-renderização da maioria das páginas navegadas.

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

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

Como saber onde o usuário vai clicar em seguida? Para ajudar a maximizar o potencial de cargas especulativas, o Chrome 121 agora pode selecionar todos os links do documento em vez de uma lista fixa, mas só pré-renderizar quando o usuário passar o cursor sobre um link e estiver prestes a clicar nele.

Assista a última parte do vídeo para saber como implementar e depurar regras de documentos que acionam pré-renderizações em eventos de passar o cursor ou clicar no mouse. Esses eventos dão uma pequena vantagem para carregar as páginas antes da navegação. Confira este recurso na demonstração.

Confira mais informações em: