3

私のページには次のコードがあります。

<script src="/Scripts/common/layout/addAccessControls.js"></script>
<script src="/Scripts/common/layout/addAjaxControls.js"></script>
<script src="/Scripts/common/layout/addBodyControls.js"></script>
<script src="/Scripts/common/layout/addContentControls.js"></script>
<script src="/Scripts/common/layout/addThemeControls.js"></script>
<script src="/Scripts/common/layout/hashClick.js"></script>
<script src="/Scripts/common/layout/setSideBar.js"></script>

すべてのスクリプトが次々に読み込まれるのは正しいですか?もしそうなら、一度に複数のロードを行うことができる方法はありますか?

質問を少し明確にするためだけに。私はこれらを縮小して連結することができます、そして多分それらはすでに縮小されて連結されています:-)私が見つけたいのは、これらの正確なファイルを与えられたロードプロセスです。次々とファイルですか。ブラウザーは並列ロードに対して何かを行いますか?ありがとう

4

10 に答える 10

3

さて、最初の問題は、スクリプトが次々にロードされることです。2番目の問題はリクエストの数です。リクエストが多いほど、時間がかかります。

最も簡単なアプローチは、サーバー側のファイルを1つのファイルに連結して、.jsリクエストが1つだけ残るようにすることです。これは物事をスピードアップします。

スクリプトをさらに縮小すると、処理も高速化されます。

サーバー側で使用するフレームワークに応じて、これを行う方法についてさまざまな解決策があります。たとえば、Node.jsの場合、実行時にPilerを使用してこれを行うことができます。

または、もちろん、ビルドジョブを介して、それぞれ手動でいつでもこれを行うことができます。

PS:もちろん、他のメカニズムを使用してスクリプトファイルをロードすることもできます。たとえば、スクリプトタグを動的に追加して、ロードを並列化することができます。詳細については、 http://blogs.msdn.com/b/kristoffer/archive/2006/12/22/loading-javascript-files-in-parallel.aspxを参照してください。

于 2012-09-27T11:05:57.907 に答える
3

asyncコマンド(HTML5)を使用できます:

<script async src="slow.js"></script>

動的スクリプトのロード:

var script = document.createElement("script");
script.async = false;
script.src = url;
document.head.appendChild(script);

HTML5非同期スクリプト

于 2012-09-27T11:13:50.083 に答える
1

はい、それらは次々にロードされ実行されます。そして、あなたはそれを変えることはできません。

ただし、パフォーマンスが心配な場合は、ダウンロードプロセスが異なり、ブラウザによって並列化される可能性があることを知って喜んでもらえるかもしれません。

Chromeデベロッパーツールの[ネットワーク]タブを開くと、Chromeで表示できます。

合計時間を短縮したい場合、最善の解決策は、すべてのファイルを1つに連結することです(可能であればそれらを縮小しますが、重要な操作は連結です)。

于 2012-09-27T11:04:32.323 に答える
1

このようなツールを使用して、それらを連結および縮小できます。Macをお持ちの場合は、CodeKitと呼ばれるこのプロセスを自動化する素晴らしいアプリもあります

于 2012-09-27T11:06:19.527 に答える
1

これはスクリプトのブロックです。そのブラウザ機能。異なるブラウザは、異なる数のファイルを並行してダウンロードします。スクリプトがロードされ、次々に実行されます。これらの記事は、SteveSoudersとNicolasZakasが読むことができます。これはあなたを助けるかもしれません。

http://www.stevesouders.com/blog/2009/04/27/loading-scripts-without-blocking/ http://www.nczonline.net/blog/2009/06/23/loading-javascript-without-ブロッキング/

于 2012-09-27T11:13:59.293 に答える
0

ブラウザとダウンロードする他のファイルの数(画像など)によっては、複数のJavaScriptファイルを並べた順序で同時にダウンロードする場合があります。

これは、FirebugまたはChromeの開発者ツールを使用して確認できます。ブラウザは常に複数のファイルをロードしますが、同時ダウンロードの最大数は使用しているブラウザとバージョンによって異なります。

于 2012-09-27T11:07:09.807 に答える
0

あなたの質問がタイトルに関連している場合(JavaScriptの読み込み時間を短縮するにはどうすればよいですか?)、良いアプローチは次のとおりです。

  • コードを確認し、必要に応じて削除して最適化します
  • すべてのファイルを(ロード順に)連結します
  • コードを縮小する
  • gzip圧縮で単一ファイルを提供する
  • 不要なリクエストを回避するためにキャッシュを利用する
于 2012-09-27T11:07:15.587 に答える
0

ブラウザに応じて、異なる量のファイルが並行してロードされます。これらは並行して実行する必要がありますが、最良の結果を得るには、のようなイベントハンドラーをページに添付してくださいonload

ファイルを連結すると、サーバーのラウンドトリップが減り、ファイルが変更されない場合の読み込み時間が短縮されます。キャッシュマニフェストを使用したり、AJAXで3次スクリプトを遅延ロードしたりすることもできます。

于 2012-09-27T11:07:35.763 に答える
0

この手法は、既存のコードに適した手法で試すことができます...

1. Use minify version of JS code
2. Add only one external JS file (copy all content to one)
3. Use cookie less domain
于 2012-09-27T11:07:38.490 に答える
0

単一のファイルを取得するために、ファイルを本番環境にプッシュするときにファイルをマージすることができます[そしてそれらを最小化する] ...このようにして、リクエストのハンドチェックとその間のすべてのステップを保存します...

于 2012-09-27T11:09:08.533 に答える