巅云智能建站平台搭建版(创业门户版)火爆上线,终身授权!新增:文章智能采集+全站真静态打包+城市分站+智能小程序+非法词过滤+H5自适应+智能链词等功能功能详情
建站专提News

Nginx开启Gzip压缩大幅提高页面加载速度的方法

一佰互联网站开发设计(www.yinxi.net) 发布日期 2019-04-22 10:28:32 浏览数: 196

刚刚给博客加了一个500px相册插件,lightbox引入了很多js文件和css文件,页面一下子看起来非常臃肿,所以还是把Gzip打开了。

环境:Debian 6

1、Vim打开Nginx配置文件

vim /usr/local/nginx/conf/nginx.conf

2、找到如下一段,进行修改

gzip on;gzip_min_length 1k;gzip_buffers 4 16k;#gzip_http_version 1.0;gzip_comp_level 2;gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;gzip_vary off;gzip_disable "MSIE [1-6].";

3、解释一下

第1行:开启Gzip

第2行:不压缩临界值,大于1K的才压缩,一般不用改

第3行:buffer,就是,嗯,算了不解释了,不用改

第4行:用了反向代理的话,末端通信是HTTP/1.0,有需求的应该也不用看我这科普文了;有这句的话注释了就行了,默认是HTTP/1.1

第5行:压缩级别,1-10,数字越大压缩的越好,时间也越长,看心情随便改吧

第6行:进行压缩的文件类型,缺啥补啥就行了,JavaScript有两种写法,最好都写上吧,总有人抱怨js文件没有压缩,其实多写一种格式就行了

第7行:跟Squid等缓存服务有关,on的话会在Header里增加"Vary: Accept-Encoding",我不需要这玩意,自己对照情况看着办吧

第8行:IE6对Gzip不怎么友好,不给它Gzip了

4、:wq保存退出,重新加载Nginx

/usr/local/nginx/sbin/nginx -s reload

5、用curl测试Gzip是否成功开启

curl -I -H "Accept-Encoding: gzip, deflate" "http://www.slyar.com/blog/"HTTP/1.1 200 OKServer: nginx/1.0.15Date: Sun, 26 Aug 2012 18:13:09 GMTContent-Type: text/html; charset=UTF-8Connection: keep-aliveX-Powered-By: PHP/5.2.17p1X-Pingback: http://www.slyar.com/blog/xmlrpc.phpContent-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 OKServer: nginx/1.0.15Date: Sun, 26 Aug 2012 18:21:25 GMTContent-Type: text/cssLast-Modified: Sun, 26 Aug 2012 15:17:07 GMTConnection: keep-aliveExpires: Mon, 27 Aug 2012 06:21:25 GMTCache-Control: max-age=43200Content-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 OKServer: nginx/1.0.15Date: Sun, 26 Aug 2012 18:21:38 GMTContent-Type: application/x-javascriptLast-Modified: Thu, 12 Jul 2012 17:42:45 GMTConnection: keep-aliveExpires: Mon, 27 Aug 2012 06:21:38 GMTCache-Control: max-age=43200Content-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 OKServer: nginx/1.0.15Date: Sun, 26 Aug 2012 18:22:45 GMTContent-Type: image/pngLast-Modified: Thu, 23 Aug 2012 13:50:53 GMTConnection: keep-aliveExpires: Tue, 25 Sep 2012 18:22:45 GMTCache-Control: max-age=2592000Content-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 OKServer: nginx/1.0.15Date: Sun, 26 Aug 2012 18:23:27 GMTContent-Type: text/cssContent-Length: 180Last-Modified: Sat, 02 May 2009 08:46:15 GMTConnection: keep-aliveExpires: Mon, 27 Aug 2012 06:23:27 GMTCache-Control: max-age=43200Accept-Ranges: bytes

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

gzip参数解释

gzip on|off

默认值: gzip off

开启或者关闭gzip模块

gzip_static on|off

nginx对于静态文件的处理模块

该模块可以读取预先压缩的gz文件,这样可以减少每次请求进行gzip压缩的CPU资源消耗。该模块启用后,nginx首先检查是否存在请求静态文件的gz结尾的文件,如果有则直接返回该gz文件内容。为了要兼容不支持gzip的浏览器,启用gzip_static模块就必须同时保留原始静态文件和gz文件。这样的话,在有大量静态文件的情况下,将会大大增加磁盘空间。我们可以利用nginx的反向代理功能实现只保留gz文件。

可以google”nginx gzip_static”了解更多

gzip_comp_level 4

默认值:1(建议选择为4)

gzip压缩比/压缩级别,压缩级别 1-9,级别越高压缩率越大,当然压缩时间也就越长(传输快但比较消耗cpu)。

gzip_buffers 4 16k

默认值: gzip_buffers 4 4k/8k

设置系统获取几个单位的缓存用于存储gzip的压缩结果数据流。 例如 4 4k 代表以4k为单位,按照原始数据大小以4k为单位的4倍申请内存。 4 8k 代表以8k为单位,按照原始数据大小以8k为单位的4倍申请内存。 如果没有设置,默认值是申请跟原始数据相同大小的内存空间去存储gzip压缩结果。

