Subset web fonts to reduce font payload by up to 80%, generate CSS @font-face unicode-range rules, and pyftsubset commands.
Estimated Payload Reduction: ~82%
Full font file (~320KB) $\rightarrow$ SubsetFont (~28KB). Drastically improves LCP and First Contentful Paint.
1. Select Target Character Sets
CSS @font-face unicode-range
pyftsubset CLI Command
Web Font Subsetting & Performance Optimization
Complete Unicode font files (like Inter, Roboto, or Noto Sans) often contain over 2,000 glyphs covering Cyrillic, Greek, Hebrew, and thousands of obscure typographic symbols. These files can easily weigh 300KB to 1MB. For an English or Western European website, over 85% of those glyphs are never rendered.
How unicode-range Improves Core Web Vitals
Targeted Downloading: Browsers that support CSS unicode-range will only download a font file if characters on the active page fall within that declared range.
Eliminating FOIT / FOUT: Smaller font payloads (e.g. 25KB vs 350KB) download in milliseconds over mobile connections, eliminating Flash of Invisible Text (FOIT) and reducing Largest Contentful Paint (LCP).