将项目的所有脚本和CSS捆绑在一起

Question

我在MVC项目中编写了许多脚本和CSS。

我正在使用捆绑和缩小，我知道可以将它们全部捆绑在一起，如下所示：

bundles.Add(new StyleBundle("~/Content/site/").Include("~/Content/site/*.css"));
bundles.Add(new ScriptBundle("~/bundles/site").Include("~/Scripts/site/*.js"));

问题是我不想一起Render所有脚本和css，在每个视图中都需要一个或两个，我知道我可以手动注册每个脚本/ css，然后可以在每个视图中分别render它们视图：

bundles.Add(new ScriptBundle("~/bundles/script1").Include("~/Scripts/site/script1.js"));
bundles.Add(new ScriptBundle("~/bundles/script2").Include("~/Scripts/site/script2.js"));

然后在一个视图中：

@section scripts{
    @Scripts.Render("~/bundles/script1")
}

在第二个中：

@section scripts{
    @Scripts.Render("~/bundles/script2")
}

我的问题是这是否正确，或者有更好的解决方案。

Answer 1

是的，构建针对视图定制的多个捆绑包是正确的。

请注意，您可以将多个特定的脚本/样式添加到包中：

var commonJsBundle = new ScriptBundle("~/bundles/Common/Js");
commonJsBundle.Include("~/Scripts/jquery-{version}.js");
commonJsBundle.Include("~/Scripts/jquery-ui-{version}.js");

@Scripts.Render("~/bundles/Common/Js")

因此，您不必为每个单独的脚本都捆绑在一起，而是将页面（或区域）的所有自定义脚本捆绑在一起。

PS：正如Stefan所指出的，在捆绑包大小和浏览器下载时支持的并行连接数量之间需要权衡。 因此，使用许多小捆绑包会使页面加载速度变慢。 浏览器到同一域的最大并发连接数