JavaScriptのバンドルとロードのためのより良い方法を見つける

Question

私はasp.net mvcを使用しています。5.各ページが異なるファイルセットを必要とするため、以下のようなサーバー上でさまざまなバンドルを作成しました。

 bundles.Add(new Bundle("~/scripts/external/4") 
     .Include(
     "~/Static/Scripts/External/jquery-2.1.3.min.js", 
     "~/Static/Scripts/External/jquery-ui.min.js", 
     "~/Static/Scripts/External/bootstrap.min.js", 
      //and 13 more files 
     )); 

     bundles.Add(new Bundle("~/scripts/admin/external/1") 
     .Include(   
     "~/Static/Scripts/External/jquery-2.1.3.min.js", 
     "~/Static/Scripts/three.min.r76.js",     
     "~/Static/Scripts/app.min.js", 
     //and 15 more files 
    )); 

ご覧のとおり、いくつかのjsファイルは相互参照できないので（時には4,5の大きなファイルが共通する場合があります）、繰り返し表示されています。

クライアント側でlab.jsを使用してこれらのバンドルをロードしています。

問題がバンドルにあるので、Requirejsはここでは動作しません。ファイルをバンドルしてブロックせずにロードするための推奨アプローチは何ですか？

Answer 1

私はアプリケーションの構造に大きく依存すると思います。バンドルがたくさんある理由は何ですか？使用されていないページにスクリプトを読み込むと問題はありません。

通常、ほとんどのベンダースクリプト（例のjQueryなど）は、サイトのほとんどのページで必要とされるようにグループ化されています。次に、別のグループのスクリプトを必要とするサイトのセクションがある場合は、これらをまとめてグループ化します。このようにして、それらは一度フェッチされ、その後キャッシュされ、キャッシュから取り出されます。多くの異なるバンドルを持つことは、ファイルが一意でキャッシュされないことを意味します。私は多くの小さなファイルよりもいくつかの大きなファイルを持つ方が良いと思います。

私はASP.NETのバンドリングを好まず、gulpやgruntなどのタスクランナーを使用してバンドルを作成していますが、ASP MVCでも同じ設定を行うことができます。

しかし、HTTP/2物事が変更される可能性：Why bundle optimizations are no longer a concern in HTTP/2

Answer 2

を私は1つのリストにあるすべてのライブラリをロードし、個別の値を取得すると思う最良の方法である：

List<string> bundlesList = new List<string>(); 
bundlesList.Add("~/Static/Scripts/External/jquery-2.1.3.min.js"); 
bundlesList.Add("~/Static/Scripts/External/jquery-2.1.3.min.js"); 
bundlesList.Add("~/Static/Scripts/External/jquery-ui.min.js"); 
bundlesList.Add("~/Static/Scripts/External/bootstrap.min.js"); 
bundlesList.Add("~/Static/Scripts/External/bootstrap.min.js"); 

IEnumerable<string> ids = (from x in bundlesList select x).Distinct(); 

bundles.Add(new ScriptBundle("~/bundles").Include(ids.ToArray())); 

私はこの作品を願っています:)