unicode-range and variable fonts are probably the fastest ways to do it!
I have this file on my personal site, which loads the Recursive font in two sections - the first is a tiny subset needed for English (the language I primarily write in). There is a great explanation of unicode-rangehere.
@font-face{font-family:'Recursive';src:url('/fonts/recursive-0020_007F.woff2')format('woff2');unicode-range:U+0020-007F;/* The bare minimum for the English Language */}@font-face{font-family:'Recursive';src:url('/fonts/recursive.woff2')format('woff2');unicode-range:U+00A0-00FF,U+0100-017F;/* additional glyphs */}
The other big win is using variable fonts - they limit the amount of code needed to deliver a wide range of fonts by encoding how the font changes at different widths, slants, and styles directly in the font file. Recursive is what I use, but there are a good number of other variable fonts out there!
unicode-range
and variable fonts are probably the fastest ways to do it!I have this file on my personal site, which loads the Recursive font in two sections - the first is a tiny subset needed for English (the language I primarily write in). There is a great explanation of
unicode-range
here.The other big win is using variable fonts - they limit the amount of code needed to deliver a wide range of fonts by encoding how the font changes at different widths, slants, and styles directly in the font file. Recursive is what I use, but there are a good number of other variable fonts out there!
recursive.design/
v-fonts.com/
Thank you this is a really good reply! I did not know about
unicode-range
.Yeah, it's a great tool, but I don't see a ton of people working with it, but it's sooo good.