What to do with static sites? about fontfaceobserver

[robwierzbowski]

I set a sessionStorage key to true on font load, then check it in an inline script in the head of the document. If it exists, I set a class on the document root (html) element. Works pretty well for single sessions (there's a FOUT every new session even if the font is in the cache, although it's really short), but there's no true connection between whether the font is in the cache and the sessionStorage value.

If you want to optimize for return visitors it seems like the best option is to use localStorage and re-implement caching by saving the font as base64 in CSS, and saving the CSS in localStorage.

[ismay]

@robwierzbowski Ah, that's a good idea. I've seen solutions where people added the whole font to localstorage, but just setting a boolean seems more elegant. I'll try that, thanks!

[bramstein]

Yup, that's what I would recommend for static sites (and dynamic ones as well).