正确的方法在MVC4捆绑 [英] Correct way to bundle in MVC4

问题描述

我有点困惑的捆绑脚本和样式文件的正确方法。目前，我的BundleConfig.cs看起来是这样的：

I'm a bit confused on the correct way to bundle script and style files. Currently, my BundleConfig.cs looks like this:

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;

应该留与我有什么，还是我的所有脚本文件捆绑成一个 ScriptBundle ，和我所有的样式合并到一个 StyleBundle ？我想达到最佳的性能。

Should stay with what I have, or bundle all my script files into one ScriptBundle, and all my styles into one StyleBundle? I want to achieve the best performance possible.

推荐答案

如果你总是使用所有比继续前进，在两束坚持他们的文件;一个用于javascript和一个用于样式。更少的包意味着更少的请求到服务器来获取资源，这可能会导致对先打稍微更好的性能;随后，文件将被浏览器高速缓存。

If you are always using all of the files than go ahead and stick them in two bundles; one for the javascript and one for the styles. Fewer bundles means fewer requests to the server to fetch the resources, which may result in marginally better performance on the first hit; subsequently the files will be cached by the browser.

如果你并不总是使用的所有文件比它更有意义，打破他们出到更多捆绑。

If you are not always using all of the files than it makes more sense to break them out into more bundles.

这篇关于正确的方法在MVC4捆绑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！