Cache validator for Google Webfonts
Asked Answered
B

3

22

So I'm creating an ultra optimized site, and my page load speed with https://developers.google.com/speed/pagespeed/ is 99 (out of 100).

The only thing keeping me away from full hundred is this:

By specifying a cache validator - a Last-Modified or ETag header - you ensure that the validity of cached resources can efficiently be determined.

What?! I don't know what should I do. How do I set a cache validator for google webfonts?

I've the webfont like this: <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,800' rel='stylesheet' type='text/css'>.

I'm on ubuntu with apache2 if that matters.

Downloading the webfont to server and using it from there drops the score to 96 so that won't help either.

Both answered 29/6, 2013 at 16:28 Comment(0)
O
14

You can't do anything about it. You can't control what headers google server sends.

I would even go so far as to say it is reporting a false positive that you should fix.

http://redbot.org/?uri=http%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DOpen%2BSans%3A400%2C800

As you can see the resource is cached, has a max age header and is even compressed.

You site is fast enough! I wouldn't worry about getting 100. You can probably stop optimizing it.

But if you want to tinker some more, here's a few ideas on improving things, I ran a report: http://www.webpagetest.org/result/130703_H7_15KM/

Oddfellow answered 3/7, 2013 at 18:59 Comment(1)
I actually have a favicon, and jQuery is loaded from google. I don't like jpgs but I have optimized pngs :)Both
B
1

Here is a nice and clean solution.

That 99 score is really good. However, if you are concerned about that remaining 1 score, you can load Open Sans font from Easy Fonts library that fixes this issue.

<link href="https://pagecdn.io/lib/easyfonts/open-sans.css" rel="stylesheet" />

Complete fonts reference is available on Easy Fonts website. There are several more benefits of using Easy Fonts library in production. See this stackoverflow answer: https://mcmap.net/q/352555/-how-do-i-39-leverage-browser-caching-39-for-google-fonts.

Byrd answered 7/10, 2019 at 6:13 Comment(0)
C
0

Actualy you can with <link rel="prefetch" type="text/css" onload="this.rel='stylesheet'" href="fonturl">

Coad answered 20/6, 2016 at 11:21 Comment(3)
Any info on why this works &/or where this is documented?Memling
It works, i know about this but only in chrome from what i know.Coad
What is this? What does it do? ThanksSello

© 2022 - 2024 — McMap. All rights reserved.