更新： 亚马逊现在支持 gzip 压缩，因此不再需要。 亚马逊公告

原答案：

答案是对 CSS 和 JavaScript 文件进行 gzip。是的，你没有看错。

gzip -9 production.min.css

这将产生production.min.css.gz. 删除.gz, 上传到 S3（或您使用的任何源服务器）并将Content-Encoding文件的标头显式设置为gzip.

它不是即时的 gzip 压缩，但您可以非常轻松地将其打包到您的构建/部署脚本中。优点是：

1. 当请求文件时，Apache 不需要 CPU 来 gzip 内容。
2. 文件以最高压缩级别（假设为gzip -9）进行 gzip 压缩。
3. 您正在从 CDN 提供文件。

假设您的 CSS/JavaScript 文件 (a) 被缩小和 (b) 大到足以证明在用户机器上解压所需的 CPU 是合理的，您可以在这里获得显着的性能提升。

请记住：如果您对 CloudFront 中缓存的文件进行更改，请确保在进行此类更改后使缓存无效。

我的回答是一个起飞：http : //blog.kenweiner.com/2009/08/serving-gzipped-javascript-files-from.html

根据斯凯勒的回答，您可以上传 css 和 js 的 gzip 和非 gzip 版本。在 Safari 中小心命名和测试。因为 safari 不会处理.css.gz或.js.gz文件。

site.js和site.js.jgz和 site.css和site.gz.css （您需要将content-encoding标头设置为正确的 MIME 类型才能使它们正确提供服务）

然后在你的页面里放。

<script type="text/javascript">var sr_gzipEnabled = false;</script> 
<script type="text/javascript" src="http://d2ft4b0ve1aur1.cloudfront.net/js-050/sr.gzipcheck.js.jgz"></script> 

<noscript> 
  <link type="text/css" rel="stylesheet" href="http://d2ft4b0ve1aur1.cloudfront.net/css-050/sr-br-min.css">
</noscript> 
<script type="text/javascript"> 
(function () {
    var sr_css_file = 'http://d2ft4b0ve1aur1.cloudfront.net/css-050/sr-br-min.css';
    if (sr_gzipEnabled) {
      sr_css_file = 'http://d2ft4b0ve1aur1.cloudfront.net/css-050/sr-br-min.css.gz';
    }

    var head = document.getElementsByTagName("head")[0];
    if (head) {
        var scriptStyles = document.createElement("link");
        scriptStyles.rel = "stylesheet";
        scriptStyles.type = "text/css";
        scriptStyles.href = sr_css_file;
        head.appendChild(scriptStyles);
        //alert('adding css to header:'+sr_css_file);
     }
}());
</script> 

gzipcheck.js.jgz 只是sr_gzipEnabled = true; 这个测试以确保浏览器可以处理 gzip 压缩的代码并在不能时提供备份。

然后在页脚中做一些类似的事情，假设你的所有 js 都在一个文件中并且可以放在页脚中。

<div id="sr_js"></div> 
<script type="text/javascript"> 
(function () {
    var sr_js_file = 'http://d2ft4b0ve1aur1.cloudfront.net/js-050/sr-br-min.js';
    if (sr_gzipEnabled) {
       sr_js_file = 'http://d2ft4b0ve1aur1.cloudfront.net/js-050/sr-br-min.js.jgz';
    }
    var sr_script_tag = document.getElementById("sr_js");         
    if (sr_script_tag) {
    var scriptStyles = document.createElement("script");
    scriptStyles.type = "text/javascript";
    scriptStyles.src = sr_js_file;
    sr_script_tag.appendChild(scriptStyles);
    //alert('adding js to footer:'+sr_js_file);
    }
}());
</script> 

更新： 亚马逊现在支持 gzip 压缩。公告，所以这不再需要。 亚马逊公告

Cloudfront 支持 gzip 压缩。

Cloudfront 通过 HTTP 1.0 连接到您的服务器。默认情况下，包括 nginx 在内的一些网络服务器不向 HTTP 1.0 连接提供压缩内容，但您可以通过添加以下内容来告诉它：

gzip_http_version 1.0

到您的 nginx 配置。可以为您使用的任何 Web 服务器设置等效的配置。

这确实具有使保持活动连接不适用于 HTTP 1.0 连接的副作用，但由于压缩的好处是巨大的，因此绝对值得权衡。

取自http://www.cdnplanet.com/blog/gzip-nginx-cloudfront/

编辑

通过 Amazon 云前端即时提供 gzip 压缩的内容是危险的，可能不应该这样做。基本上，如果您的网络服务器正在压缩内容，它不会设置内容长度，而是将数据作为分块发送。

如果 Cloudfront 和您的服务器之间的连接中断并过早断开，Cloudfront 仍会缓存部分结果并将其用作缓存版本，直到它过期。

首先在磁盘上对其进行 gzip 压缩，然后提供 gzip 压缩版本的公认答案是一个更好的主意，因为 Nginx 将能够设置 Content-Length 标头，因此 Cloudfront 将丢弃截断的版本。

我们最近对 uSwitch.com 进行了一些优化，以压缩我们网站上的一些静态资产。尽管我们设置了一个完整的 nginx 代理来执行此操作，但我还组合了一个小 Heroku 应用程序，它在 CloudFront 和 S3 之间代理以压缩内容：http : //dfl8.co

鉴于可以使用简单的 URL 结构访问可公开访问的 S3 对象，http://dfl8.co仅使用相同的结构。即以下 URL 是等效的：

http://pingles-example.s3.amazonaws.com/sample.css
http://pingles-example.dfl8.co/sample.css
http://d1a4f3qx63eykc.cloudfront.net/sample.css

昨天亚马逊宣布了新功能，您现在可以在您的发行版上启用 gzip。

它适用于 s3，无需自己添加 .gz 文件，我今天尝试了新功能，效果很好。（虽然需要使您当前的对象无效）

更多信息