«Полный» WebFont, включающий все стилистические варианты, которые могут вам не понадобиться, а также все глифы, которые могут остаться неиспользованными, может легко привести к загрузке нескольких мегабайт. В этом посте вы узнаете, как оптимизировать загрузку WebFonts, чтобы посетители загружали только то, что они будут использовать.
Чтобы решить проблему больших файлов, содержащих все варианты, правило CSS @font-face
специально разработано, чтобы позволить вам разделить семейство шрифтов на коллекцию ресурсов. Например, подмножества Юникода и отдельные варианты стилей.
По этим объявлениям браузер определяет необходимые подмножества и варианты и загружает минимальный набор, необходимый для рендеринга текста, что очень удобно. Однако если вы не будете осторожны, это также может создать узкое место в производительности на критическом пути рендеринга и задержать рендеринг текста.
Поведение по умолчанию
Отложенная заг