FontJit, a tiny utility to lazy load fonts
Roel Nieskens
Posts: 202
For whom it might interest, I just released a tiny little font loader to be used on websites where you want to be in control of loading the font: FontJit.
Because it doesn't make sense to show the text inside a type tester in a fallback font, you can use FontJit to hide everything until the font is loaded.
Or if you're showing a large list of previews, you can use it to only load the fonts in (or close to) the viewport, but not those much further down the page—at least until the user scrolls there.
The interface is pretty easy: just slap some data-attributes on the HTML element you want the font to be applied to, and load and trigger FontJit.
I figured some of you might find it useful. Comments and feedback always welcome!
Because it doesn't make sense to show the text inside a type tester in a fallback font, you can use FontJit to hide everything until the font is loaded.
Or if you're showing a large list of previews, you can use it to only load the fonts in (or close to) the viewport, but not those much further down the page—at least until the user scrolls there.
The interface is pretty easy: just slap some data-attributes on the HTML element you want the font to be applied to, and load and trigger FontJit.
I figured some of you might find it useful. Comments and feedback always welcome!
4
Categories
- All Categories
- 46 Introductions
- 3.9K Typeface Design
- 485 Type Design Critiques
- 560 Type Design Software
- 1.1K Type Design Technique & Theory
- 654 Type Business
- 853 Font Technology
- 29 Punchcutting
- 519 Typography
- 119 Type Education
- 323 Type History
- 77 Type Resources
- 112 Lettering and Calligraphy
- 33 Lettering Critiques
- 79 Lettering Technique & Theory
- 550 Announcements
- 91 Events
- 114 Job Postings
- 170 Type Releases
- 174 Miscellaneous News
- 276 About TypeDrawers
- 54 TypeDrawers Announcements
- 120 Suggestions and Bug Reports