gzip_types mime-type [mime-type …]

默认值: gzip_types text/html (默认不对js/css文件进行压缩)

压缩类型,匹配MIME类型进行压缩

不能用通配符 text/* (无论是否指定)text/html默认已经压缩

设置哪压缩种文本文件可参考 conf/mime.types

gzip_min_length 1k

默认值: 0 ,不管页面多大都压缩

设置允许压缩的页面最小字节数,页面字节数从header头中的Content-Length中进行获取。

建议设置成大于1k的字节数,小于1k可能会越压越大。 即: gzip_min_length 1024

gzip_http_version 1.0|1.1

默认值: gzip_http_version 1.1(就是说对HTTP/1.1协议的请求才会进行gzip压缩)

识别http的协议版本。由于早期的一些浏览器或者http客户端,可能不支持gzip自解压,用户就会看到乱码,所以做一些判断还是有必要的。

注:99.99%的浏览器基本上都支持gzip解压了,所以可以不用设这个值,保持系统默认即可。

假设我们使用的是默认值1.1,如果我们使用了proxy_pass进行反向代理,那么nginx和后端的upstream server之间是用HTTP/1.0协议通信的,如果我们使用nginx通过反向代理做Cache Server,而且前端的nginx没有开启gzip,同时,我们后端的nginx上没有设置gzip_http_version为1.0,那么Cache的url将不会进行gzip压缩

gzip_proxied [off|expired|no-cache|no-store|private|no_last_modified|no_etag|auth|any] …

默认值:off

Nginx作为反向代理的时候启用,开启或者关闭后端服务器返回的结果,匹配的前提是后端服务器必须要返回包含”Via”的 header头。

off - 关闭所有的代理结果数据的压缩 expired - 启用压缩,如果header头中包含 “Expires” 头信息 no-cache - 启用压缩,如果header头中包含 “Cache-Control:no-cache” 头信息 no-store - 启用压缩,如果header头中包含 “Cache-Control:no-store” 头信息 private - 启用压缩,如果header头中包含 “Cache-Control:private” 头信息 no_last_modified - 启用压缩,如果header头中不包含 “Last-Modified” 头信息 no_etag - 启用压缩 ,如果header头中不包含 “ETag” 头信息 auth - 启用压缩 , 如果header头中包含 “Authorization” 头信息 any - 无条件启用压缩

gzip_vary on

和http头有关系,加个vary头,给代理服务器用的,有的浏览器支持压缩,有的不支持,所以避免浪费不支持的也压缩,所以根据客户端的HTTP头来判断,是否需要压缩

gzip_disable “MSIE [1-6].”

禁用IE6的gzip压缩,又是因为杯具的IE6。当然,IE6目前依然广泛的存在,所以这里你也可以设置为“MSIE [1-5].”

IE6的某些版本对gzip的压缩支持很不好,会造成页面的假死,今天产品的同学就测试出了这个问题

后来调试后,发现是对img进行gzip后造成IE6的假死,把对img的gzip压缩去掉后就正常了

为了确保其它的IE6版本不出问题,所以建议加上gzip_disable的设置

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持网页设计。

一佰互联是全国知名建站品牌服务商,我们有九年网站建设、网站制作、网页设计、php开发和域名注册及虚拟主机服务经验,提供的自助建站服务更是全国有名。近年来还整合团队优势自主开发了可视化多用户”巅云建站系统“3.0平台版,拖拽排版网站制作设计,轻松实现pc站、手机微网站、小程序、APP一体化全网营销网站建设 ,已成功的为全国上百家网络公司提供自助建站平台搭建服务。

相关新闻more

08
04月
老外教你学汉字!超全面的中文字体新手指南 -

编者按:这是一篇由国外设计师写的中文字体新手指南,特别下工夫,从中文字体的分类(包括历史和网页标准等),字体结构考究到创意字体设计等都有细致... >>详情

28
04月
WampServer下安装多个版本的PHP、

今天,我在调试一套PHP程序的时候,该程序中使用的某些函数在低版本中无法使用,所以只能在搞个高版本的php。作为Web开发人员,在机器上安装... >>详情

17
05月
简单论述SEO与搜索引擎的阴阳平衡关系_巅云

个人认为,SEOer与的更是一种阴阳相对的太极对立而又相生的。 的自然排名以及搜索引擎将更多的优质内容提供给更多的浏览者,如果说没有更多的S... >>详情

15
04月
高端网站建设-做网站推广要掌握好推广的时间

1、前期的网站建设,要融入SEO网站优化,不管是任何行业网站,网站如何定位都要做SEO网站优化,不过SEO优化是一个长期的过程,要坚持做,才... >>详情

高端网站建设

美工兼顾SEO,为企业电子商务营销助力!

电话:

023-85725751
建站

产品

域名注册 虚拟主机 云服务器 企业邮局
智能建站 APP打包 微站/小程序 创业平台
网站推广 媒体营销 智能采集 AI机器人
400电话 短信营销 店销机器人
私人定制 门户网站