基于Asp.Net MVC4 Bundle捆绑压缩技术的介绍

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了基于Asp.Net MVC4 Bundle捆绑压缩技术的介绍，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含3736字，纯文字阅读大概需要6分钟。

内容图文

很高兴，最近项目用到了Asp.Net MVC4 + Entity Framework5，发现mvc4加入了Bundle、Web API等技术，着实让我兴奋，以前是用第三方的，这里主要说说Bundle技术。

很多大网站都没有用Bundle技术造成很多资源浪费与性能的牺牲，别小瞧 用上了你会发现他的好处：

将多个请求捆绑为一个请求，减少服务器请求数

 没有使用Bundle技术，debug下看到的是实际的请求数与路径

 

使用Bundle技术，并且拥有缓存功能
调试设置为Release模式并按F5或修改web.config，就可以看到合并与压缩的效果

压缩javascript，css等资源文件，减小网络带宽，提升性能

后台配置

　　MVC4在架构上有些变动，简化了原来的Global.asax，增加了一些静态的配置文件在App_Start下面，留意下BundleConfig.cs，顾名思义是Bundle的配置，所有它的配置在这里进行就可以了，当然也可以单独的配置文件。

代码如下:

public class BundleConfig { // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725 public static void RegisterBundles(BundleCollection bundles) { 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 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")); } }  
这里大家可以按模块化去配置，我们看到的下面的Url对应的就是上面的bundles.Add(...) 所增加的js、css的virtualPath
需要注意的是不同virtualPath 增加的相同的资源文件，会被重复加载！

前台调用
 对于公共的资源文件，通常我们都会放到_Layout.cshtml (webform中的母板页) 文件中

 　　Script文件引用：@Scripts.Render(virtualPath[,virtualPath1][,virtualPath2][,...])
　　 CSS文件引用：  @Styles.Render(virtualPath[,virtualPath1][,virtualPath2][,...])
 代码如下:

@Styles.Render("~/Content/css") @Styles.Render("~/Content/themes/base/css") 
...@Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/jqueryui") @RenderSection("scripts", required: false)  
正则匹配需要的，过滤不需要的
 代码如下:
bundles.IgnoreList.Clear(); bundles.IgnoreList.Ignore("*.debug.js"); bundles.IgnoreList.Ignore("*.min.js"); bundles.IgnoreList.Ignore("*-vsdoc.js"); bundles.IgnoreList.Ignore("*intellisense.js"); bundles.Add(new ScriptBundle("~/bundles/jquery", jqueryCdn).Include( "~/Scripts/jquery-{version}.js")); //匹配jquery版本 　　 bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include( "~/Scripts/jquery.unobtrusive*", //匹配文件名前缀为jquery.unobtrusive "~/Scripts/jquery.validate*")); ...  
使用CDN
 代码如下:
bundles.UseCdn = true; //使用CDN string jqueryCdn = "http:deom.jb51.net/jslib/jquery/jquery-1.7.1.min.js"; bundles.Add(new ScriptBundle("~/bundles/jquery", jqueryCdn).Include( "~/Scripts/jquery-{version}.js"));  
当cdn服务器挂了或不能访问了，这里就会选择本地的资源文件，debug下mvc 会让我们看到他原来的面具，这点非常好利于我们调试。　　
　　　
 
            
            


           
                
                                                

内容总结

以上是互联网集市为您收集整理的基于Asp.Net MVC4 Bundle捆绑压缩技术的介绍全部内容，希望文章能够帮你解决基于Asp.Net MVC4 Bundle捆绑压缩技术的介绍所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

---