缩小和组合.net中的文件

时间:2010-12-02 18:39:54

标签: c# javascript css minify

我正在考虑围绕我的javascript / css实现一些性能优化。特别是寻求实现这种缩小和组合。我正在开发.net / c #web应用程序。

我有几个选择,并在每个方面寻找反馈:

第一个是我遇到Chirpy这个聪明的工具,通过视觉工作室结合,缩小等 - > http://chirpy.codeplex.com/这是一个视觉工作室添加,但由于我在团队环境中,这个工具并不理想。

我的下一个选项是使用Msbuild任务(http://yuicompressor.codeplex.com/)来缩小文件并将它们组合起来(可能从xml文件中读取需要组合的内容)。虽然这对缩小罚款很有用,但我担心的是我必须保持必须合并的东西,这可能是一件令人头疼的问题。

第3个选项是使用msbuild任务仅用于缩小,在运行时使用一些帮助程序类,在每页的基础上组合文件。这将合并文件,为其命名并为其添加版本。

我可以考虑其他任何选择吗?我对最后一个选项的关注是它可能有性能问题,因为我必须从本地驱动器打开文件,读取其内容然后合并文件。这在运行时很多处理。我看的是像Squishit这样的东西 - https://github.com/jetheredge/SquishIt/downloads这会在运行时缩小文件,但我会在编译时看一下这个。

所以对我的方法的任何反馈都会很棒吗?如果第三种选择不会导致性能问题,我就会引领它。

7 个答案:

答案 0 :(得分:11)

我们已经完成了与几个ASP.NET Web应用程序类似的操作。具体来说,我们使用Yahoo Yui compressor,它具有您可以在应用程序中引用的.NET库版本。

我们采用的方法是在运行时生成必要的合并/缩小文件。我们将所有这些逻辑包装到ASP.NET控件中,但根据您的项目,这不是必需的。

  • 第一次对页面发出请求时,我们会处理包含的JS和CSS文件列表。在一个单独的线程中(所以原始请求会毫不拖延地返回)然后我们将包含的文件合并在一起(1代表JS,1代表CSS),然后应用Yui压缩器。
  • 然后将结果写入磁盘以便将来快速参考
  • 在后续请求中,页面首先查找缩小版本。如果找到,它只是为那些服务。如果没有,它会再次经历这个过程。

正如一些锦上添花:

  • 出于调试目的,如果存在查询字符串?debug = true,则忽略合并/缩小的资源,而是提供原始的单个文件(因为它可能很难调试优化的JS)

我们发现这个过程非常好用。我们将它构建到一个库中,这样我们所有的ASP.NET站点都可以利用它们。如果每个页面具有不同的依赖关系,那么构建后的脚本会变得复杂,但运行时可以很容易地确定这一点。而且,如果有人需要快速修复CSS文件,他们可以这样做,删除文件的合并版本,并且该过程将自动重新开始,而无需使用MSBuild或NAnt进行后期构建处理。

答案 1 :(得分:7)

RequestReduce为在运行时组合和缩小javascript和css提供了一个非常好的解决方案。它还会尝试精灵您的背景图像。它缓存已处理的文件,并使用自定义ETag和远期标头为它们提供服务。 RequestReduce使用响应过滤器来转换内容,因此基本功能不需要代码或配置。它可以配置为在Web场环境中工作,并跨多个服务器同步内容,并且可以配置为指向CDN。它可以在http://www.RequestReduce.com或通过Nuget从Visual Studio下载。该来源位于https://github.com/mwrock/RequestReduce

答案 2 :(得分:4)

你听说过Combres了吗? 转到:http://combres.codeplex.com并查看

它在运行时缩小了你的CSS和JS文件,这意味着你可以更改任何文件并上传它,客户端做的每个请求都会缩小它。 你要做的就是添加你想压缩到combres XML文件中的列表的文件,然后从你的页面/母版页调用列表。

如果您使用的是VS2010,可以使用NuGet轻松地将其安装到您的项目中 这是Combres NuGet链接:http://combres.codeplex.com/wikipage?title=5-Minute%20Quick%20Start

答案 3 :(得分:2)

几年前我做了一个非常好的解决方案,但我没有留下来源。解决方案是针对webforms,但它应该可以正常工作将其移植到MVC。我会尝试用一些简单的步骤来解释我的所作所为。首先,我们需要注册脚本,然后我们编写了一个特殊的控制器。当控制器被渲染时,它做了三件事:

  1. 最小化所有文件,我认为我们使用了YUI压缩
  2. 合并所有文件并存储为字符串
  3. 计算组合文件字符串的哈希值,并将其用作虚拟文件名。您将组合文件的字符串存储在服务器上的缓存字典中,并将哈希值作为键,呈现的html需要指向“脚本”所在的特殊文件夹。
  4. 下一步是实现一个特殊的HttpHandler来处理特殊文件夹中的文件请求。当对该特殊文件夹发出请求时,您在缓存的字典中进行查找并返回字符串。

    这个的一个非常好的功能是返回的脚本始终有效,因此用户永远不必要求您更新脚本。原因是当您对任何脚本文件进行更改时,哈希值将更改,客户端将要求新脚本。

    您也可以将此用于css文件,没有任何问题。我重新编程使其可配置,以便您可以关闭合并文件,最小化文件,或者如果您想进行一些调试,只需从过程中排除一个文件。

    我可能错过了一些细节,但实施起来并不难,结果很好。

    更新:我已经为MVC实施了一个解决方案,并在nuget上发布了该解决方案,并在github上提供了源代码。

答案 4 :(得分:2)

Microsoft’s Ajax minifier作为缩小工具出奇地好。我写了一篇关于组合文件和在javascript和样式表处理程序中使用minifier的博客文章:

http://www.markistaylor.com/javascript-concatenating-and-minifying/

答案 5 :(得分:0)

在运行时组合文件是值得的,以避免同步新版本。但是,一旦以编程方式组合它们,就将它们缓存到磁盘。然后,每次获取文件时运行的代码只需要在提供缓存版本之前检查文件是否未更改。

如果它们已更改,则压缩代码可以作为一次性运行。 虽然会有轻微的性能成本,但您也可以从较少的文件请求中获得性能优势。

这是Minify工具用来压缩JS / CSS的方法,这对我来说非常有用。它只是Linux / PHP,但你也可能会有更多的想法。

答案 6 :(得分:0)

我需要一个在.NET 2.0 Web应用程序上结合/缩小CSS / JS的解决方案,而SquishIt和我发现的其他工具不兼容.NET 2.0,我创建了自己的解决方案,使用类似于SquishIt的语法但是与.NET 2.0兼容。因为我认为其他人可能会发现它很有用,我把它放在Github上。您可以在此处找到它:https://github.com/AlliterativeAlice/simpleyui