performance posts

Fallback webfont and emoji

Recently I found that browsers will download a fallback webfont (@font-face) to try to find an emoji or other missing character. I was looking at the perf characteristics of my site when I noticed that the browser was downloading a webfont that wasn’t being used at all. After some digging, I found that the browser was going down through the full font stack to try to find an emoji I had added to that page, downloading the webfont on the way.

This is probably not a common setup, but I have a webfont in my font stack down stack from some similar common system fonts, as a fallback just in case. It uses a nice system font unless it can’t find it, in which case it uses the webfont, unless it can’t use that, in which case it uses a less desirable system font or the generic font class.

Continue reading post "Fallback webfont and emoji"