Pular para o conteúdo
Observatório do <head>

/static/observatorio/astro/preload/

Menu

HED-003 · Conexões

<link rel="preload">

Encomenda um recurso desta página antes de o parser descobrir que precisa dele.

Busca com prioridade alta um recurso que a própria página vai usar, mas que o navegador só descobriria tarde — a fonte escondida atrás do CSS, a imagem principal referenciada num estilo. O atributo as é obrigatório: é ele que define prioridade, cabeçalhos e a política de segurança do pedido.

O mito é pré-carregar tudo: cada preload compete com o resto da página pela mesma banda, e um recurso baixado e não usado em poucos segundos rende um aviso no console. Fontes pedem crossorigin até quando moram na própria origem — a busca de fontes é sempre CORS.

<link rel="preload" href="/fontes/titulo.woff2"
      as="font" type="font/woff2" crossorigin>
A fonte que o CSS só revelaria tarde demais.