MVC4增加了一些新功能，接下来，我们来研究下MVC4中的新增功能，我们在新建一个MVC4项目的时候，会发现在项目下多出了一个应用程序_开始文件夹，文件夹下面有四个文件、BundleConfig.cs、FilterConfig.cs、RouteConfig.cs、WebApiConfig.cs、其中BundleConfig.cs文件就是我们这一节要讲的的文件。众所周知，浏览器在向服务器发送请求的时候，请求的文件连接数量是有限制的。使用BundleConfig可以将多个文件请求和并成一个请求，去除文件中的一些注释，空白，压缩文件的大小，自动合并压缩优化代码，缩短响应时间，提高网页速度，起到优化网站的作用。1.定义分组创建MVC4项目后，我们会在global.asax文件中的应用程序_开始()方法中看到如下代码，起到注册作用BundleConfig .注册捆绑包(BundleTable .捆绑包);BundleConfig.cs代码：

公共类BundleConfig { //有关集束的详细信息，请访问http://go.microsoft.com/fwlink/?LinkId=254725公共静态无效注册包(BundleCollection捆绑包){捆绑包.添加（新的脚本包(' ~/bundle/jquery ').包括(' ~/Scripts/jquery-{version}).js’)；捆绑包。添加（新的脚本包(' ~/bundles/jqueryui ').包括(' ~/Scripts/jquery-ui-{version}).js’)；捆绑包。添加（新的脚本包(' ~/bundles/jqueryval ').包括(' ~/Scripts/jquery。包括* '，' ~/Scripts/jquery。验证* ')；//使用Modernizr的开发版本进行开发和了解信息。然后，当你做好//生产准备时，请使用http://modernizr.com上的生成工具来仅选择所需的测试捆绑包。添加（新的脚本包(' ~/bundle/modernizr ').包括(' ~/Scripts/modernizr-*)；捆绑包。添加（新的StyleBundle('~/Content/css ').包含(' ~/内容/网站。CSS ')；捆绑包。添加（新的样式表(' ~/内容/主题/基础/CSS ').包括(' ~/Content/themes/base/jquery。ui。核心。CSS '，' ~/Content/themes/base/jquery。ui。可调整大小。CSS '，' ~/Content/themes/base/jquery。ui。选中。CSS '，' ~/Content/themes/base/jquery。ui。手风琴。CSS '，' ~/Content/themes/base/jquery。ui。CSS '，' ~/Content/themes/base/jquery。ui。按钮。CSS '，' ~ '} } BundleCollection是一个集合，用于将绑定规则添加到集合中，使用增加方法。捆绑包。添加(新的ScriptBundle('~/bundles/jquery ').包括(' ~/Scripts/jquery-{version}).js’)；新的脚本包(~/bundle/jquery)定义一个分组名称包括表示这个分组下具体包括的文件版本。参数代表版本号，*代表所有，这两个是可以理解为通配符。以上代码表示创建一个~/bundle/jquery分组，该分组指向的文件为剧本文件夹下的jquery-1.7.1.js文件。如果剧本文件夹下有jquery-1.7.1.js，jquery-1.6.1.js，则会指向这两个文件。同样，捆绑包。添加（新的StyleBundle('~/Content/css ').包含(' ~/内容/网站。CSS ')；表示创建了一个~/内容/css分组，指向~/Content/site.css文件.2.使用分组分组已经定义好，我们接下演示怎样使用。如果在页面中使用脚本，可以使用@脚本。呈现(~/bundle/jquery)方法，参数为分组名称如果在页面中使用css，可以使用@ Styles .渲染(' ~/内容/css ')方法，参数为分组名称。可以看下视图文件夹下的碎片文件夹的_Layout.cshtml文件

！DOCTYPE html html head meta charset=' utf-8 '/meta name=' viewport ' content=' width=device-width '/title@ViewBag.Title/title @ Styles。render(' ~/Content/CSS ')@ scripts . render(~/bundles/modernizer ')/head body @ render body()@ scripts . render(~/bundles/jquery ')@ render section(' scripts '，required: false)/body/html来运行项目

3.合并请求接下来，我们可以通过分组将请求的多个文件合并成一个请求，这可以通过以下两种方法来实现：1)将web.config中的编译调试设置为false编译调试=' false '目标框架=' 4.5'/2)添加Bundle Table。EnableOptimizations=在BundleConfig中方法的末尾为true再次运行页面，可以看到下面的代码src='http:/bundles/jquery？v=wbuqtimtmgl 9 HJ 0 hackmerbd 8 com 3 uaneakip4udekfm1 '？分组名称在它的前面，后面是通过合并多个文件生成的哈希代码

4.比较效果我们用firebug在Firefox下检查合并前后的比较效果，可以比较请求的文件大小和时间。差别还是挺大的。合并前：

压缩和合并：

注：默认情况下，BundleTable。捆绑包将过滤掉带有这些后缀的文件，intellisense.js、-vsdoc.js、debug.js、min.js和min.css当加载带有这些后缀的文件时，它们将是空白的。可以通过以下方式删除对这些文件的过滤限制

BundleTable。bundles . ignore list . clear()；BundleTable。bundles . ignore list . ignore(' . min . js '，OptimizationMode。始终)；//BundleTable。bundles . ignore list . ignore('-vsdoc . js '，OptimizationMode。始终)；//BundleTable。bundles . ignore list . ignore(' . debug . js '，OptimizationMode。始终)；

我们通过分组将多个请求文件合并成一个请求，压缩文件大小，自动合并压缩优化后的代码，缩短响应时间，提高网页速度。希望这篇文章能帮助你更好的优化网站。