Otimize Fontes da Web Sem Alterar a Renderização

Faça os webfonts deste site carregarem mais rápido sem mudar a aparência de nada. Reduza os bytes das fontes o máximo possível, mantenha a renderização idêntica e prove isso com diffs de pixels antes/depois. Trate qualquer mudança visual como uma regressão, a menos que eu aprove. Se uma otimização mudar a renderização, diga-me o que ela economiza e o que muda, e mantenha o site com a mesma aparência por padrão. Mantenha o comportamento de carregamento atual: não toque em font-display nem em fontes de fallback. Não adicione processamento de fontes ao build; escreva um script que eu executo manualmente, faça commit da saída dele e anote quando ele precisar ser executado novamente. Primeiro meça o estado atual: o tamanho de cada arquivo de fonte, a contagem de glifos, os eixos variáveis, os recursos OpenType e o hinting, além dos bytes de fonte por página e o que cada página pré-carrega. Depois descubra o que o site realmente usa, verificando estilos inline de componentes e folhas de estilo: quais caracteres aparecem no conteúdo, quais valores de eixo e pesos cada fonte precisa (incluindo sobrescritas pontuais e negrito dentro de itálico), quais recursos OpenType estão ativados e efeitos colaterais de CSS como `hyphens: auto` usando o hífen U+2010. Corte cada fonte até isso. Mantenha os caracteres usados mais Latin-1 e Latin Extended-A, e deixe CJK para fontes do sistema se for assim que renderiza hoje. Limite os eixos variáveis às faixas em uso e só fixe um eixo em um valor se nada o sobrescrever. Remova recursos OpenType e hinting não usados. Divida cada fonte em dois arquivos. Um núcleo pequeno com ASCII e a pontuação que a maioria das páginas usa (aspas curvas, travessões, reticências) é pré-carregado. Um arquivo estendido atrás de `unicode-range` só é baixado quando uma página precisa de um de seus caracteres. O `unicode-range` de cada arquivo deve listar apenas caracteres que ele realmente contém. Cuidado com algumas coisas. Uma face de fallback gerada entre os arquivos núcleo e estendido desenhará os caracteres estendidos antes que a fonte real chegue. Fontes com um Reserved Font Name sob a OFL devem ser renomeadas internamente após o subset. Verifique os arquivos gerados, pois as ferramentas de fonte têm peculiaridades. Antes de considerar concluído, construa uma linha de base a partir do mesmo conteúdo e faça diff de pixels antes e depois em páginas com código, itálico, caracteres acentuados, componentes com suas próprias configurações de fonte e CJK. Explique cada diferença visível: mudança de conteúdo, regressão para corrigir ou arredondamento sub-pixel inofensivo. Meça novamente os bytes por página e confirme que os arquivos estendidos só carregam onde necessário. Quando terminar, diga-me os bytes antes e depois por fonte e por página, os resultados do diff de pixels, onde você se desviou do que pedi e quanto custou, e como executar o script novamente. Mais tarde, pode valer a pena incorporar a fonte núcleo na folha de estilo global e pré-cachear os arquivos estendidos após o idle.