एमवीसी 4

Question

में बंडल करने का सही तरीका मैं स्क्रिप्ट और स्टाइल फाइलों को बंडल करने के सही तरीके से थोड़ा उलझन में हूं। वर्तमान में, मेरी BundleConfig.cs इस तरह दिखता है:

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; 

, और एक StyleBundle में मेरी सभी शैलियों मैं क्या है के साथ रहने या एक ScriptBundle में मेरे सभी स्क्रिप्ट फ़ाइलें बंडल चाहिए? मैं सबसे अच्छा प्रदर्शन संभव हासिल करना चाहता हूं।

Answer 1

यदि आप हमेशा आगे बढ़ने से पहले सभी फ़ाइलों का उपयोग कर रहे हैं और उन्हें दो बंडलों में चिपकाएं; एक जावास्क्रिप्ट के लिए और शैलियों के लिए एक। कम बंडल का अर्थ संसाधनों को लाने के लिए सर्वर से कम अनुरोध है, जिसके परिणामस्वरूप पहली हिट पर मामूली बेहतर प्रदर्शन हो सकता है; बाद में फ़ाइलों को ब्राउज़र द्वारा कैश किया जाएगा।

यदि आप हमेशा सभी फ़ाइलों का उपयोग नहीं कर रहे हैं, तो इससे अधिक बंडलों में उन्हें तोड़ने के लिए और अधिक समझदारी होती है।