Asp.net MVC在View里动态捆绑压缩引用的js
前言
Asp.net MVC 4以上版本多了BundleConfig.RegisterBundles方法,可以把要捆绑的脚本或样式进行捆绑压缩,以减少客户端的请求次数从而提高了客户端的访问速度。
问题
但世上懒人的数量还是很多,我也是一个,觉得这个方法还不够方便。在实际中,一些小的页面或独立页面,开了一些开源的js库之后,js文件比较多,而且每个页面引用的js又不太一样,如果能不在BundleConfig描述如何捆绑,像传统一样把js拉过来就能自动达到捆绑后的效果,是懒人多想要的结果。正是朝着这个目标,本随笔将实现一个html的扩展方法,来完成这个功能。你只要像传统一样把js拉到view上,改几个字符,就可以达到了效果了,引入的js还是有智能提示的。
调用方法
@Html.BundleScripts(
@<script src="~/Scripts/jquery-1.7.1.min.js"></script>,
@<script src="~/Scripts/login.js"></script>,
@<script src="~/Content/validBox/validBox.js"></script>
)
如上,把要捆绑的js都当BundleScripts的参数就可以了,效果如下:

BundleScripts的实现
/// <summary>
/// 动态捆绑多个脚本
/// </summary>
/// <param name="htmlHelper"></param>
/// <param name="scripts">javscript</param>
/// <returns></returns>
public static IHtmlString BundleScripts(this HtmlHelper htmlHelper, params Func<object, object>[] scripts)
{
if (scripts == null)
{
throw new ArgumentNullException("scripts");
} var inputs = new StringBuilder();
foreach (var script in scripts)
{
inputs.AppendLine(script.Invoke(null).ToString().ToLower());
} var applicationPath = htmlHelper.ViewContext.HttpContext.Request.ApplicationPath;
Func<string, string> fixSrc = (src) => applicationPath == "/" ? "~" + src : src.Replace(applicationPath, "~/"); var srcs = inputs.ToString().Matches(@"(?<=src="").+?\.js(?="")").Select(item => fixSrc(item)).ToArray();
var path = string.Format("~/{0}", Math.Abs(string.Join(string.Empty, srcs).GetHashCode())); if (BundleTable.Bundles.GetBundleFor(path) == null)
{
BundleTable.Bundles.Add(new ScriptBundle(path).Include(srcs));
}
return Scripts.Render(path);
}
注:Matches方法是一个对正则表达式的包装。
提问和思考
你觉得此方法的关键之处在哪里?欢迎提问,我们一起探讨,最好能实现一个比此方法更方便的方法来。
Asp.net MVC在View里动态捆绑压缩引用的js的更多相关文章
- Asp.net MVC Razor视图模版动态渲染PDF,Razor模版生成静态Html
Asp.net MVC Razor视图模版动态渲染PDF,Razor模版生成静态Html 1.前言 上一篇文章我开源了轮子,Asp.net Core 3.1 Razor视图模版动态渲染PDF,然后,很 ...
- Asp.net mvc 中View 的呈现(二)
[toc] 上一节介绍了 Asp.net mvc 中除 ViewResult 外的所有的 ActionResult,这一节介绍 ViewResult. ViewResultBase ViewResul ...
- TransactionScope事务处理方法介绍及.NET Core中的注意事项 SQL Server数据库漏洞评估了解一下 预热ASP.NET MVC 的VIEW [AUTOMAPPER]反射自动注册AUTOMAPPER PROFILE
TransactionScope事务处理方法介绍及.NET Core中的注意事项 作者:依乐祝 原文链接:https://www.cnblogs.com/yilezhu/p/10170712.ht ...
- 返璞归真 asp.net mvc (4) - View/ViewEngine
原文:返璞归真 asp.net mvc (4) - View/ViewEngine [索引页] [源码下载] 返璞归真 asp.net mvc (4) - View/ViewEngine 作者:web ...
- ASP.NET MVC 之View
仅此一文让你明白ASP.NET MVC 之View的显示(仅此一文系列二) 题外话 一周之前写的<仅此一文让你明白ASP.NET MVC原理>受到了广大学习ASP.NET MVC同学的 ...
- ASP.NET MVC 中 View 的设计
1. 前言 感觉有好长时间没有接触View 了,周末闲来无事,翻翻书桌上的书来回顾回顾ASP.NET MVC中View的相关内容. 2. View概述 View 通过应用程序在Action 中返回 ...
- 预热ASP.NET MVC 的View
ASP.NET MVC 的View 预设是Load on Demand(按需加载),也就是说View 第一次要Render 的时候才会去载入跟编译,这个就会造成一个现象,即使Web 应用程式已经完成启 ...
- Asp.Net MVC向视图View传值的三种方法
本文将总结Asp.Net MVC向视图View传值的三种常见的方法: ----------------------------------------------------------------- ...
- ASP.NET MVC 4使用Bundle的打包压缩JS/CSS
打包(Bundling)及压缩(Minification)指的是将多个js文件或css文件打包成单一文件并压缩的做法,如此可减少浏览器需下载多个文件案才能完成网页显示的延迟感,同时通过移除JS/CSS ...
随机推荐
- Linux下使用iostat 监视I/O状态
我们可以使用 sar(1), pidstat(1), mpstat(1), vmstat(8) 来监控 一.安装 yum install sysstat 二.参数解释 FILES /proc/stat ...
- Java NIO入门(二):缓冲区内部细节
Java NIO 入门(二)缓冲区内部细节 概述 本文将介绍 NIO 中两个重要的缓冲区组件:状态变量和访问方法 (accessor). 状态变量是前一文中提到的"内部统计机制"的 ...
- poj 3177 Redundant Paths
题目链接:http://poj.org/problem?id=3177 边双连通问题,与点双连通还是有区别的!!! 题意是给你一个图(本来是连通的),问你需要加多少边,使任意两点间,都有两条边不重复的 ...
- log4j日志优先级导致的不输出日志
在sae部署微信代码的时候,发现它的默认日志很不友好,看起来很费劲,详细看了一下说明发现它可以根据log4j的输出级别而分类输出,就拖了一个log4j的xml文件扔进项目代码,然后部署运行,发现没有日 ...
- mac 免密码登陆服务器
由于mac os 是基于unix的操作系统终端和linux非常类似,所以不用借助类似于windows下的putty 和CRT工具即可远程登陆linux服务器,只需简单地3步即可免密码ssh远程. 1 ...
- 使用EntityFramework6完成增删查改和事务
使用EntityFramework6完成增删查改和事务 上一节我们已经学习了如何使用EF连接数据库,并简单演示了一下如何使用EF6对数据库进行操作,这一节我来详细讲解一下. 使用EF对数据库进行操作, ...
- 多人操作sqlite3数据库冲突问题解决方法
问题描述:sqlite3数据放置在某一台电脑的某个共享文件夹下,操作数据库的应用程序安装在同一局域网下的很多台电脑上,由于存在多人同时使用该应用程序,所以存在多人同时操作数据库的情况.经过测试发现,最 ...
- 合工大OJ 1337 一加二减三
Description 题目描述:给一个串,形如一+二-三,求值 Input 第一行为一个正整数T,表示数据的组数,接下来有T行每行都是一个形如一+二-三的串,一,二,三均为正整数 Output 对于 ...
- 数据结构Java实现02----线性表与顺序表
[声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/4 ...
- Adobe Scout 入门
http://www.adobe.com/cn/devnet/scout/articles/adobe-scout-getting-started.html Adobe Scout 是新一代 Flas ...