Loading Google Fonts from Google’s CDN feels free, but it isn’t. Each external font request is a separate DNS lookup, TLS handshake, and round trip before the browser can even start rendering text — and under GDPR, it’s also sending visitor IPs to Google before they’ve consented to anything.
Downloading and self-hosting a font
Use google-webfonts-helper to grab the woff2 files directly, then define them locally:
@font-face {
font-family: 'Inter';
src: url('/fonts/inter-var.woff2') format('woff2');
font-weight: 100 900;
font-display: swap;
}font-display: swap matters here — without it, text using that font stays invisible until the font finishes loading, which is its own performance problem.
Preloading the font that matters most
If your heading font is visible above the fold, preload it directly rather than waiting for the CSS to be parsed first:
<link rel="preload" href="/fonts/inter-var.woff2" as="font" type="font/woff2" crossorigin>It’s not just fonts
The same logic applies to third-party analytics scripts, embedded video players, and social share widgets — each one is an external request the browser has to negotiate before it can move on. Where the numbers work, self-hosting a script (or lazy-loading it until it’s actually needed, like a share widget below the fold) removes that cost entirely.
The tradeoff worth knowing: self-hosted fonts and scripts are now your responsibility to update. Google’s CDN patches vulnerabilities and pushes new font versions automatically — a self-hosted copy sits still until someone updates it.