IT博客汇
  • 首页
  • 精华
  • 技术
  • 设计
  • 资讯
  • 扯淡
  • 权利声明
  • 登录 注册

    网页性能优化开启Nginx的 gzip 压缩功能

    admin发表于 2016-05-27 03:42:36
    love 0

    开启网站的 gzip 压缩功能,通常可以高达70%,也就是说,如果你的网页有30K,压缩之后就变成9K, 对于大部分网站,显然可以明显提高浏览速度(注:需要浏览器支持)。

    测试工具:google speed

    nginx

    编辑 nginx 的配置文件

    vi /etc/nginx/nginx.conf

    在 Gzip Settings 中加入如下设置:

    ##
    # Gzip Settings
    ##
    
    gzip on;
    gzip_min_length 1k;
    gzip_buffers 4 16k;
    gzip_comp_level 5;
    gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php;

    上面添加完成后,通过 CURL或是浏览的Network检查不成功时,就把看到的“Content-Type: image/jpeg” 加在gzip_types进去就可以了。

    注意每修改配置文件,都要重新加载nginx service.

    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_comp_level

    • 语法: gzip_comp_level 1..9
    • 默认值: gzip_comp_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。

    用curl测试Gzip是否成功开启

    curl -I -H "Accept-Encoding: gzip, deflate" "http://www.slyar.com/blog/"
    
    HTTP/1.1 200 OK
    Server: nginx/1.0.15
    Date: Sun, 26 Aug 2012 18:13:09 GMT
    Content-Type: text/html; charset=UTF-8
    Connection: keep-alive
    X-Powered-By: PHP/5.2.17p1
    X-Pingback: http://www.slyar.com/blog/xmlrpc.php
    Content-Encoding: gzip

    页面成功压缩

    curl -I -H "Accept-Encoding: gzip, deflate" "http://www.slyar.com/blog/wp-content/plugins/photonic/include/css/photonic.css"
    
    HTTP/1.1 200 OK
    Server: nginx/1.0.15
    Date: Sun, 26 Aug 2012 18:21:25 GMT
    Content-Type: text/css
    Last-Modified: Sun, 26 Aug 2012 15:17:07 GMT
    Connection: keep-alive
    Expires: Mon, 27 Aug 2012 06:21:25 GMT
    Cache-Control: max-age=43200
    Content-Encoding: gzip

    css文件成功压缩

    curl -I -H "Accept-Encoding: gzip, deflate" "http://www.slyar.com/blog/wp-includes/js/jquery/jquery.js"
    
    HTTP/1.1 200 OK
    Server: nginx/1.0.15
    Date: Sun, 26 Aug 2012 18:21:38 GMT
    Content-Type: application/x-javascript
    Last-Modified: Thu, 12 Jul 2012 17:42:45 GMT
    Connection: keep-alive
    Expires: Mon, 27 Aug 2012 06:21:38 GMT
    Cache-Control: max-age=43200
    Content-Encoding: gzip

    js文件成功压缩

    curl -I -H "Accept-Encoding: gzip, deflate" "http://www.slyar.com/blog/wp-content/uploads/2012/08/2012-08-23_203542.png"
    
    HTTP/1.1 200 OK
    Server: nginx/1.0.15
    Date: Sun, 26 Aug 2012 18:22:45 GMT
    Content-Type: image/png
    Last-Modified: Thu, 23 Aug 2012 13:50:53 GMT
    Connection: keep-alive
    Expires: Tue, 25 Sep 2012 18:22:45 GMT
    Cache-Control: max-age=2592000
    Content-Encoding: gzip

    图片成功压缩

    curl -I -H "Accept-Encoding: gzip, deflate" "http://www.slyar.com/blog/wp-content/plugins/wp-multicollinks/wp-multicollinks.css"
    
    HTTP/1.1 200 OK
    Server: nginx/1.0.15
    Date: Sun, 26 Aug 2012 18:23:27 GMT
    Content-Type: text/css
    Content-Length: 180
    Last-Modified: Sat, 02 May 2009 08:46:15 GMT
    Connection: keep-alive
    Expires: Mon, 27 Aug 2012 06:23:27 GMT
    Cache-Control: max-age=43200
    Accept-Ranges: bytes

    最后来个不到1K的文件,由于我的阈值是1K,所以没压缩



沪ICP备19023445号-2号
友情链接