0

可能であれば、いくつかのアドバイス/フィードバックを求めていました。

私は大規模なプロジェクトに取り組んでおり、開発チームは、すべての JS/CSS をマージし、これを memcache で 1 つのファイルとしてキャッシュして、処理を高速化するように要求しました。

私の懸念は、これは私が慣れている方法ではないということです.ページごとに必要なJSとCSSだけをロードしたいのは、明らかな理由だと思います.

私は他のトラフィックの多いサイトもいくつか見てきましたが、他の誰もこれを行っていないようです.

このアプローチの長所と短所を教えてください。

前もって感謝します

リチャード

4

1 に答える 1

3

「トラフィックの多い他のサイトをいくつか見てきましたが、これを行っているサイトは他にないようです」

本当に？これにはかなり驚かされます...これは、ページの読み込み時間を短縮するための第 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 プラグインなどを追加すると、この内容がさらに重要になり始めます。

于 2012-06-18T21:28:07.110 に答える