2011年5月26日(木) 23時40分43秒 [仕事]

外部CSSとJavaScriptによる表示速度の低下を防ぐ方法

HTMLファイルとは独立したCSSファイルやJavaScriptファイルをHTMLから呼び出すとき、記述方法や記述位置によってはウェブページ自体の表示が遅くなっちゃう原因になる可能性があります。
その原因と対策をAll Aboutで書きました。

■外部CSSと外部JavaScriptで表示速度の低下を防ぐには（＠All About ホームページ作成）

この記事を書くために、外部ファイルの読み込みが遅くなった場合にブラウザのレンダリングがどうなるのかを調べるべく、スクリプトを作って実験したりしました。

昔は、JavaScriptファイルは頭から順番に読んでいくので複数ファイルを読み込む場合でも並列にはダウンロードしない……というような情報を読んだ気がするんですが、どうもそうじゃないっぽいですね。複数のJavaScriptファイルでも並列して読み込まれていました。（実際に中身を解釈するのは、記述順でしょうけども。）

あと、各ファイルがどう読み込まれているかを実況的に確認するには、外部ツールを使うのが便利ですね。Firebugに含まれる「接続」タブとか。ウェブ上で提供されている独立したツールもいくつかあって便利でした。

お手軽度では、Firebug（※Firefox用アドオン）が高いですが。
Firefoxに限定せず、代表的なそれぞれのブラウザでどのようにファイルがリクエストされているのかも簡単に分かるツールがあると良いんですけどね。^^;