WordPress站点速度优化攻略

八月 1st, 2009 | Tags: Wordpress, 优化

在这里我讲述一下我在昨天（7分钟之前还是昨天……）对我的Blog整体做访问速度优化的经历，非常的涨经验，同时也非常具有参考价值~

由于WP Super Cache这个插件在我的WordPress中页面缓存功能无效化（原因未知），所以我将其卸载：

   1.用最后一个按钮恢复默认设置。
    2.功能关闭（菜单中选OFF然后保存）。
    3.清空缓存页面（即使数值显示0）。
    4.停用插件。

    5.从控制台卸载插件。
    6.删除.htaccess文件中“# BEGIN WPSuperCache”开头至“# END WPSuperCache”结尾的代码。
    7.删除wp-content目录下的advanced-cache.php和wp-config.php文件。

我一开始使用的方法是万戈大人的其中一种办法，事先对页面做压缩并以gz格式缓存，在需要的时候调用，优点是不消耗服务器资源又节约了带宽。但缺点是万戈没有说明的，那就是对于一个空间有多个blog或者将blog存放在单独目录中的情况将会出现不可预料的问题，比如无法加载CSS样式表（裸奔）。

由于我是将程序放在单独目录下面的，所以我莽撞的应用并且没有对过程作相应记录导致了悲剧的发生——出现重大问题并且无法回溯……我没法找出问题所在，尽力的恢复了一切操作却于事无补，在IE中仍然显示飙风乱码，而且是没有任何正常的显示—_—残念……

自此我终于明白了适时备份的重要性，然后我用当天下午对整站做优化之前的备份做了恢复，这才搞定，但是代价就是一下午的努力白费了……

经过惨痛的教训之后，我谨慎了很多，在别的工作完成之后，我先到空间后台备份了整个主目录，接着开始如下动作。

目标一.在整个站点使用Gzip压缩。

动作1

我先在.htaccess文件中加入下面几行代码，如果主机采用的是 Apache 2，并安装启用了mod_deflate模块，那么就是最好的情况了。

<ifmodule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/css text/plain text/xml application/x-httpd-php application/x-javascript
</ifmodule>

如果成功，直接可以压缩HTML, PHP, JS, CSS,XML后缀的文件。可是，我尝试后木有成功开启Gzip压缩，也就是说服务器不支持……

动作2

接着我尝试了下面这种方法：通过php每载入一次就压缩一次的方法，可以通用的压缩css/js/html/htm文件，优点是简单方便，默认对所有指定类型的文件生效。

但是在永久链接不是html或者htm结尾的情况下似乎不会对最多的文字部分进行处理……

而且理论上比较吃服务器的资源，占用一定的 CPU 和内存，因为每次访问页面都要执行一下。据说在服务器资源紧张的情况下压缩的效率会比较低，不过我想一般大型的主机提供商的主机还是不会有什么问题的。

不知道是不是别的原因导致的，使用这个办法之后似乎页面在解析到之后初期一段时间是没有响应的，难道就是在压缩？不过当开始刷出来之后的确快了不少。（补充，这可能是我的模板的问题。）

下面是来自老N的方法：

1.在根目录下新建一个Gzip.php文件

内容如下：

<?php
$allowed = array(
‘css‘ => ‘text/css‘,
‘js‘ => ‘text/javascript‘,
‘html‘ => ‘text/html‘,
‘htm‘ => ‘text/html‘,
);
$file = isset($_GET['url']) ? $_GET['url'] : null;
$extension = explode(‘.‘, $file);
$extension = array_pop($extension);
if(isset($allowed[$extension]))
{
$pos = strpos($file, ‘..‘);
if ($pos === false && is_file($file))
{
@ob_start (‘ob_gzhandler‘);
header("Content-type: {$allowed[$extension]}; charset: UTF-8");
readfile($file);
} else {
header(‘HTTP/1.1 404 Not Found‘);
}
}
?>

2.打开根目录的.htaccess文件，在里面添加如下内容

RewriteCond %{REQUEST_FILENAME} -f
RewriteCond %{REQUEST_FILENAME} ^.*\.(css|js|html|htm)$
RewriteRule ^(.*)$ gzip.php?url=$1 [QSA,L]

完成了。

至此，在全站开启gzip功能的目标已经达成大半了，从Websiteoptimization这个站点的测试结果可以看出（这个站点我是从xiaorsz这里得知的），除了首页的文字内容以外，包括所有js脚本，css样式表。

动作3

接下来我要搞定文字内容的gzip，首先尝试最简单的办法——用php实现单纯的静态内容gzip，这刚好和上面实现的功能不冲突~

我在Shawn的blog找到了这种简单的办法实现方式。

在根目录新建php.ini，并且拷入下面代码。

output_buffering = Off
output_handler =
zlib.output_compression = On

保存

然后就能够实现对文字内容的压缩了。

但是他也注明了以下内容：

“需要注意的是，如果 WordPress 启用了静态化插件，所有静态化页面均无法 gzip ，因为 zlib 仅对动态页面有效，不如 mod_deflate 般可以通过设置实现多种类型文件的压缩。”

也就是说我不能装静态化插件？这个我在后面再测试，静态化插件是好东西，我在首页调用了外部js代码，如果没有静态插件的话，肯定速度上不去……

