
Should you self-host Google Fonts? - bewuethr
https://www.tunetheweb.com/blog/should-you-self-host-google-fonts/
======
tolmasky
We’re basically forced to switch to self hosting due to the bizarre way Google
implements statistics for Google Fonts. 1 out of 1000 requests will include a
“tracking font” which is actually invalid and breaks document.fonts.load. This
was an incredibly frustrating bug to track down.

Bug for those interested:
[https://github.com/google/fonts/issues/2345](https://github.com/google/fonts/issues/2345)

~~~
arthurcolle
The guy who is affiliated with Google Fonts who showed up on a thread a few
days ago said that he didn't think there was any tracking related to new
implementations of Google Fonts stuff.

I guess this says the opposite. Let me try to dig up the thread for
completeness...

EDIT: Well that was faster than I thought I'd be able to do. Here's the
comment, and the thread:
[https://news.ycombinator.com/item?id=22369415](https://news.ycombinator.com/item?id=22369415)

~~~
tolmasky
I actually don’t care what they’re doing with the data, I care that it crashes
the site.

The font that gets loaded once every thousand requests is
[https://fonts.gstatic.com/stats/Roboto/normal/400](https://fonts.gstatic.com/stats/Roboto/normal/400)
so it’s some form of statistics. But again, my actual concern is that it
breaks.

Here’s the code I used to “catch” it. Here, it took roughly 500 requests:
[https://runkit.com/tolmasky/5e49b314ef61f900146c9a3b](https://runkit.com/tolmasky/5e49b314ef61f900146c9a3b)

Edit: To be clear, I’m not implying this is something they try to keep secret,
just showing a way to observe it since it purposely rarely shows up.

~~~
tjoff
Your users might... But who cares, right?

~~~
tolmasky
I don’t think there’s super meaningful data to be gleaned from server-side
tracking, especially with browsers increasingly sending little to no
information to third party resources. This is CSS, not a JS script that might
collect more info and phone home. So yeah, the site going blank is higher
priority to me than them knowing if I, the service provider, not my users,
prefer Roboto over Open Sans, or if most users now support woff2 vs. ttf. But
either way, we’re not going to use them anymore.

~~~
RodgerTheGreat
CSS can be crafted to conditionally load additional resources, which means it
can be a vector for fairly sophisticated information gathering and tracking.
For example: [https://github.com/kkuchta/css-only-
chat](https://github.com/kkuchta/css-only-chat)

~~~
tolmasky
Right but that’s not what’s happening on google fonts.

------
nirui
I could add another point: A software should be self-sufficient (at least to a
degree). When user opens the page, the page should not require an external
service to function.

Imagine a user who can access your page but cannot access Google, the user
then has to wait a long time looking at a blank page before the web browser
stopped trying, that is some really really bad experience.

And your users won't blame Google for been too slow, they will just simply
close your page, and try another search result instead.

~~~
spookthesunset
The odds of google being down / slow instead of your site are pretty bad.

Unless you build your own data center, pull in all the fiber yourself, make
the network switches yourself, build the servers yourself, etc... you are
always going to be dependent on a third party or external service.

~~~
polyphonicist
Google has a reputation of shutting their services down. What if they shut
their fonts CDN down or change their URLs without redirects?

~~~
spookthesunset
Than a hell of a lot of sites lose their fonts until they update.

~~~
onion2k
To be fair, lots of people being affected hasn't stopped Google in the past.

In the case of Fonts though, it's a good source of user and browser data, so
it's not likely to be shut down any time soon.

------
rgbrenner
I have this bookmarked that makes it very convenient to download a font from
google:

[https://google-webfonts-helper.herokuapp.com/fonts](https://google-webfonts-
helper.herokuapp.com/fonts)

~~~
SahAssar
One thing I see is that it by default includes specific support for IE6-IE9,
IOS before v5, android before v4.4 which definitely should not be the default
these days. It should be an option, but not the default.

~~~
majodev
Creator here. Yeah, you can possibly switch to "Modern Browsers" by now.
Haven't touched this project in a while...

~~~
earthboundkid
Thanks, I use your web app for all my projects.

------
marcan_42
If you have a worldwide CDN yourself, or you only care about local users, or
your fonts are small (Latin subset), yes.

If you're using CJK fonts and you don't already have a CDN for your stuff, no.
Google Fonts' CDN is going to beat your own server from any other continent.

~~~
nsomaru
But if you’re already loading your entire site from your server, what
difference does it make if the fonts come from there too?

~~~
marcan_42
CJK fonts can be megabytes. The rest of an otherwise lean site can be a few
hundred kilobytes or less.

E.g. my site's About page is tiny, but pulls in a CJK font (with delayed load)
for one line of text. It would make no sense to self-host that:
[https://marcan.st/about/](https://marcan.st/about/)

~~~
tjoff
Jesus, why bother we a lean site with that mindset.

If it truly is a must make it a small (self-hosted) png.

~~~
e12e
Eh, then it's no longer text?

Fwiw I don't really think a one-time large font download is much of a problem
- considering that improved typography is a very good way to improve how a
site looks. And unlike your png - the text will display without the custom
font. Fall-back fonts are only _really_ a problem with icon font sets.

~~~
tjoff
It will read just fine. But no, I would not recommend it. But much rather that
than a multi-megabyte one-liner.

One time. Per site. On slow and/or expensive mobile connection?

The png will also display without the custom font...

~~~
e12e
Png has poor screen reader support, though it can be amended via an alt tag, I
suppose. [ed: but breaks copy and paste, which might be bad for an about page
listing address and contact information - personally I'd much prefer fallback
font to a png].

It's a shame there are no "bandwidth" queries in css, like there are @media
queries - the client should be able to say - just content and essential
downloads, please.

~~~
tunetheweb
They’ve been proposed!: [https://drafts.csswg.org/mediaqueries-5/#prefers-
reduced-dat...](https://drafts.csswg.org/mediaqueries-5/#prefers-reduced-data)

You can already do this with JavaScript now:
[https://developer.mozilla.org/en-
US/docs/Web/API/NetworkInfo...](https://developer.mozilla.org/en-
US/docs/Web/API/NetworkInformation) though as you can see from the bottom of
that link, Browser support is limited at the moment (and experimental so may
even be removed/changed!).

------
supportlocal4h
I read this question more generally as I have just revisited it myself in the
past week.

For me this isn't just a question about Google Fonts. It's a question about
jQuery and React and any common js lib off a CDN. And it's even a question
about DLLs. glibc, zlib, .net. If it doesn't ship as part of your product, but
your product can't work without it...

There's the problem of malicious replacement. There's the problem of
disappearance. And various other problems.

On the other hand, there are all the positives. One upgrade at one URL and
tons of dependent software gets a free security fix or performance fix or what
have you. There's better caching. There's the speed benefit of CDNs. There's
the lower memory consumption of DLLs.

This time around I have decided to self-host. But I don't think there's one
right answer.

~~~
jeltz
Better caching is no longer an advantage since they changed how caching works
to prevent data leaks
[https://bugzilla.mozilla.org/show_bug.cgi?id=1536058](https://bugzilla.mozilla.org/show_bug.cgi?id=1536058)

------
drewg123
Looking at this, as an old fart who works in the kernel, I just can't help but
wonder:

How is it possible that we have arrived at something this painfully slow? What
are we getting from all these zillion resources a page is loading to make it
worth the 3-6 second wait?

The static web of the 90s over dialup was faster than this.

I want my 28800 modem, pentium pro running netscape on FreeBSD 2.x, and static
pages back. It was faster (with images disabled at least) than today's web
with a 1Gb/s symmetric fiber connection, FF/Chrome on a MBP, even with ads
blocked.

~~~
GordonS
While I take your point about bloated web pages, I think you have a serious
case of nostalgia viewed through rose-tinted glasses.

I recall the days of a 14k modem, and they were _not_ pleasant, even for just
text. And when you added images to the mix, it was just painful. Let's not
even discuss videos...

~~~
knodi123
He took it too far, granted, but overall there's a valid point. By
coincidence, I'm writing an applicant tracking tool in rails+react now, and I
also wrote one in perl about 16 years ago.

The modern app uses so many javascript libraries, 3rd party fonts, and is
generally just so... ouch.

I remember demoing the perl app internally at my first job, and in many cases
our page could render the page about as fast as it took to click. Our boss
thought it was a static html demo just based on how fast it was.

~~~
GordonS
I've had similar experiences, except it used to be PHP for me back in the day,
rather than perl - I recall a servicedesk system, as well as a purchase order
approval system, amongst many others. Not a single line of JS in sight!

But some of us never abandoned server-side rendering - I work a lot with
ASP.NET Core MVC, and it's great; I'm very productive with it. But I do add
Javascript on top here and there, where it adds value.

------
pcurve
We ran into a rather large issue using Google Font CDN a few years ago. We
were using Rubik font and pages were font was render as blank in certain
browser combination.

They had to rollback, but there were a lot of escalations.

You can see the issue here.
[https://github.com/google/fonts/issues/1137](https://github.com/google/fonts/issues/1137)

Self-hosting fixed the problem. We no longer use Google Font CDN.

------
potench
Safari does more than other browsers to prevent cross domain tracking. 3rd
party cookies disabled by default, cookies in iframes considered 3rd party
(so, blocked), and TIL it maintains a separate local cache for each domain to
prevent fingerprinting a user across domains. I have a hunch you could
probably drop 3rd party cookies using a <video> element (maybe for DRM stuff?
Just a hunch I have because video-ad CPMs are consistent or better on iOS over
android/desktop indicating perhaps advertisers know the user somehow). Awesome
article, great reference links, super interesting!

------
abiro
Good article, but the best solution to the font problem is to simply use
native fonts:

[https://www.smashingmagazine.com/2015/11/using-system-ui-
fon...](https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-
practical-guide/)

This solves both privacy and performance problems and this is also what
Bootstrap recommends now:

[https://getbootstrap.com/docs/4.0/content/typography/](https://getbootstrap.com/docs/4.0/content/typography/)

~~~
beefhash
Long prose does not benefit from those fonts. A system font is usually used
for UIs and is optimized accordingly. There's more to font selection than "use
the same font as native applications".

~~~
filleduchaos
I'm not quite sure what about e.g. Roboto or SF Pro Text isn't suited to long
prose, or if you think OSes ship with just the font used for system UI (and
not also dozens of others several of which were pretty much designed for
longform text).

------
vinniejames
It's a good idea to self-host ALL 3rd party assets. Otherwise you open
yourself up to the possibility any one of those contains malicious code.

At the very minimum, always check the integrity hash of third party assets

------
bcrosby95
In addition to this, If you have users that live in or travel to China, you
want to self host. Unless you like broken websites.

~~~
paulie_a
Personally I block all third party fonts and have never noticed an issue with
a plain old font. The web is so much nicer with a very restricted font set and
range of sizes.

~~~
detaro
Only thing I've noticed breaking badly are symbol fonts that try to be clever
with ligatures, so that e.g. "arrow_right" gets turned into an arrow symbol.
Happens a bunch on Google documentation sites.

------
101404
I'd say that in 99% of the cases, your users would be better off and your site
more useful, if you just used one of the standard fonts.

------
lbj
I love how this guy thinks. "Why does this font flash on pageload?" and then
procedes a 5-page write up on the intricacies of fonts, caches and everything
in between. Great write-up!

------
zelly
Free fonts aren't sufficiently better than the default system fonts to justify
the slowdown. More people will leave your site because of the added
microsecond latency than because "the font doesn't look good." You shouldn't
use Google Fonts period.

[https://practicaltypography.com/font-basics.html#why-use-
pro...](https://practicaltypography.com/font-basics.html#why-use-professional-
fonts)

~~~
sascha_sl
That post doesn't come across as anything but pure elitism, it makes no real
point and just claims "yeah system and free fonts are just worse".

Fonts like Roboto, Fira, Open Sans, Ubuntu, Merriweather or Vollkorn are all
"professional grade" font families with lots of variants and options. Basic
typesetting knowledge is going to get you much much further than buying a
random professional font if you're designing "a document".

------
TazeTSchnitzel
A while ago I routed Google Fonts to ::/0.0.0.0 in my /etc/hosts file. It
makes pages load a little faster, and shows me which websites thought to
provide a sensible fallback and which did not.

~~~
jackewiehose
Some time ago I disabled all webfonts (ublock or umatrix) because I really
don't care about stupid individual fonts and I thought I could save some
bytes. Unfortunately that broke a lot of video-players (like netflix) because
they use font-symbols for play/pause buttons etc.

~~~
TazeTSchnitzel
Mm, to me that feels like an abuse of fonts — it's inaccessible at least. It
makes me sad that they don't bother using the Unicode codepoints corresponding
to those symbols if they exist.

------
zaroth
So the only thing that self-hosting would be missing is all the magic that
Google is doing server-side to optimize the served files for the particular
browser that is making the request.

Things like encoding (WOFF vs WOFF2) and font hinting need to be dynamically
enabled/disabled based on the browser making the request to get the best
possible result.

You can’t do that with self-hosting without writing some code.... that would
be a great open source plugin to have, so that self-hosting could be done
without any quality compromises.

Getting the _right_ asset served to every browser was the reason I punted on
self-hosting fonts last time I tried.

For example, I care much more about the page looking correct (legible crisp
rendering fonts) than shaving 10Kb off the page size. Nothing is worse than
the wrong font package causing blurry letters on 20% of your users’ devices.

------
bovermyer
So, to counter the point that "fonts only make the web look pretty," consider
that font choice has a major impact on how accessible your website is.

For example, most people don't consider that the W and the M in your font must
look distinctly different, and not just vertical mirrors of each other. That
is a user inclusion choice, not just a "make it look pretty" or "make it on-
brand" choice.

~~~
LaGrange
...rule one of accessibility is let the user configure how they access your
content, and you just chose to override that. So that's a pretty weak excuse.

~~~
kevingadd
They can still disable custom fonts in their browser if they care. I have them
disabled in Chrome.

------
web007
Another reason to self-host: Google will gladly change the font
characteristics out from under you.

[https://github.com/JulietaUla/Montserrat/issues/60#issuecomm...](https://github.com/JulietaUla/Montserrat/issues/60#issuecomment-342618135)

------
33degrees
If you use npm, there are packages for most (if not all?) google fonts via the
Typefaces project, which makes them trivial to self host.
[https://github.com/KyleAMathews/typefaces](https://github.com/KyleAMathews/typefaces)

------
tuananh
if you happen to use cloudflare, you can do this:
[https://blog.cloudflare.com/fast-google-fonts-with-
cloudflar...](https://blog.cloudflare.com/fast-google-fonts-with-cloudflare-
workers/)

~~~
partiallypro
Honestly though, this is absolutely ridiculous that you have to do something
this complex to fix something so simple. Why doesn't Cloudflare just build
this in and let users toggle it on and off under their performance tab?

~~~
tuananh
eventually i guess. if the interest is high. this is just an example of what
cloudflare workers can do.

------
swiley
IMO: don’t force your users to load fonts. On slow connections they’ll read
part of the page until suddenly the font loads and everything gets rearranged.
Worse is what google does: hide the text with JavaScript until the font loads
so the whole page takes eons before you can read it.

If there’s a font with identical metrics that most people have installed then
fine, otherwise don’t be a dick to people on bad connections.

------
cateye
Besides performance and other completely technical reasons, in my view it is
mostly a question how dependent an individual or a company wants to be.

Of course it can be technically and operationally convenient but it also means
that now you are even more dependent on the fickle choices that Google makes
that is per definition in their own interests.

------
hannob
Surprised I didn't see that point mentioned: If you self-host Fonts ("Google
Fonts" is ultimately just a collection of open source fonts) it's one less
thing to care about regarding privacy laws, sharing data with third parties
and potentially having to justify due to GDPR etc.

~~~
tunetheweb
From the post: “That leads nicely into the privacy implications of using
third-party CDNs. You have no idea what sort of tracking they are doing to
your users by using them, rather than self-hosting. And recent legislation
means a lot of sites have to explicitly list all the cookies used on the site,
which gets more complicated when using a third-party.“

------
Noumenon72
Will some of the fonts already be available if you've visited other Google
sites?

~~~
abbeyj
In the past this may have worked. But it won't anymore since browsers have
introduced partitioning by origin in their caches.
[https://www.jefftk.com/p/shared-cache-is-going-
away.amp](https://www.jefftk.com/p/shared-cache-is-going-away.amp)

------
inopinatus
What’s the current thinking on stashing fonts in localStorage for FOUT
reduction?

~~~
microcolonel
Probably better to split your font, and put your critical glyphs somewhere
fast. Plus localStorage limits are very low, a couple decent sized fonts will
blow your budget.

~~~
EGreg
Is IndexedDB bigger? Why not use that?

~~~
bhl
You can. Another thing you can do is setup a service worker and intercept
requests to Google Fonts, responding with an entry from cache or indexeddb
instead.

~~~
EGreg
That service worker stuff doesn’t work in iOS Safari though

Can service workers intercept requests to other sites?

~~~
ficklepickle
It does since like 11.1.

Yes, SW can cache all resources. This is how offline PWAs work.

~~~
EGreg
Talkin about WebView

------
mschuster91
If you're in the EU you might want to self-host the fonts (and other assets!)
anyway for GDPR compliance - technically, loading any 3rd party asset exposes
the visitor's IP address plus any possible tracking cookie plus the exact URL
of the website your visitor is reading to the provider.

Google might say they're not doing any tracking on the fonts, but I don't
believe them at all.

------
irrational
Should you use Google fonts?

------
oracle2025
Google-Fonts could be made part of Google-Chrome and would never be downloaded
ever again for Chrome Users

~~~
ThePhysicist
There are a lot of fonts on Google Fonts that are many GB in size if you’d
include them all.

------
GrumpyNl
You should host everything yourself.

------
neillyons
I’m about to switch to self hosting so the font will load in mainland China.

------
paulcarroty
Sure if you/your clients don't want be tracked.

------
1337shadow
Another reason would be to simplify CSP configuration.

------
_eht
In a word; yes.

------
droithomme
At this point you have to self host assets, assuming their license allows
that, if you want to comply with privacy regulation. If you don't have a
signed legal contract with Google asserting they are not tracking your
customers via embedded links, then you must assume they are doing so and you
are out of legal compliance.

------
jstewartmobile
you should self host _EVERYTHING_

~~~
tempodox
But wouldn't that stop Google from putting ads into their fonts and AMP into
URLs? Does anybody self-host Gmail?

~~~
jstewartmobile
Step 1) get a degree to jerk around with docker all day for money

Step 2) realize that this computer shit is hard

Step 3) let google do it instead

------
elvicherrera
I believe stuff like this is what localstorage was for

