Node.js服务器开启Gzip压缩教程

Gzip是什么

复制大神们的解释吧

GZIP最早由Jean-loup Gailly和Mark Adler创建，用于UNIX系统的文件压缩。我们在中经常会用到后缀为.gz的文件，它们就是GZIP格式的。现今已经成为Inter 上使用非常普遍的一种数据压缩格式，或者说一种文件格式。HTTP协议上的GZIP编码是一种用来改进WEB应用程序性能的技术。大流量的WEB站点常常使用GZIP压缩技术来让用户感受更快的速度。这一般是指WWW服务器中安装的一个功能,当有人来访问这个服务器中的网站时,服务器中的这个功能就将网页内容压缩后传输到来访的电脑浏览器中显示出来.一般对纯文本内容可压缩到原大小的40％.这样传输就快了,效果就是你点击网址后会很快的显示出来.这也会增加服务器的负载. 一般服务器中都安装有这个功能模块的.

Gzip压缩率

举个例子，通过webpack打包后的js文件比较大，虽然我们可以利用chunk功能将文件分开混淆打包，总体积还是不小；这时候看看利用gzip压缩的效果

启用Gzip前

启用Gzip后

对比其中三个文件前后压缩大小

文本类文件

iview.min.js: 429kb -> 109kb，压缩比74.6% base.min.js: 309kb -> 81.7kb，压缩比73.56% style.min.css: 207kb -> 30.9kb，压缩比85%

图片

图片1: 63.2kb -> 63.2kb，压缩比0%？

我们看到文本类文件的压缩效果非常显著，图片体积没变。看一下文本类的http响应头是有gzip压缩过:

而图片的没有

这是因为一般对于图片(png,jpg等)使用gzip的效果不好甚至恰得其反，所以一般都默认对图片不进行gzip压缩。

node.js启用gzip

狼蚁网站SEO优化说一下node的express框架如何使用gzip:

1.安装一个pression依赖

npm install pression

2.调用

var pression = require('pression')
var app = express();

//尽量在其他中间件前使用pression
app.use(pression());

基本的使用就是这样就ok了，如果想只对某些请求使用此功能，可以使用它的过滤方法

app.use(pression({filter: shouldCompress}))

function shouldCompress (req, res) {
 if (req.headers['x-no-pression']) {
  // 这里就过滤掉了请求头包含'x-no-pression'
  return false
 }

 return pression.filter(req, res)
}

其他的功能请参考pression的。

附上nginx的配置

#on为启用，off为关闭
gzip on;

#设置允许压缩的页面最小字节数，页面字节数从header头中的Content-Length中进行获取。默认值是0，不管页面多大都压缩。建议设置成大于1k的字节数，小于1k可能会越压越大。
gzip_min_length 1k;

#获取多少内存用于缓存压缩结果，‘4 16k'表示以16k4为单位获得
gzip_buffers 4 16k;

#gzip压缩比（1~9），越小压缩效果越差，越大处理越慢，所以一般取中间值
gzip_p_level 5;

#对特定的MIME类型生效,其中'text/html'被系统强制启用
gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php;

简单解释下参数

1) gzip

语法gzip on/off
默认值off
作用域http, server, location
说明开启或者关闭 gzip 模块，这里使用 on 表示启动

2) gzip_min_length

语法gzip_min_length length
默认值gzip_min_length 0
作用域http, server, location
说明设置允许压缩的页面最小字节数，页面字节数从header头中的Content-Length中进行获取。默认值是0，不管页面多大都压缩。建议设置成大于1k的字节数，小于1k可能会越压越大。|

3) gzip_buffers

语法: gzip_buffers number size
默认值: gzip_buffers 4 4k/8k
作用域: http, server, location
说明设置系统获取几个单位的缓存用于存储gzip的压缩结果数据流。4 16k 代表以 16k 为单位，按照原始数据大小以 16k 为单位的4倍申请内存。

4) gzip_p_level

语法: gzip_p_level 1..9
默认值: gzip_p_level 1
作用域: http, server, location
说明gzip压缩比，1 压缩比最小处理速度最快，9 压缩比最大但处理最慢（传输快但比较消耗cpu）。这里设置为 5。
5) gzip_types

语法: gzip_types mime-type [mime-type ...]
默认值: gzip_types text/html
作用域: http, server, location
说明匹配MIME类型进行压缩，（无论是否指定）"text/html" 类型总是会被压缩的。这里设置为 text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php。