Early Hints

O Early Hints é um padrão web que você pode implementar para melhorar os tempos de carregamento de páginas em até 30%. Este padrão web define um novo código de status HTTP: 103 Early Hints.

Quando o recurso Early Hints é ativado e um visitante carrega o seu site em um navegador compatível, respostas 103 são enviadas para o navegador (antes das respostas 200) com informações sobre os ativos vinculados que podem aparecer na resposta final do servidor. Com essas informações, o navegador pode começar a preparar a página antes de receber a resposta 200 OK do servidor. Isso permite que o navegador prepare a página de forma mais eficiente enquanto o servidor está “pensando”.

O mecanismo Early Hints pode ser usado com qualquer tipo de cabeçalho Link ou dica de recurso, como preload e preconnect. Ele ajuda a melhorar o desempenho da página da web permitindo que os navegadores comecem a buscar ou preparar recursos antes que a resposta final seja recebida.

Como parte da integração da Kinsta com o Cloudflare, o Early Hints pode ser habilitado para o seu site WordPress no MyKinsta para o seu domínio personalizado. Você não pode usar Early Hints com um domínio temporário kinsta.cloud.

Preload e preconnect

Early Hints é projetado principalmente para funcionar com dicas de recursos como preload e preconnect. Ele pode ser usado para aumentar a eficácia desses recursos enviando as dicas ao navegador assim que a solicitação inicial for feita.

• Preload: Indica ao navegador que carregue um recurso o mais rápido possível. O Early Hints envia as dicas de preload de forma antecipada, permitindo que o navegador comece a buscar recursos críticos (como CSS ou JavaScript) imediatamente. Isso reduz os tempos de bloqueio de renderização e melhora o desempenho.
• Preconnect: Estabelece conexões antecipadas com origens externas importantes. O Early Hints envia as dicas de preconnect antecipadamente, permitindo que o navegador resolva DNS e negocie TLS antes da solicitação real. Isso reduz a latência e acelera o tempo de carregamento da página.

Para usar preload e preconnect com eficiência, adicione cabeçalhos de link específicos aos recursos que deseja priorizar. Você pode utilizar plugins do WordPress para isso, como WP Rocket, Perfmatters ou Pre* Party Resource Hints.

Notas importantes

1. Seu site precisará ter o cabeçalho de resposta Link: com o tipo de relpreload ou preconnect para indicar os recursos que você deseja incluir na resposta Early Hints. Você pode usar um plugin do WordPress para adicionar cabeçalhos de preload ou preconnect aos seus recursos no WordPress.
2. O código de status 103 Early Hints é compatível com as versões mais recentes dos navegadores Chrome, Edge, Safari e Firefox. Se um navegador não oferecer suporte ao Early Hints e um cabeçalho de resposta 103 for enviado, nada acontecerá, o navegador simplesmente o ignorará.
3. Se o seu site tiver mais de 20 domínios, habilitar o recurso Early Hints pode levar 5 ou mais minutos, dependendo do número total de domínios.
4. Você não pode usar Early Hints com um domínio temporário kinsta.cloud.

Habilite o Early Hints

1. Para habilitar o Early Hints, faça login no MyKinsta e vá para Sites WordPress > nomedosite > Ferramentas.
2. Em Early Hints, clique no botão Habilitar.

Uma notificação informando que o Early Hints está habilitado aparecerá no canto superior direito.

Teste o Early Hints

Para confirmar se o Early Hints está funcionando, inspecione os cabeçalhos HTTP de uma página em seu site e procure por qualquer cabeçalho Link: com o tipo de relpreload ou preconnect que você adicionou. Para inspecionar os cabeçalhos HTTP do seu site, você pode usar qualquer um dos seguintes:

• Nosso verificador gratuito de status HTTP e redirecionamento.
• As ferramentas de desenvolvedor integradas ao seu navegador.
• O comando curl no Terminal (linha de comando), substituindo a URL no final deste exemplo pela URL da página que você deseja testar:

curl -L -s -o /dev/null -D - https://kinstaexample.com

Desabilite o Early Hints

1. Para desabilitar o Early Hints, faça login no MyKinsta e vá para Sites WordPress > nomedosite > Ferramentas.
2. Em Early Hints, clique no botão Desabilitar.

Uma notificação de que o Early Hints está desabilitado aparecerá no canto superior direito.