So, generally Firefox 3 did not have much impact on our sites. Besides the Kupu problem Andy mentioned, there were just a few small CSS-related glitches, but overall we did not have to scramble to roll out patches. However, on a site we’re currently working on, Firefox 3 showed a serious glitch I hadn’t seen for a long time: the Flash of Unstyled Content or FOUC, first described back in 2001. The page content displays un-styled for a split second before the stylesheet kicks in.
The bluerobot article is now outdated, but the problem occasionally still rears its head on more modern browsers. Since I’ve been using Firefox 3, I’ve been seeing it quite often, where Firefox 2 doesn’t. (I’m not saying there’s anything wrong with FF3, it’s probably just being less lax than FF2.) This article has a good explanation. In a nutshell, you see a FOUC whenever a script tries to access properties like scrollHeight or offsetWidth before the stylesheet has loaded. The solution is simply to have the CSS links above the JavaScript links in the HTML.
Here’s an example (until they fix it, anyway): getcloser.com, an ambitious HMV-sponsored social connector based on entertainment interests, designed by the clever bods at LBi. You can see in the <head> there’s 78KB of JavaScript followed by 151KB of CSS. Switch it round, and it’ll go away.
0 Response to “Return of the FOUC”