「トラフィックの多い他のサイトをいくつか見てきましたが、これを行っているサイトは他にないようです」
本当に?これにはかなり驚かされます...これは、ページの読み込み時間を短縮するための第 1 段階と考えられています。ここを参照してください: http://developer.yahoo.com/performance/rules.html . 読み込み時間のベスト プラクティスへの準拠をテストする場合は、パフォーマンス テスト ツール YSlow ( http://developer.yahoo.com/yslow/ ) も試してください。
これがベスト プラクティスと見なされる理由は次のとおりです。ブラウザーの同時接続数は約 8 に制限されており、特定のサーバーごとに 2 (非準拠ブラウザーの場合はそれ以上) に制限されています。そのため、特定のページに対して複数のファイルを作成している場合、ブラウザーは一度に 2 つずつ、サーバーに対して 15 ラウンドトリップを行うため、ファイルは幾分連続してロードされます。
それでは、これがどのように機能するか見てみましょう。それぞれ 10k のファイルが 15 個あるとします。または、それらをまとめて 150k ファイルにすることもできます。サーバーへの遅延が 65 ミリ秒で、ダウンロード速度がわずか 25k/秒だとします。計算してみましょう...ここに方程式があります:
$page_load_time = ( ($simultaneous_connections * $load_time_per_file)
+ $latency_per_request )
* ($number_of_files/$request_cycles)
どこ:
$request_cycles = max(1, ($number_of_files/$simultaneous_connections))
したがって、それぞれ 10k の 15 個のファイルがある場合:
((2 * .4 seconds) + .065 seconds) * 7.5 = 6.4875 seconds
または単一の 150k ファイルの場合:
((1 * 6 seconds) + 0.065 seconds) * 1 = 6.065 seconds
劇的な違いではありませんが、それでもユーザーの待ち時間はほぼ 0.5 秒です!
では、3G 接続の場合はどうなるでしょうか。または、Wi-Fiに少し問題がありますか?より多くの帯域幅 (100k/秒) とより多くの遅延 (250ms) を試してみましょう:
((2 * .1 seconds) + 0.250 seconds) * 7.5 = 3.375 seconds
また
((1 * 1.5 seconds) + 0.250 seconds) * 1 = 1.750 seconds
うわー!これらすべての個別の小さなファイルにより、ページの読み込み時間がほぼ 2 倍になりました。
たくさんの他のファイル、派手な TypeKit の読み込み、広告サーバーの読み込み、Facebook プラグインなどを追加すると、この内容がさらに重要になり始めます。