Dicas do DevTools: depuração das navegações especulativas para carregamentos de página mais rápidos
bookmark_borderbookmark
Mantenha tudo organizado com as coleções
Salve e categorize o conteúdo com base nas suas preferências.
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.
[[["Fácil de entender","easyToUnderstand","thumb-up"],["Meu problema foi resolvido","solvedMyProblem","thumb-up"],["Outro","otherUp","thumb-up"]],[["Não contém as informações de que eu preciso","missingTheInformationINeed","thumb-down"],["Muito complicado / etapas demais","tooComplicatedTooManySteps","thumb-down"],["Desatualizado","outOfDate","thumb-down"],["Problema na tradução","translationIssue","thumb-down"],["Problema com as amostras / o código","samplesCodeIssue","thumb-down"],["Outro","otherDown","thumb-down"]],["Última atualização 2024-02-01 UTC."],[],[]]