当前位置:首页 > web性能优化 > 正文

web前端页面性能优化之gzip压缩

使用YSlow这一FF插件,可以看到大量的关于哪些地方可以优化,其中很常见的一点,就是:“Grade F on Compress components with gzip”,简单的说,就是
没有开启gzip压缩,导致网络传输数据偏大,可以优化;

对比其他很多大型网站的响应头的压缩信息,比如www.qq.com,很多css,js等静态文件,都会启动gzip压缩,类似:

可以看到Content-Encoding响应头,数据进行了压缩;

压缩真的有那么重要吗?
看下面启动gzip压缩前后的数据对比:

after gzip

before gzip

no gzip detail

压缩详情

首先一个jquery的压缩版文件,压缩后大小为32802,而压缩点为93107,相当于压缩了65%的大小;
同样未压缩前,加载7个js文件,耗时305ms,压缩后只需要100ms,时间缩短了67%;

好,接下来问题就来了,为什么一般的网站js没有被压缩呢?
对于apache服务器而言,如何开启gzip压缩?

解释如下:
gzip原本是文件压缩格式,扩展名为.gz,HTTP协议用它来改进WEB应用程序性能,加快HTTP请求返回内容的下载速度,增加用户体验,降低网络带宽占用

apache内置有mod_deflate模块来启用gzip功能,但假如安装apache的时候没有编译相关模块,就需要你手动安装一次,

如何得知是否安装?

cat ../httpd.conf | grep deflate

如果没有找到,则可以使用
find / -name 'mod_deflate.c'

找到源码所在的位置,一般在源码中,比如位于:/data/software/httpd-2.2.24/modules/filters/mod_deflate.c

所以为了启用它:
首先到你的apache源码目录,查找到mod_deflate.c文件
Mac及Linux下都可用locate mod_deflate.c
通常位置:apache的httpd源码目录/modules/filters/mod_deflate.c
进入上面找到的目录运行下面的命令:
/usr/local/apache/bin/apxs -i -c -a mod_deflate.c
注:apxs目录请参照您自己的机器,通常在apache安装目录的bin目录下
安装完成,到apache的modules目录看看是不是有了mod_deflates.so,如果有了这个文件,请编辑apache安装目录的conf/httpd.conf配置文件:
LoadModule deflate_module modules/mod_deflate.so
加载mod_deflate.so模块
在httpd.conf里面的站点配置里增加如下内容:

第一行代表对什么样的内容启用GZIP压缩,第二行代表压缩级别,第三行代表启用deflate模块对本站点的输出进行GZIP压缩(就是对所有输出启用压缩),重启即可;

有些老外给的说明如下:

1 条评论

发表评论