Home / Articles / Performance & Optimization / Quit Using Google-hosted Fonts

Quit Using Google-hosted Fonts

Written by

Ben Marshall

Comments

Start the Conversation

Published Dec 8, 2020

Typical Read

2 minutes

Performance Optimization

If you're using hosted Google Fonts, you may want to rethink that if you care about performance. The old CDN argument is no longer valid.

Google Fonts is easily the most popular and widely used font service out there and for good reason. It’s incredibly easy to get started with and provides an amazing font discovery — currently being used on over 42M websites!

Google-hosted Fonts Hurt Performance

Say what?! What about the global CDN and caching benefits performance argument?

[…] 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.
https://fonts.google.com/about

Since Chrome’s v86 release in 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 the reasons behind it, mainly to prevent a possible cross-site tracking mechanism.

This means users no longer get the performance benefit from having already visited a site that’s using a Google Font, then visits another using the same. They’re both still going to have to be load externally, not from local cache.

Self-hosted fonts vs. Google-hosted fonts

No matter what tricks you try to implement, there’s no way around it, even with all of Google Fonts optimizations, it can’t be faster than self-hosted fonts.

Sia wrote a great post where she compared the performance between Google Fonts and self-hosted fonts without the impact of a CDN.

Optimized Google Fonts loading with preconnect

Optimized self-hosting fonts with preload

Google also hosted a talk back in 2018 about web performance and self-hosted web fonts. Check it out below:

In Conclusion

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

tl;dr

Using Google-hosted fonts will actually hurt site performance. Downloaded, locally-hosted Google fonts are a much better option for site performance.

Join the conversation. Nevermind.

All comments posted on 'Quit Using Google-hosted Fonts' are held for moderation and only published when on topic and not rude. Get a gold star if you actually read & follow these rules.

You may write comments in Markdown. This is the best way to post any code, inline like `<div>this</div>` or multiline blocks within triple backtick fences (```) with double new lines before and after.

Want to tell me something privately, like pointing out a typo or stuff like that? Contact Me.