2009年11月15日(日) 11:15
script・css・img・iframe が読み込まれるタイミング調査 Kawa.netブログ(川崎有亮)/ウェブリブログ/MSM
どのブラウザも、head 内の css は、ページ描画前に読み込む。
(→ だから、css は速くダウンロードできる必要がある)
script は、img・iframe の取得前に読み込む。
IE/Firefox では、head 内・body 内の script を並列で読み込むのに対して、
Safari/Chrome では、head 内の script のみ並列に読み込み、それが完了してから、
body 内の script を並列に読み込む。(→ 何で分けてるのだろう??)
HTML 内の全ての script の読み込みが完了してから、img を並列に読み込む。
IE/Firefox は img と iframe を区別なく並列に読み込むのに対して、
Safari/Chrome は img のみを並列に読み込んでから、最後に iframe のみを並列に読み込む。
(→ つまり、iframe はかなり遅く描画される場合がありうる)
また、(4つ以下の)iframe を並べたとき、並列(同時)にリクエストされ、
非同期に表示されるので、1つの iframe レスポンスが遅くても他の描画に影響は出ない。
script は並列(同時に)にダウンロードされるが、評価(実行)されるのは順序通りで、
1つの script レスポンスが遅いと、img も読まれずページ全体の表示に影響する。