FOUCを即効で直す方法

 FOUCとは,読み込み時に画面がちらつく現象.CSSのスタイルが効いていない要素がCSSファイルより先に読み込まれてしまうことにより起こる.FOUCを防ぐ方法は次の3ステップが知られている.
1. 

.no-fouc{display: none;}

2. 

document.documentElement.className = 'no-fouc';

3.

$(document).ready(function() {
    $('.no-fouc').removeClass('no-fouc');
});

 こうしておくと,no-foucクラスを取り払う(3.)ことで,表示してくれる.
 しかし.それでも動作が遅いことがある.「表示しない」つまりdisplay: none;が後で効かざるを得ないときがある.そのときは,同等のjQueryメソッドである.hide()を使って,1.の代わりに,
1.

$('.no-fouc').hide(0);

 と書く.こうすると,no-foucクラスの付いた要素を0ミリ秒で隠してくれる..hide()にはslowなどの速度表現のほかに時間も数字で指定できる.ここを突いた方法である.