3

すべての「ウェブサイトを高速化する」サイトや書籍では、HTTPリクエストを最小限に抑えるように常に指示されています。これは問題ありませんが、ユーザーキャッシュが空であるために、すべてのページで120kbを何度もリロードする必要がある場合はどうでしょうか。

ウェブサイトのすべてのページで5つのjsファイルを使用する場合、他のすべての可変ファイルと一緒に1つの大きなファイルにまとめて1つのHTTPリクエストを保存するのではなく、1つのファイルに入れてこのファイルをすべてのページに読み込む方がよいでしょう。どのポイントまたはファイルサイズから、ファイルを「キャッシュ」して別のHTTPリクエストを送信しても大丈夫ですか?

1ページに1つのミニフィードJSファイルに対して1つのHTTPリクエストのみを使用する場合の3ページの例を示します。

  1. jquery、jquery ui、thickbox、lavalampmenu=>一緒に1つのファイルに縮小=300kb
  2. jquery、jquery ui、cycleplugin=>一緒に1つのファイルに縮小=>200kb
  3. jquery、jquery ui、galleriaプラグイン=>1つのファイルにまとめて縮小=>250kb

そして今、常に2つのHTTPリクエストを使用するもう1つの可能性:jqueryとjquery ui => 150kbで構成される1つのファイル、今のところ「jui.js」と呼びましょう

  1. jui.js、thickbox、lavalamp =最初は再び300kbですが、現在はjui.jsが他の2ページにキャッシュされています
  2. (jui.jsは現在キャッシュされているため、ロードされません)、サイクルプラグインのみ=>ロードするのは50kbのみですが、jui.jsとサイクルプラグインを別々にロードするときにもう1つのHTTPリクエストがあります。
  3. (jui.jsはすでにキャッシュされています)、galleriaプラグインのみをロード=>ロードするのに100kbだけ追加しますが、1つのリクエストがすでにキャッシュされている2つのHTTPリクエスト

では、通常の「レスポンシブ」ウェブサーバーで別のHTTPリクエストを送信しても、どの時点またはKbサイズで問題ないのでしょうか。

誰かがベストプラクティスを持っていますか、それとも単に「HTTPリクエストを最小限に抑えてください!」ですか?

(私は自分自身を明確にしたことを願っています:)そして私はいくつかのポイントができたらすぐに人々に投票します!)

編集:

基本的にはもっと簡単な質問です。キャッシュされたjsファイルの追加のHTTPラウンドトリップにはどれくらいの時間が必要ですか?httpリクエストがすべてのページに追加のキャッシュされていない部分をダウンロードする必要がある時間よりも遅い場合は、すべてをすべてのページに1つの大きなファイル(すべてのページに1つの異なる大きなファイル)に入れます。

キャッシュされたjsファイルに対するHTTPリクエストがほとんどない場合は、すべてのページに必要な部分を追加のjsファイル(もちろん最小化)に分割し、すべてのページの動的部分を異なる(再び縮小された)jsファイルに含めます。

したがって、ほとんどのページで100kbの追加(動的部分)が必要な場合、キャッシュされたHTTPリクエストの時間をテストするにはどうすればよいですか?数字はありますか、誰かがすでにこのようなことをテストしましたか?

すでに素晴らしい答えをありがとう!

4

4 に答える 4

1

つまり、ここには経験則はありません。Webサーバーの設定によっては、ファイルを1つの大きなファイルにマージして最適化を試みることができます...同じ接続を使用して複数のファイルをストリーミングするようにApacheを構成できることはわかっています。最善の方法は、apache ABなどのベンチマークツールを使用して、変更をテストすることです。

ただし、jqueryに関するものについては、グーグルなどの公的に配置されたドメインからのスクリプトを含めることができます。1)接続を回避します。2)多くの人がすでにブラウザにスクリプトをキャッシュしています。

例:http ://code.google.com/p/jqueryjs/

于 2009-09-29T22:46:47.127 に答える
1

あなたは本当にあなた自身のトラフィックに基づいてあなた自身の分析をしなければならないでしょう。初期読み込み時間も重要であるため、ユーザーが単一のJSを含むページにアクセスしている場合は、それを分割することをお勧めします。ただし、ユーザーがサイトをクリックしてしまう場合は、一度にすべてを読み込むことの正味のメリットは明らかです。

とは言うものの、私のユーザーはより多くのスクリプトを必要とする「コンテンツ」にたどり着くので、私は通常、ユーザーがクリックすることを想定して、できることを最小限に抑えることに傾倒しています。

あなたのスクリプトのグーグルのコピーへのリンクについての議論を前の議論へのリンクに残しておきます:

JSライブラリ用のGoogleAPIのクラウドにリンクする必要がありますか?

于 2009-09-29T22:48:17.340 に答える
1

これは非常に複雑なテーマです。彼らはこの主題に関する本全体を書いています;)

リソース(javascript、cssなど)については、個別にダウンロードした方がよい場合があります。ブラウザはそれらを並行してダウンロードします。ページaにリソースxyzが必要であるが、ページbにはxとzのみが必要な場合、それらを分離することは良いことです。また、すべてのページで必要なリソースを一度にダウンロードした方がよい場合もあります。場合によります。

ただし、JavaScriptを使用すると、ブラウザはページをレンダリングする前に最初にJSをダウンロードするため(スクリプトタグがheadセクションにある場合)、defer属性を追加するか、ページの下部にインクルードしてトリガーすると、パフォーマンスが向上します。 body=onloadを使用したJavaScript。

ブラウザがメモリまたはディスクにキャッシュするように、リソースにキャッシュヘッダーを設定できることも忘れないでください。これは多くの場合大きな違いを生みます。

厳格なルールは実際にはなく、ガイドラインがいくつかあります。あなたの最善の策はテストすることです!ダイヤルアップでうまく機能するものは、ブロードバンドではうまく機能しません。

Fiddlerは、たとえばモデムを使用している場合に読み込み時間を表示する優れたプログラムです。

于 2009-09-29T22:50:26.153 に答える
1

この状況にどのように対処するかは、サイトが取得するトラフィックの種類に大きく依存すると思います。人々が数ページ(3ページ未満)しかヒットせずに離れるサイトの場合は、ユーザーに必要な最小限のページのみを提供することを前提として、ファイルをより自由に分割できます。ただし、サイトに多数のページを表示しているユーザーがいる場合は、そのほとんどをバンドルして1回だけ出荷します。

また、javascriptパッケージに入れる前に、javascriptが使用されている場所を確認してください。頻繁にアクセスされない1〜2ページしか使用されていない場合は、別のファイルにすることができます。

実際には、スクリプトが送信されるときにスクリプトを圧縮しているので(正しく実行していますか?)、余分なラウンドトリップ時間を回避できるため、スクリプトを含める方が速いことがよくあります。Byronが述べたように、javascriptをダウンロードすると、他のすべてが読み込まれるのをブロックするため(非同期で行われない限り)、その時間を最小限に抑えるために最善を尽くしたいと思います。

Firebugの[ネット]タブをいじって、パフォーマンスがどのように影響を受けるかを確認してください。

于 2009-09-30T01:32:41.653 に答える