Automate font fallbacks

Published on September 18, 2023

← Back to tips

Fontaine is a JavaScript library that generates font fallbacks automatically, taking into account font metrics.

Using Fontaine can improve the CLS (Cumulative Layout Shift) score of a website. This score measures how much a page’s layout shifts as it loads.

Since it’s pure CSS, so it has zero runtime overhead. Another really cool package that does code transforms.

If you’re looking to enhance your website’s performance, Fontaine is an excellent solution.

Key features:

  • Easy to use: one-time setup

  • Improves the Cumulative Layout Shift (CLS) score

  • Facilitates faster website loading

  • Compatible with any font

Learn more about Fontaine at https://github.com/danielroe/fontaine.

🎉 Interested in Frontend or Indie-hacking?

I talk about the latest in frontend, along with my experience in building various (Indie) side-projects