写完才想到，前面的动作产生的效果已经包括了html和htm的gzip！所以这似乎也不成为什么问题……等到我弄完缓存插件把php.ini删了就完了呗……

目标二.进一步提高载入效率

动作4

下面我准备对站点做静态化处理，大幅提高页面的载入速度。

由于前面的gzip已经会自动对html进行压缩了，所以不用费脑子。

我选择了cosbeta大人写的cos-html-cache插件，这玩意会自动在一个页面第一次被访问的时候产生一个静态文件，缺点是固定链接必须变更的像一个静态文件……就是以html或者htm结尾。

在安装这个插件之前得先安装Dean’s Permalinks Migration这个插件，否则固定链接变更会影响搜索引擎收录，但是这个插件可以帮你自动做301重定向，所以就没有问题了。

插件的安装非常简单，激活之后在设置页面指定老的固定链接即可，其他的插件会帮你完成的~

安装cos-html-cache插件的过程：

1.下载安装后重新指定WordPress的固定链接，具体位置在侧栏的“设置”中。链接的形式必须是以html或者htm结尾，前面要有个目录（否则链接都堆在根目录下，会死人的……），就像我设置的就是“/html/%post_id%.html”（不包含引号）
2.在网站根目录创建一个文件index.bak，权限为666.
3.大概是目录权限的问题，我的站没有自动生成html目录和index.html文件，手动创建之，权限变更为666.

基本就是这样了，安装理论上应该已经完成了，可是我碰到几个问题，目前还没解决。

1.首页无法生成静态页面，手动创建的index.html也会在一次刷新之后消失……
2.page页无法缓存，按理说应该会生成page名的目录并且在其中有index.html文件，可是我这没有，手动创建权限777的目录更是导致访问时找不到页面……

总的来说，至少post页面都成功缓存了~我是很容易满足的人……

动作5

最后我在FireFox的yslow测试结果中评级仍然不高，为什么呢？

我研究之后发现页面调用的js脚本太多了……并且wp Thread Comment插件中的js脚本做了php化处理，所以没有被归入gzip压缩过程，我最终是按照万戈的方法，在这个php文件的首尾分别加入如下代码解决：

在wp-thread-comment.js.php文件顶端加入

<?php if ( extension_loaded(‘zlib’) ) {ob_start(‘ob_gzhandler’);} header("Content-Type: text/javascript"); ?>

在末尾加入：

<?php if(extension_loaded(‘zlib’)) {ob_end_flush();} ?>

这样一来该php文件顺利的被前面创建的php.ini压缩了。

动作6

接下来需要解决的问题是HTTP requests过多的问题。

从yslow的报告来看，主要集中在js脚本文件上，居然多达十几个！

顺带说一句，我刚刚玩WordPress的时候曾经装了个貌似不错的插件，叫做add to any，可今天才知道，这个插件不但体积巨大，而且js还是从外部调用的！相当之恶心，所以我就删掉了它。

那么，就像上面说的，首先删除无用的，可以忽略的插件，好多貌似华丽的插件都是资源占用大户，像我这样的国外主机更是容易被其拖累在国内本就不快的访问速度。

接下来是减少http 请求，由于我这里主要是js泛滥，css样式表就三只^_^，所以就针对JS进行合并。

1.将所有需要加载的js文件代码复制到一个文件中并且将其命名为publish.js。（话说这里很糗的是我本来想着公用public的，结果打了个公布publish上去……不过反正一样，不管了）
2.在所有调用原js文件的地方将路径改成publish.js的路径。（具体做法就是在所有可能调用的文件中搜索原js文件名，改完以后重新载入看看原路径的js有没有消失。不过做好备份，因为要改代码，到时候很容易不知道自己错在哪里）
3.清楚静态页面文件夹。
4.完成~

好了，现在我的站即使国内访问也比较快了~

不过我仍然遇到了仍未解决的问题

cos-html-cache会生成两个无效的链接，不知何故，比较浪费资源（因为是返回404错误）。

一个无效链接指向cos-html-cache插件目录下的common.js.php文件，后面尾随一串hash值，似乎是脚本命令，但是却没有正确执行。举例如下：

http://iamwd.com/wp-content/plugins/cos-html-cache/common.js.php?hash=4b5eadc69f1effbbc2f30fd20a900a35

UP：该问题同样已经解决，经过作者cosbeta童鞋的指导，原来是因为我的blog处于独立目录下，导致需要修改插件的主文件，将其中common.js的目录修改成实际目录即可。

另一个指向不存在的目录中的共用脚本publish.js，举例如下：

http://iamwd.com/html/wordpress/wp-content/themes/publish.js

UP：第二条的问题已经没有了，原来是因为我错误的在除了header.php以外的地方多次调用了publish.js，怪不得，害得在IE下错误一堆……Firefox容错能力太好了有时候也不是什么好事啊~呵呵

不过，虽然仍然有些地方没弄懂，但经过N久的努力后，我终于把普通文章页面的整体大小压缩到了200kb以下~

首页还需要调整图片大小和文字长度……这些就没什么好说的了，很简单。

我本人也系编程白痴+WordPress菜鸟，这是我这次摸索的全过程，仅供参考，同时也是为了求助，板砖少敲，鲜花多送……

　　原文链接：WordPress站点速度优化攻略

轩邈阁 WDragon