Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
December 1, 2020 07:41 am GMT

Time to Say Goodbye to GoogleFonts

I've used Google Fonts in prototypes and in 10M+ MAU products. It's incredibly easy to get started with and provides an amazing font discovery. That's also why it's currently still used on over 42M websites!

This convenience has its price: Performance. Many have already pointed out in great detail the cost of multiple requests. If you want the remaining speed boost, then you're best off downloading your used Google Fonts and self-host them.

This is nothing new. In fact it's been advocated already since years. Even Google themselves advised others to self-host fonts in their Google I/O '18 talk about web performance.

Self-hosting vs Google Fonts

Sia wrote a great post about Google Fonts optimisation with this benchmark comparison:

Optimised self-hosting fonts with preload:
Optimised Google Fonts loading with preconnect

Optimised self-hosting fonts with preload:
Optimised self-hosting fonts with preload

The old performance argument

Google Fonts was designed to be distributed on a global CDN and reap the caching benefits from it. Users request fonts via said CDN. Chances are that they have downloaded the font resources at an earlier point already from a different site.

This was convincing enough to get many developers on board.

"[] Our cross-site caching is designed so that you only need to load a font once, with any website, and we'll use that same cached font on any other website that uses Google Fonts."

Invalidating the old performance argument

Since Chrome v86, released October 2020, cross-site resources like fonts can't be shared on the same CDN anymore. This is due to the partitioned browser cache (Safari has had this for years already).

In this Google post they explain what the partitioned browser cache is. It got only introduced to prevent a possible cross-site tracking mechanism.

Cache partitioning in otherbrowsers

Safari really cares about privacy. It circumvented this very cross-site tracking attack since years already. Then finally comes Chrome. Other browsers that are based off Chromium, still need to signal or implement the feature.

Chrome: since v86 (October 2020)
Safari: since 2013
Firefox: planning to implement
Edge: most likely soon
Opera: most likely soon
Brave: most likely soon
Vivaldi: most likely soon

Conclusion

Google Fonts resources will be redownloaded for every website, regardless it being cached on the CDN. Self-host your fonts for better performance. The old performance argument is not valid anymore.

Thanks for checking this post out!

Simon Wicki is a Frontend Developer in Berlin. Passionate and fluent in Vue, Angular, React and Ionic. Interested in Tech, frontend & non-fiction books.

Join me on Twitter to follow my latest updates.


Original Link: https://dev.to/zwacky/time-to-say-goodbye-to-google-fonts-16dd

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To