3

HTMLとJavaScriptを使用したプロジェクトに取り組んでいます。プロジェクトで多数のJavaScriptファイルを使用しています。Webプロジェクト内のJavaScriptファイルの数によって引き起こされる副作用があるかどうか知りたいですか？（効率または速度の観点から）。

4

4 に答える 4

4

Web プロジェクトに JavaScript ファイルがないことによる影響はありますか? 効率や速度の面で。

つまり、すべての JavaScript をscriptHTML 内のインライン タグに埋め込むことに関連する速度のコストはありますか? JavaScript の量に依存します。

それはトレードオフです：

  • すべての JavaScript を HTML ファイルに入れると、各 HTML ファイルに JavaScript を複製して、それぞれを大きくする必要があります。大量のスクリプトの場合、各 HTML ファイルが重くなり、(コードではなく)コンテンツを変更すると、ユーザーはそのコードをすべて再ダウンロードする必要があります。

  • JavaScript を別のファイルに入れると、ページが読み込まれるときに追加の HTTP 要求が発生しますが、これは JavaScript ファイルがまだキャッシュにない場合に限られます — すべての HTML ファイルはそれだけ小さくなります。

したがって、ほとんどの場合、かなりの量のコードがある場合は、別の JavaScript ファイルを使用し、キャッシュ ヘッダーを正しく設定して、ブラウザーが毎回別の HTTP 要求を送信する必要がないようにすることをお勧めします。たとえば、JavaScript ファイルが長期間有効であることをブラウザに伝えるようにサーバーを構成すると、If-Modified-SinceHTTP 要求さえ実行されなくなります。次に、JavaScript を更新する必要がある場合は、ファイル名を変更し、HTML で新しいファイルを参照します。

これは、重要で重要なトピックであるキャッシング制御への1 つのアプローチにすぎません。しかし、あなたはその考えを理解します。分離することで、そのようなオプションが得られ、初期コストがかなり低くなります (キャッシュにロードするための追加の HTTP 要求が 1 つ必要です)。しかし、非常に少量のコードではやり過ぎになる可能性があります。

于 2012-11-09T11:18:25.097 に答える
3

実行に関しては、持っている JavaScript ファイルの数によって大きな違いはないと思います。ただし、多数の JavaScript ファイルは、ページの読み込み時に多数のリクエストを必要とするため、ページの読み込みにかかる時間に確実に影響を与える可能性があります。

これを処理するには少なくとも 2 つの方法があり、どちらの方法を使用するかは状況によって異なります。

すべてのファイルを 1 つにまとめる:

サーバーへのリクエストごとに、ページの読み込みにかかる時間が長くなります。このため、すべてのスクリプトを含む 1 つのファイルに JavaScript ファイルをバンドルして縮小することをお勧めします。これにより、すべての JavaScript をロードするための 1 つのリクエストのみが必要になります。

ただし、場合によっては、たとえば JavaScript が非常に多い場合、その 1 つのファイルが非常に大きくなる可能性があり、1 つのファイルを読み込むだけでも、そのファイルの読み込みに時間がかかり、ページの読み込みが遅くなることがあります。その場合、オプション 2 を検討する価値があるかもしれません。

必要に応じてモジュールをロードします。

たとえば、サイトに多数の JavaScript があり、各ページですべてのコードのいくつかのモジュールしか使用されていない場合など、条件付き読み込みを使用するとパフォーマンスが向上する可能性があります。その場合、コードを個別のモジュールに保持し、各モジュールを個別のファイルに入れます。その後、各ページに必要なモジュールのみをロードできます。

于 2012-11-09T11:18:38.747 に答える
0

JavaScript ファイルの数が多いと、ページの読み込みが遅くなる可能性がありますが、すべてが正しくキャッシュされていれば問題はありません。キャッシュから大量のファイルを要求するブラウザーは、レンダリング前に少し遅くなりますが、約 0.001 秒です。

Crowders の投稿では、正しくキャッシュしている場合はファイル名を変更して参照する必要がありますが、Web プロジェクトに優れたキャッシュ メカニズムを実装している場合は、次のようなクエリ文字列で JavaScript を参照する方が簡単です。

scripts/foo.js?version=1

ソフトウェアのバージョン番号を使用するため、新しいリリースごとにクエリ文字列を変更し、すべてのクライアントが新しいスクリプト ファイルを取得します。

リリースするたびに、すべての JavaScript をバンドルして縮小化するのが最善ですが、小規模なプロジェクトではあまり役に立ちません。

于 2012-11-09T11:21:57.987 に答える
0

これは、含める JavaScript ファイルに完全に依存します。当然のことながら、JavaScript ファイルをインクルードする場合は、ブラウザによって読み込まれる必要があります。これがどれほど負担になるかは、ファイルのサイズによって異なります。一般的に言えば、すべてのコードを 1 つのファイルにまとめることで、スクリプト ファイルの個別の要求の数を最小限に抑えることが有利です。

于 2012-11-09T11:18:48.463 に答える