後藤大地「avaScript読み込みブロック回避でページ表示を高速化する方法」
JavaScript読み込みブロック回避でページ表示を高速化する方法
マイコミの記事by後藤大地さん。
勉強
- 「2倍以上の高速化」とある箇所
- 誇張されて、ネタ元の記事の内容の紹介されてる
- ネタ元の記事では、読込時間が画像ファイルとjsファイルとが同時間である条件の下ではは2倍以上である、と書かれてる。
- しかもこの条件もテスト用に設定されたもの、とネタ元記事では断ってる。
JavaScriptの読み込み中はほかの読み込み処理がブロックされる。これをDOM経由で動的にロードするように書き換えてやれば並列して読み込まれるようになる。Non-blocking JavaScript Downloadsではこのテクニックの適用で2倍以上の高速化が確認されている。ちなみに画像の読み込みが2並列にとどまっているのはHTTP 1.1に準拠した実装になっているIE7/Firefox2における制限だ。この制限はドメインごとに発生するため画像のドメイン名を変更することで回避もできる。なおIE8/Firefox3では6並列まで拡張されている。
Non-blocking JavaScript Downloads
Yahoo! User Interface Blogのエントリ
上の後藤大地さん@マイコミ記事のネタ元