Flash of unstyled content (FOUC) in Firefox only? Is FF slow renderer?

Question

I\'m not seeing this issue in any other browser that I\'ve tested - IE, Chrome, Opera - but whenever I load a page from the server, I\'m seeing a flash of unstyled content befor

Answer 1

Filament Group share they way they load their fonts in detail,

http://www.filamentgroup.com/lab/font-loading.html

which is a nice modern approach to @font-face loading

Smashing magazine also review there website performance and came up with a different solution that stores the caches a base64 copy of the font in local storage. This solution may require a different licence for you font.

A gist can be found at:

https://gist.github.com/hdragomir/8f00ce2581795fd7b1b7

The original article detailing their decision can be fount at:

http://www.smashingmagazine.com/2014/09/08/improving-smashing-magazine-performance-case-study/#webfonts

Additional recommendation

The head of your document contains far to many individual stylesheets, all these css files should be combined into a single file, minified and gziped. You may have a second link for your fonts placed before you main stylesheet.