Como revisar fontes web que atrasam texto visível

Fontes externas podem atrasar o texto e trocar o layout quando ficam disponíveis.

Antes de começar

Identifique fontes efetivamente usadas no primeiro conteúdo visível e seus arquivos/pesos.

Passo a passo

1. Considere subset, font-display, cache e preload apenas da fonte crítica necessária.

2. Teste FOUT/FOIT, mudança de linha, CLS e velocidade em rede limitada.

Limites e cuidados

Não pré-carregue todos os pesos e estilos; isso pode competir com conteúdo e CSS.

Continue na biblioteca

Fonte oficial: Otimizar carregamento e renderização de fontes — web.dev.

Conteúdo da biblioteca de Diego Henrich. Confira as fontes citadas e valide orientações que dependem da versão de uma plataforma ou serviço.