WordPress优化之开启Gzip压缩

最近一段时间一直在研究WordPress性能优化技巧,也没怎么更新。当然,这里的“性能优化”指的是“网页加载速度的提升”。笔者“阅站无数”,发现同是基于WordPress的博客,有的很慢有的则“秒开”。毫无疑问网页打开速度慢,会失去大量的读者。尝试了许多加速技巧,目前觉得最实用最强大的无疑是“开启Gzip压缩”

1.什么是Gzip压缩?

关于Gzip压缩,维基百科说的很详细,这里简要概述一下:

未开启Gzip压缩时的http请求过程

未开启Gzip压缩时的http请求过程

GZIP 最早由Jean-loup Gailly和Mark Adler创建,用于UNIX系统的文件压缩。我们在Linux中经常会用到后缀为.gz的文件,它们就是GZIP格式的。现今已经成为Internet 上使用非常普遍的一种数据压缩格式,或者说一种文件格式。HTTP协议上的GZIP编码是一种用来改进WEB应用程序性能的技术。大流量的WEB站点常常使用GZIP压缩技术来让用户感受更快的速度。这一般是指WWW服务器中安装的一个功能,当有人来访问这个服务器中的网站时,服务器中的这个功能就将网页内容压缩后传输到来访的电脑浏览器中显示出来.一般对纯文本内容可压缩到原大小的40%.这样传输就快了,效果就是你点击网址后会很快的显示出来.当然这也会增加服务器的负载.

开启Gzip压缩时的http请求过程

开启Gzip压缩后的http请求过程

简而言之,Gzip开启以后会将输出到用户浏览器的数据进行压缩的处理(压缩比率一般都在70%以上!),这样就会减小通过网络传输的数据量,提高浏览的速度

2.如何如何开启Gzip压缩?

关于Gzip压缩开启方法实在很多,不过大多数是在服务器端进行功能模块配置,相当复杂。但由于网站的服务器Apache、IIS版本不尽相同,这些方法差别很大,这里笔者仅介绍几种实用的方法(同时只能用1种方法):

A.   Apache服务器. 针对WordPress的方法

将以下代码复制到function.php文件中去(只能开启HTML网页压缩)

function gzippy() {
 ob_start('ob_gzhandler');
}

if(!stristr($_SERVER['REQUEST_URI'], 'tinymce') && !ini_get('zlib.output_compression')) {
 add_action('init', 'gzippy');
}

B.  Apache服务器. 如果是 Cpannel面板的主机,打开软件—优化网站

Gzip压缩

Cpannel面板的软件—优化网站

选择压缩被指定的多用因特网邮件扩展(标准)类型

压缩被指定的多用因特网邮件扩展(标准)类型

压缩被指定的多用因特网邮件扩展(标准)类型

笔者填的是:text/html  text/plain  text/xml  application/javascript  text/css

说明:

  • text/html  HTML网页
  • text/plain  文本文件
  • text/xml   XML文件
  • application/javascript  JS文件
  • text/css   CSS文件

C.  Apache服务器. 如果不是Cpannel面板,也没有相应功能的Gzip开关

在网站根目录的.htaccess里填入:

<IfModule mod_deflate.c>
    AddOutPutFilterByType DEFLATE text/html text/plain text/xml application/javascript text/css
    <IfModule mod_setenvif.c>
        # Netscape 4.x has some problems...
        BrowserMatch ^Mozilla/4 gzip-only-text/html

        # Netscape 4.06-4.08 have some more problems
        BrowserMatch ^Mozilla/4\.0[678] no-gzip

        # MSIE masquerades as Netscape, but it is fine
        # BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

        # NOTE: Due to a bug in mod_setenvif up to Apache 2.0.48
        # the above regex won't work. You can use the following
        # workaround to get the desired effect:
        BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html

        # Don't compress images
        SetEnvIfNoCase Request_URI .(?:gif|jpe?g|png)$ no-gzip dont-vary
    </IfModule>

    <IfModule mod_headers.c>
        # Make sure proxies don't deliver the wrong content
        Header append Vary User-Agent env=!dont-vary
    </IfModule>
</IfModule>

D.IIS服务器启用Gzip压缩,非常麻烦,参阅此文:在IIS上启用Gzip压缩(HTTP压缩)

3.如何验证网站是否开启Gzip?

以上工作都做好之后,如何验证Gzip开启呢?很简单,在tool.chinaz.com/gzips里输入网址即可检测。

Gzip压缩检测

Gzip压缩检测服务

注:还可以通过PHP压缩JS和CSS,参阅:【WordPress优化之Gzip压缩CSS和Js文件

  6Comments

  1. 吾乐吧   •  

    请问你用什么cache插件的?我那个一旦开了cache就无法使用gzip压缩了,而这只能选其一……(WP Super Cache以前正常,现在无论怎么开,全无法缓存…现在用的是不知名的插件)

    • Jeriff Cheng   •     Author

      用Hyper Cache,自带了Gzip压缩HTML的功能。注意不要同时采用两种及以上办法重复压缩,会乱码。

  2. 呆呆   •  

    看了你的几篇文章,对我帮助很大,这几天新主题刚上线,正在无尽的折腾中。非常感谢分享这些内容,另外要说一下http://www.jeriffcheng.com/leverage-browser-caching.html这篇文章中的代码有问题,

    //你的代码在这里

    • 呆呆   •  

      R,发不了代码!
      你的代码两端应该是
      小于号 IfModule mod_expires.c 大于号
      然后才是你的代码
      最后 小于号 /IfModule大于号

      • Jeriff Cheng   •     Author

        对,我没加判断语句,这样如果服务器没有安装mod_expires模块的话,会直接报错。谢谢提醒1

  3. Bynccc   •  

    往函数模板添加代码比较方便。。。

Leave a Reply

Your email address will not be published. Required fields are marked *