Nginx开启Gzip压缩提升页面加载速度-问答-阿里云开发者社区-阿里云

开发者社区> 问答> 正文

Nginx开启Gzip压缩提升页面加载速度

小柒2012 2016-05-26 10:26:23 8367
阿里云Linux下安装Nginx服务器基础篇
阿里云linux下Nginx整合Tomcat实现负载均衡集群
阿里云Linux下Nginx服务器整合php
阿里云Nginx整合Tomcat实现静态文件缓存
Nginx如何使用ngx_cache_purge清除缓存



以上都是工作中的记录。
======================================

最近使用 echarts绘图,需要加载echarts-all.js,源码文件居然高达900KB,执行时间为3.75秒,严重影响了页面加载速度。
项目环境  linux,Nginx
还好Nginx 内置了Gizp 压缩。
一、压缩效果
echarts-all.js   压缩前 900KB  压缩后 375KB,时间差距 3.75秒 缩短到  1.58秒, 大大减少了网络传输速度,当然会对服务器CPU有一定影响。
同时开启对  css  xml  以及部分图片格式进行压缩处理。
压缩前:
[attachment=102183]

压缩后:
[attachment=102184]




二、实现方式


1、Vi打开Nginx配置文件
vi /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/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]\.";
以上代码可以插入到 http {...}整个服务器的配置里,也可以插入到虚拟主机的 server {...}或者下面的location模块内。


3、解释一下
gzip
决定是否开启gzip模块
example:gzip on;
gzip_buffers
设置gzip申请内存的大小,其作用是按块大小的倍数申请内存空间
param2:int(k) 后面单位是k
example: gzip_buffers 4 8k;
gzip_comp_level
设置gzip压缩等级,等级越底压缩速度越快文件压缩比越小,反之速度越慢文件压缩比越大
param:1-9
example:gzip_com_level 1;
gzip_min_length
当返回内容大于此值时才会使用gzip进行压缩,以K为单位,当值为0时,所有页面都进行压缩
param:int
example:gzip_min_length 1000;
gzip_http_version
用于识别http协议的版本,早期的浏览器不支持gzip压缩,用户会看到乱码,所以为了支持前期版本加了此选项,目前此项基本可以忽略
param: 1.0|1.1
example:gzip_http_version 1.0
gzip_proxied
Nginx做为反向代理的时候启用,
param : off|expired|no-cache|no-sotre|private|no_last_modified|no_etag|auth|any]
expample:gzip_proxied no-cache;
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_types
设置需要压缩的MIME类型,非设置值不进行压缩
param:text/html|application/javascript|text/css|application/xml
example:gzip_types text/html;
对于多数以文本为主的站点来说,文本自身内容占流量的绝大部分。虽然单个文本体积并不算大,但是如果数量众多的话,流量还是相当可观。启用GZIP以后,可以大幅度减少所需的流量(如上图所示,本站首页大小从28K压缩到了7K)。以下是以nginx服务器为例开启gzip的一般代码。
gzip_vary
跟Squid等缓存服务有关,on的话会在Header里增加"Vary: Accept-Encoding",我不需要这玩意,自己对照情况看着办吧
gzip_disable
IE6对Gzip不怎么友好,不给它Gzip了

4、:wq保存退出,重新加载Nginx
/usr/local/nginx/sbin/nginx -s reload


XML 缓存 负载均衡 前端开发 JavaScript 应用服务中间件 Linux PHP nginx 数据格式
分享到
取消 提交回答
全部回答(1)
  • pasenger
    2016-06-05 10:14:48
    ReNginx开启Gzip压缩提升页面加载速度
    谢谢分享,回头试试去
    0 0

集结各类场景实战经验,助你开发运维畅行无忧

推荐文章
相似问题
推荐课程