网页性能优化开启Nginx的 gzip 压缩功能
2017-05-15 17:39
1016 查看
开启网站的 gzip 压缩功能,通常可以高达70%,也就是说,如果你的网页有30K,压缩之后就变成9K, 对于大部分网站,显然可以明显提高浏览速度(注:需要浏览器支持)。
测试工具:
google speed
编辑 nginx 的配置文件
在 Gzip Settings 中加入如下设置:
上面添加完成后,通过 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是否成功开启
页面成功压缩
css文件成功压缩
js文件成功压缩
图片成功压缩
最后来个不到1K的文件,由于我的阈值是1K,所以没压缩
测试工具:
google speed
nginx
需先编译gzip模块编辑 nginx 的配置文件
vi /etc/nginx/nginx.conf
在 Gzip Settings 中加入如下设置:
## # Gzip Settings ## gzipon; gzip_min_length 1k; gzip_buffers 4 16k; gzip_comp_level 5; gzip_typestext/plainapplication/x-javascripttext/cssapplication/xmltext/javascriptapplication/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,所以没压缩
相关文章推荐
- Nginx 开启 gzip 压缩功能
- 为你的网站开启 gzip 压缩功能(nodejs、nginx)
- 开启Nginx的gzip压缩功能详解
- nginx开启GZIP来压缩网页
- 如何开启Tomcat服务器的Gzip网页压缩功能
- Nginx开启Gzip压缩功能
- nginx开启GZIP来压缩网页
- Nginx开启GZIP来压缩网页
- Tomcat8启用gzip压缩实现网页性能优化
- 开启Nginx的gzip压缩功能详解
- Nginx开启gzip压缩功能
- 【nginx网站性能优化篇(1)】gzip压缩与expire浏览器缓存
- nginx开启GZIP来压缩网页
- Apache如何开启gzip网页压缩功能
- Apache性能优化–开启gzip压缩
- 开启Nginx的gzip压缩功能详解
- nginx开启网页压缩--Gzip
- 网站性能优化之GZIP压缩功能优缺点以及配置方法
- CentOS下Apache开启Gzip网页压缩功能
- 为你的网站开启 gzip 压缩功能(nodejs、nginx)