2013-09-25 11 views
10

Ich bin ein bisschen verwirrt auf die richtige Art und Weise zu bündeln Skript-und Stil-Dateien. Derzeit sieht mein BundleConfig.cs wie folgt aus:Richtiger Weg, in MVC4 zu bündeln

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
      "~/Scripts/jquery-{version}.js")); 

bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
      "~/Scripts/jquery-ui-{version}.js")); 

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
      "~/Scripts/jquery.unobtrusive*", 
      "~/Scripts/jquery.validate*")); 

// Use the development version of Modernizr to develop with and learn from. Then, when you're 
// ready for production, use the build tool at http://modernizr.com to pick only the tests you need. 
bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
      "~/Scripts/modernizr-*")); 

bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css")); 

bundles.Add(new ScriptBundle("~/bundles/knockout").Include(
      "~/Scripts/knockout-{version}.js", 
      "~/Scripts/knockout-{version}.debug.js", 
      "~/Scripts/knockout-sortable.js")); 

bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
      "~/Content/themes/base/jquery.ui.core.css", 
      "~/Content/themes/base/jquery.ui.resizable.css", 
      "~/Content/themes/base/jquery.ui.selectable.css", 
      "~/Content/themes/base/jquery.ui.accordion.css", 
      "~/Content/themes/base/jquery.ui.autocomplete.css", 
      "~/Content/themes/base/jquery.ui.button.css", 
      "~/Content/themes/base/jquery.ui.dialog.css", 
      "~/Content/themes/base/jquery.ui.slider.css", 
      "~/Content/themes/base/jquery.ui.tabs.css", 
      "~/Content/themes/base/jquery.ui.datepicker.css", 
      "~/Content/themes/base/jquery.ui.progressbar.css", 
      "~/Content/themes/base/jquery.ui.theme.css")); 

bundles.Add(new StyleBundle("~/bundles/BootStrapcss").Include(
      "~/BootStrap/css/bootstrap.css", 
      "~/BootStrap/css/bootstrap-fileupload.css")); 

bundles.Add(new StyleBundle("~/bundles/BootStrap").Include(
      "~/BootStrap/tpg-main.css", 
      "~/BootStrap/tpg-internal.css")); 

bundles.Add(new ScriptBundle("~/bundles/BootStrapjs").Include(
      "~/BootStrap/js/bootstrap-fileupload.js", 
      "~/BootStrap/js/bootstrap.js")); 

BundleTable.EnableOptimizations = true; 

Sollte mit bleiben, was ich habe, oder bündeln alle meine Skript-Dateien in eine ScriptBundle, und alle meine Stile in ein StyleBundle? Ich möchte die bestmögliche Leistung erzielen.

Antwort

14

Wenn Sie immer alle Dateien verwenden, dann gehen Sie weiter und stecken Sie sie in zwei Bündel; eine für das Javascript und eine für die Stile. Weniger Bündel bedeutet weniger Anforderungen an den Server, um die Ressourcen abzurufen, was zu einer geringfügig besseren Leistung beim ersten Treffer führen kann; Anschließend werden die Dateien vom Browser zwischengespeichert.

Wenn Sie nicht immer alle Dateien verwenden, ist es sinnvoller, sie in mehrere Pakete aufzuteilen.

+6

Um seinen Punkt zu verdeutlichen, müssen Sie Knockout möglicherweise nur auf einer oder zwei Seiten verwenden, nicht auf Ihrer gesamten Website. Daher sollten Sie es nicht zusammen mit allem anderen bündeln, da es auf Seiten geladen wird, auf denen es nicht verwendet oder benötigt wird. –

+0

@Moozhe Ja danke, ich hätte das ein wenig mehr der Vollständigkeit halber erweitern sollen. – asymptoticFault

+0

Wie jQery bündeln, validieren und modernisieren in einem? –

Verwandte Themen