使用 Asp.Net 进行 CSS/JS GZip 压缩

Question

我当前位于托管虚拟服务器上，我想为我的 Asp.Net 3.5 站点启用 GZip 压缩，我该如何开始？

我尝试过使用“打包”JS 文件，但它们不起作用，我假设这是因为它们没有正确处理......？

Answer 1

GZIP 应该由 IIS 处理，您运行的 IIS 版本是什么？

客户端负责向服务器请求 GZiped 版本。 服务器将寻找两件事，请求是http 1.1，以及Accept-Encoding: gzip 的标头。 查找这些标头的一个简单方法是使用 firebug

IIS6 - GZip 可以通过以下方式启用iis 管理单元。 Microsoft MSDN 主题在使用 IIS6 的 Gzip 上

IIS7 - 可以使用 httpCompression xml 标记通过 web.config 启用 GZip Nick Berardi 的让 IIS 7 压缩 JavaScript

通过缩小和打包 javascript 文件，您可以通过删除空格和缩短变量名称来减少 JavaScript 的总大小。

Answer 2

我首选的方法是使用 YUI Compressor 之类的压缩工具并制作它构建过程的一部分（缩小后，压缩比不会那么高。或者您可以同时使用两者。重点是您不应该错过下面给出的更大的性能问题）。

IIS 压缩的主要问题之一是它没有将所有 JS/CSS 文件打包到一个文件中。 因此，如果您的网站有 7 个 JS 文件和 20 个 CSS（令人惊讶的是，这很常见），则需要 27 个 HTTP 往返才能获取您的数据。 对于共享主机的人来说，编写一个 HTTP 处理程序来执行此操作是一个好主意。

一个简单的构建算法是在 JS/CSS 根目录中有一个 make 文件。

If(build.config == release) {
Add your js file in order to the make files.
    e.g. jQuery.js jQuery.form.js  jQuery.container.js custom.js 
Split and pass it as params to YUI
Compress
O/P to site.js 
Delete all the above files.
}

在发布模式下，页面管理员应该只引用 site.js

编辑：这是一个 链接以集成 YUI 和 nant。
编辑：Justin Etheredge 发布了一个很棒的工具来组合和压缩 css/js 文件，名为 SquishIt。

Answer 3

您还可以使用代码对脚本进行 GZip。 它的工作方式是使用 ASP.NET 页面传递压缩文件以及正确的标头（告诉浏览器该流已压缩）。 我写了一篇文章，介绍如何利用 GZip 压缩以及缩小（使用 YUI）和捆绑脚本（减少到服务器的往返次数），您可以在 http://www.codeproject.com/KB/custom-controls/smartinclude.aspx

Answer 4

我一直在使用一个方便的小型服务器控件来缩小 CSS，称为 StyleManager。 它在底层使用 YUI 压缩机。

添加到站点比手动添加 YUI C 更容易，而且它的用法很像 asp.net 的 ScriptManager，所以很快就能习惯。

最重要的是 - 它也结合了您的 CSS 文件。 因此，下载的 CSS 文件不再是 10 个，而是 1 个，而且还会被压缩等。

查看 - gStyleManager .com

Answer 5

我同意 IIS 是配置此功能的地方。 如果您无法直接更改 IIS，您可以向所有请求添加一个处理程序，以检查 Accept-Encoding: gzip 或 deflate 设置。 然后，您可以使用 SharpZipLib 之类的内容进行正确的压缩。 然而，这很快就会变得混乱。

您会发现手动 gzip 静态文件（如 css 或 js）的成功有限。 假设您在 html 中包含 styles.css.gz 和 scripts.js.gz，并将 gz 扩展名映射到 gzip 压缩文本的 mimetype（是 application/x-gzip？）很多浏览器（例如，firefox、safari，也许是 chrome）都能很好地处理它。 但有些浏览器不会，你就把它们排除在外（链接，也许是旧的歌剧）。

Answer 6

我会考虑使用“deflate”，因为它比 GZip 更有效。 我已经为两者添加了代码。

要将其添加到您的网站，请创建一个文本文件并将给出的代码复制粘贴到该文件中，然后将其另存为 Global.asax。 现在，将此文件添加到站点的根目录中。

<%@ Application Language="C#" %>
<%@ Import Namespace="System.IO" %>
<%@ Import Namespace="System.IO.Compression" %>
<script runat="server">
void Application_PreRequestHandlerExecute(object sender, EventArgs e)
    {
        HttpApplication app = sender as HttpApplication;
        string acceptEncoding = app.Request.Headers["Accept-Encoding"];
        Stream prevUncompressedStream = app.Response.Filter;

        if (!(app.Context.CurrentHandler is Page ||
            app.Context.CurrentHandler.GetType().Name == "SyncSessionlessHandler") ||
            app.Request["HTTP_X_MICROSOFTAJAX"] != null)
            return;

        if (acceptEncoding == null || acceptEncoding.Length == 0)
            return;

        acceptEncoding = acceptEncoding.ToLower();

    if (acceptEncoding.Contains("deflate") || acceptEncoding == "*")
        {
        // defalte
            app.Response.Filter = new DeflateStream(prevUncompressedStream,
                CompressionMode.Compress);
            app.Response.AppendHeader("Content-Encoding", "deflate");
        }
        else if (acceptEncoding.Contains("gzip"))
        {
            // gzip
            app.Response.Filter = new GZipStream(prevUncompressedStream,
                CompressionMode.Compress);
            app.Response.AppendHeader("Content-Encoding", "gzip");
        }
    }
</script>

Answer 7

上一篇文章适用于 aspx 页面，但不适用于 css 和 js 文件。 在压缩中包含 css 和 js 文件的技巧是：

1. 更改 .css 和 .js< 的文件扩展名/code> 文件到 .css.aspx 和 .js.aspx
2. 插入 <%@ Page ContentType="text/css" %>.css.aspx 和 .js.aspx 文件中的 > 和 <%@ Page ContentType="text/javascript" %>
3. 包含 .css.aspx 和 .js.aspx 文件，而不是 .css 和 .js 文件你的页面