走点路» WordPress优化

更换空间 + 再次提速之 Gravatar 头像缓存

Showfom — Wed, 02 Sep 2009 04:01:34 +0000

博客得追求速度，速度得靠空间和优化，最近网通有点抽风，为了心爱的博客，不得不再次提速。

这次搬家到易联了，Tension 开办的公司，暑假我去过他们公司蹭饭，见到可爱的秋爱大叔（听说他回老家了），顺便蹭饭蹭网哈哈。

小T长得一表人才的说，是个技术狂，哦不，是设计狂，做的几款主题都很精致，那天还吹牛说他直接写的主题能“完美兼容所有的浏览器”哈哈。

暑假去了趟北京，上回 WordCamp 又去了趟北京，真的和北京很有缘分。

以前用的酋长的空间挺不错的，但是最近网络抽风厉害，网通和电信的线路就这样了，易联的速度还过得去，当然我用电信的时候，Wopus 的速度和易联的速度还是差不多的，也就不多做评论了。

现在我博客的速度如何，至少我这里网通还是很快，上传速度是慢了点，不过没那么多东西要传，还是能忍受哈。

易联总共有三个套餐：http://www.elinkhost.com/

我买的是第二个：

顺便帮小T童鞋推广一下，购买付款之前，有个优惠码的选项，填写 Showfom.Com （注意大小写），即可获得85折的优惠，要是你博客流量不大，可以选择入门型的，一年就255块，很划算。

一起用易联的博友们有：异次元软件世界、Sivan、帕兰、 Sofish 等朋友，基本上都是认识的几个家伙，人品过得去，不会乱来的哈哈，所以可以放心使用啦。

空间问题算是解决了，接下来就要再次加快速度，继以前几篇优化的文章之后，这次教大家如何优化 Gravatar 头像本地缓存。

=========

上个月海底光缆断了，结果网通访问 Gravatar 超慢，博客留言里的头像基本都显示不了，假如能把头像直接缓存到本地，那速度绝对大大加快，那么能否实现这种功能呢？答案是肯定的。

首先，看一下默认 Gravatar 头像的地址，比如我的：

http://www.gravatar.com/avatar/8406d089bc81b664a2610b8d214c1428

可以看到，后面一串数字和字母的组合，就是 Email 的 md5 值，那么，只要用服务器下载来头像，然后直接用这种形式展现出头像，修改模板的 comments.php 文件，理论上很简单，实际上呢？也很简单……

说一下方法吧：

1、下载一个 GRAVATAR CACHE 的程序，注意，不是 WordPress 插件，只是一个缓存头像的程序。

下载地址：http://scott.yang.id.au/code/gravatar-cache/#toc-download

最新版本是 0.2 ，07年发布的，原理简单嘛，照样可以用。

2、下载以后解压，打开 index.php ，根据你的需要修改如下代码：

$config = array(
'gravatar' => 'http://www.gravatar.com/avatar.php',
'rating' => 'PG', //默认头像等级
'size' => 64, //默认头像宽度高度
'default' => '',
'border' => '',
'referrer' => '',
'pos_expiry' => 604800,
'neg_expiry' => 43200,
'neg_handler' => 'file',
'proxy' => '',
'basedir' => dirname(__FILE__),
'x-sendfile' => false,
'debug' => false
);

接着，在 profile 目录，创建一个名为 avatar.php 的文件，用非记事本输入以下字符：

$config['default'] = 'http://默认头像URL/'; //无头像时返回的默认头像路径
$config['rating'] = 'X';//gravatar的内容级别
$config['size'] = 50;//头像尺寸
?>

保存为 UTF-8 编码哦

接着，打开 .htaccess 文件：

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]

假如你存放的目录为 gravatar 则倒数第二行要修改为 RewriteRule . /gravatar/index.php [L]

然后上传即可

Nginx 下的规则是：

if (!-f $request_filename){
set $rule_0 1$rule_0;
}
if (!-d $request_filename){
set $rule_0 2$rule_0;
}
if ($rule_0 = "21"){
rewrite /. /index.php last;
}

接着后台修改主题文件的 comments.php，找到类似以下代码：

echo get_avatar( $comment, 50 ); ?>

替换成：

echo md5(strtolower($comment->comment_author_email)); ?>" alt="" />

即可。

假如你的主题符合 WordPress 2.7+ 标准，没有此代码，只有一行这样的代码：

wp_list_comments(); ?>

那么就得修改 comments.php 和 functions.php 了，甚至，可以参考一些 WordPress 2.7+ 的皮肤，留言样式是自定义的，比如 mg12 制作的 iNove 主题（他的留言样式都是自定义的，参考 comments.php 和 functions.php）

举个简单的例子：

comments.php 里自定义 wp_list_comments();

wp_list_comments(array ('type' => 'comment','callback' => 'custom_comments')); ?>

functions.php 里再自定义评论样式

// custom comments
function custom_comments($comment, $args, $depth) {
$GLOBALS['comment'] = $comment;
global $commentcount;
if(!$commentcount) {
$commentcount = 0;
}
?>

if($comment->comment_author_email == get_the_author_email()) {echo 'admincomment';} else {echo 'regularcomment';} ?>" id="comment- comment_ID() ?>">

echo md5(strtolower($comment->comment_author_email)); ?>" alt="" />

if (get_comment_author_url()) : ?>
comment_ID() ?>" class="url" href=" comment_author_url() ?>" rel="external nofollow">
else : ?>
comment_ID() ?>">
endif; ?>

comment_author(); ?>

if(get_comment_author_url()) : ?>

else : ?>

endif; ?>

具体的样式，即 functions.php 里的代码得参考你自己的评论样式，不再详细叙述，总之就是找到原来放置头像的地方，修改成：

comment_author_email)); ?>" alt="" />

即可

再不懂的，我也无能为力了，囧……WordPress 2.7+ 以后的 comments.php 就是麻烦……

（方法来自 iShawn 的博客：如何缓存 Gravatar 至本地服务器）

© from 走点路博客, 2009/09/02. | 更换空间 + 再次提速之 Gravatar 头像缓存 | 135 只留言鸟
Tags： Gravatar, WordPress优化, 缓存 | Link | .me 域名全国最低价，首年仅需40元，续费130元促销中！

优化你的 WordPress 之精简全站 HTML 代码（终极篇）

Showfom — Tue, 28 Jul 2009 12:01:14 +0000

WordPress 优化，优化主题的代码是关键一步，但是，假如按照我们设想的，完全把 HTML代码 进行优化，可读性一定很差，不利于二次修改，所以，本次推出终极优化 HTML 代码之优化小王子 —— Autoptimize。

至于最终的效果，大家可以看我的博客源代码，首页的，页面的，文章的，是不是感觉很杂乱，但是显示出来的效果并没有任何差异，在这个节省流量的年代，哪怕是一个字节都会影响到整个网络（Google 语），仔细观察 Google、百度这些超大流量的网站，他们的源代码无一不是和我现在博客的源代码类似。

那么，怎么做到呢？总不至于人工去合成吧（废话，那得花多少时间呀！），这时候，我们的优化小王子 —— Autoptimize 插件登场，蹬蹬蹬蹬！

======

Autoptimize 的工作原理

通过优化HTML代码（去除不必要的空格、换行、注释）、CSS代码、JS代码，缓存起来，然后访问的时候输出，访客访问到的是经过优化后的代码，很大程度上节省了流量，同时作者推荐和 WP Super Cache 插件一起使用。Showfom 小帅锅的建议是，流量不足3000IP之前不用考虑 WP Super Cache，使用 Autoptimize 进行代码优化以后然后gzip输出之，就很完美了。

Autoptimize 安装使用方法

下载，上传，激活，后台设置，WordPress 的插件就是如此简单。

下载地址：http://wordpress.org/extend/plugins/autoptimize/ （或者通过后台搜索 Autoptimize 在线安装，中文版由 Donald 翻译，下载在此：http://zuoshen.com/2009/07/20/642/）

设置讲解图：

Autoptimize 忌讳几则

1、假如样式出错，就不要选择优化 CSS 代码，自己优化是个好方法；同样，假如功能出错，请不要优化 JS 代码，自己优化是个好方法，至于自行优化 CSS 和 JS 代码，参考前文：《优化你的 WordPress 之压缩 CSS/JS 代码（进阶篇补充）》。

2、一般情况下，优化 HTML 代码是不会出错的，原理只是删除了多余的空格、空行和注释而已，假如出错，请自行检查不该优化的代码并且写入 JS。

3、Autoptimize 的原理只是前台进行优化，后台编辑主题里的代码不用修改，所以对于网页设计师来说，为了防止别人抄袭代码也好，为了节省流量提高速度也好，这款插件实在是必不可少。

========

PS：有个PLMM问偶，Showfom 小帅锅，你的做法是什么？

答：我的做法和我给出的图解一样，只是优化了 HTML代码 而已，因为不太会出错，CSS 和 JS 都是我自行优化的，谢谢你的崇拜。

再次PS：请确定主题确定功能以后再进行 WordPress 的代码优化工作，优化切记备份，优化后，前台直接看源代码可读性不是一般的差，所以，谨慎优化。至于什么 Yslow 这些可有可无的测试得分之类的，见他妈的鬼去吧，我才不会吃的空把所有图片都合并成一张，要 CSS 里只输出一张图片是个很费精力的活，雅虎那个东西，自己的首页的代码都那么乱七八糟，我就不评价了，一般75分以上就没问题了，放国内的空间速度都刷刷的……

再再次PS：优化 WordPress 主题的代码系列文章到此结束，接下来我也要学学缓存插件之类的优化，不过貌似人气没那么高以前，我也是懒得用缓存插件的人，所以，下一篇系列文章就要在以后和大家见面了，嘎嘎~

© from 走点路博客, 2009/07/28. | 优化你的 WordPress 之精简全站 HTML 代码（终极篇） | 90 只留言鸟
Tags： Autoptimize, WordPress, WordPress优化 | Link | .me 域名全国最低价，首年仅需40元，续费130元促销中！

优化你的 WordPress 之压缩 CSS/JS 代码（进阶篇补充）

Showfom — Mon, 27 Jul 2009 16:33:05 +0000

由于本人是个代码洁癖控+优化控，一旦确定使用某个主题以后，会彻底去优化他的代码（这时候从来没考虑过可读性）。

虽然现在的宽带1M、2M已经算不了什么，但是很多地方仍然使用512K甚至更低的网速，试想，一直小猫来访问你的网站，却要苦苦等待10多秒才能打开，也太那啥了吧，我曾经介绍过几个优化 WordPress 的文章：

优化你的 WordPress 之减少数据库查询次数（初级篇）

优化你的 WordPress 之精简 HTML 代码（进阶篇）

优化你的 WordPress 之减少数据库查询次数（中级篇）

优化你的 WordPress 之减少数据库查询次数（中级篇补充之 Object Cache）

最终的效果只是提高了 WordPress 的效率，在《优化你的 WordPress 之精简 HTML 代码（进阶篇）》一文中简单提到了要优化自己的HTML代码，作为一名超级代码洁癖控，怎么能容忍自己的 CSS 或者 JS 的代码的体积如此庞大，如此……

所以，经过摸索，Showfom 小帅锅 决定彻底优化自己的 CSS 和 JS 代码，现在首页只加载了一个 CSS 和 JS，并且去除了多余的累赘的重复的代码，最终效果如下：

//showfom.imgbed.com/v1/style.css

可以自行下载或者直接在 Firefox 中打开看效果，之前的体积有 14 KB 左右，经过妥善处理，现在体积只有 10KB 不到点，别小看这3、4KB，我想起了某个帅锅说过的一句话（其实你们知道是谁说的啦哈哈）：“优化如同女人的乳沟，挤一挤还是可以再优化的。”

那么，需要用到什么工具呢？本人的优化系列的一大好处就是，几乎没有任何专业知识，我只传授方法，不传授原理（因为鄙人不才，自己也不是很懂专业知识），压缩CSS的终极利器就是：CSSTidy，这是一个开源程序，使用C++编写，作者也放出了PHP版本，下载地址在这里，你可以下载C++的源代码自己进行编译，也可以把PHP版上传到自己的空间。

默认中文的只有繁体，所以我特意为大家翻译好了中文，并且上传至我的空间，没有多余空间的朋友也可以享福了，地址：

http://i.zou.lu/csstidy/

简体中文版CSSTidy下载点这里。

使用方法，进入 //showfom.imgbed.com/csstidy/ ，然后复制你的CSS代码，要稍微压缩的话直接点击执行，要最大化压缩（不在乎可读可修改性）的话，选择右边的压缩程度为最高，如图（以小众软件的CSS作为例子）：

点击执行以后，看页面下方，会输出精简但是并不阉割的CSS代码：

我们可以看到，原来21.934KB的CSS，可以精简到13.518KB，压缩比率: 38.4%，太帅了。

然后把精简过的 CSS 复制到后台 > 主题 > 编辑 > Style.css

切记，除非和我一样，把样式放到单独的文件夹然后头部引用的CSS也是放在其他文件夹，那么，WordPress 主题的 Style.css 必须满足头部信息的完整，就是前面几行注释一定得存在，否则读取不了主题就完了。

比如，小众软件这个CSS前面几行注释：

/*
Theme Name: DeepBlue fix
Author URI: http://www.nathanrice.net/
Version: 1.0
Author: Nathan Rice
Description: DeepBlue is a free theme by Daily Blog Tips.
The CSS/XHTML is released under GPL:

http://www.opensource.org/licenses/gpl-license.php

*/

必须存在，意思就是说，精简过的 CSS 代码中，把注释全部删除了，这几行得手工加在最前面，否则 WordPress 会读取不了主题。

OK，CSS精简完毕，那么，如何再Gzip之，使得传输的时候再次压缩，不断压缩减小体积才是我们的目的，这就得启动 Gzip 功能，以前也介绍过，像 WP Super Cache、Hyper Cache 这些插件里自带了 Gzip 功能，假如不用插件的话，可以用这几篇文章的方法

完美启用Gzip压缩JS、CSS

WordPress 提速之 Gzip 压缩

WordPress之终极Gzip兼容IE6

给 WordPress 开启 Gzip 功能

======

不但 CSS 可以这样压缩，JS 也同样可以，推荐在线压缩JS的网站：//showfom.imgbed.com/jsmin/，来自 JS Minifier javascript，英文版在这里：http://fmarcia.info/jsmin/test.html 中文版在这里： //showfom.imgbed.com/jsmin/

PS：谨慎使用超级压缩（Agressive），一般推荐普通压缩（Conservative）即可，就是默认的那个，复制你的js代码到框框里，然后点击JSMin压缩即可。

同样，JS 和 CSS 一个道理，也可以通过 Gzip 近一步压缩，这里我就不多介绍了。另外这里还有一个压缩 JS 的网站

再次PS：优化得有针对性，针对某个网站某个博客优化才是硬道理，虽然每个网站的代码不通用，但是优化的原理都是一样滴，今天就不推荐博客和推友了。

© from 走点路博客, 2009/07/28. | 优化你的 WordPress 之压缩 CSS/JS 代码（进阶篇补充） | 79 只留言鸟
Tags： WordPress, WordPress优化 | Link | .me 域名全国最低价，首年仅需40元，续费130元促销中！

优化你的 WordPress 之减少数据库查询次数（中级篇补充之 Object Cache）

Showfom — Mon, 25 May 2009 09:05:17 +0000

在《优化你的 WordPress 之减少数据库查询次数（中级篇）》一文中，提到了使用 DB Cache 来减少 WordPress 的php查询次数，本来这是一件好事，但是通过两天的测试（我这个小博客+两个流量较大的博客），发现 DB Cache 对评论的查询次数处理不是很好，每个文章页面假如评论过多，还是会产生额外的20、30次查询，所以，再次启用一个不算插件的插件 – Object Cache。

本文只介绍 Object Cache ，哎，我真是个花心的人，前天还把 DB Cache 爱的死去活来的，今天就被 Object Cache 这个小妖精给迷惑了。

严格意义上说，Object Cache 不是一个 WordPress 插件 ，他的全称是 File-Based Object Caching ，作者是 Mahmoud Al-Qudsi ，这老外的名字取的，默罕默德，我还阿尔法特呢……

但是 Object Cache 能有效减少 WordPress 的 php查询次数 ，而且针对每单篇文章更有效，引用一句广告台词，自从用了 Object Cache，咱博客腰不酸了，腿不痛了，一下次高潮达到5次，还不嫌累哦！

下载地址在这里：Download | 大陆镜像

着重讲讲安装方法：

Object Cache 需要手工安装，首先，上传 object-cache.php 至 wp-content 目录，然后在 wp-content 目录新建一个文件夹 cache （和 WP Super Cache 那个文件夹一样），需要有写入权限（777、755等）。

然后修改你博客根目录的 wp-config.php

加上这么一行：

// Enable the WordPress Object Cache，这是注释:
define('ENABLE_CACHE', true);

OK，看看 wp-content/cache 文件夹里有没有多出一些缓存文件，假如多出了，就说明安装成功，看看首页的效果吧：

5 queries in 0.619 seconds.

尽管只减少了一次查询，还是有所收获哈哈

其实最主要还是看你文章页面的查询，以前我都有20、30次，现在只有9、10次左右了，这个效果才是最明显的！

貌似默罕默德先生还有几个加速 WordPress 的插件，到时候再去测试测试，难道 Mr Mahmoud 是 WordPress 缓存夜总会的妈妈桑？不过提供的小姐质量确实不错！

PS：与本文无关的几句话

发现 WordPress 中国用户里对猫的感情特别深厚，我知道的就有：

Maozz LeeHow Maoxmao OOXX 等等，当然煎蛋里也都是猫迷，囧，今日就发两张猫猫的图片吧，猫猫很可爱的。

本文到此结束，这几天得休息休息，哎，昨晚失眠……

© from 走点路博客, 2009/05/25. | 优化你的 WordPress 之减少数据库查询次数（中级篇补充之 Object Cache） | 43 只留言鸟
Tags： WordPress, WordPress优化, WordPress插件 | Link | .me 域名全国最低价，首年仅需40元，续费130元促销中！

优化你的 WordPress 之减少数据库查询次数（中级篇）

Showfom — Sat, 23 May 2009 08:36:54 +0000

本文介绍如何使用正确的插件来减少 WordPress 的数据库查询次数，效果可以看我首页底部：

6 queries in 0.611 seconds

好了，进入正文。

1、DB Cache

在《优化你的 WordPress 之减少数据库查询次数（初级篇）》一文中，我提到了使用 WP Widget Cache 来减少侧边栏sidebar 的查询，但是，对没有使用 widget，或者不喜欢使用 widget 的朋友，WP Widget Cache 插件就没用了，所以，再介绍一款减少数据库查询次数的终极宝剑 —— DB Cache

看看作者的介绍吧：

This plugin caches every database query with given lifetime. It is much faster than other html caching plugins and uses less disk space for caching.
I think you've heard of WP-Cache or WP Super Cache, they are both top plugins for WordPress, which make your site faster and responsive. Forget about them - with DB Cache your site will work much faster and will use less disk space for cached files. Your visitors will always get actual information in sidebars and server CPU loads will be as low as posible.

简单淫荡翻译一下：

这个插件能长期缓存所有（真的吗？怀疑）数据库查询。比那些狗屁鸡巴HTML缓存插件快多了，而且占用的空间更小。

我想你可能听说过 WP-Cache 或者 WP Super Cache ，他们都是 WordPress 的热门插件，能使你的博客访问速度更快。忘了她们吧，直接投入偶的怀抱，相信我，在你的博客用 DB Cache 插件，一定会更快，缓存空间更小。当然，访客能获取实时的侧边栏，CPU 占有率也会很小。

再次用最淫荡的语言阐述一下：

大家好，我是 Miss DB Cache ，在 WordPress 夜总会工作，他们叫我性感小D，哎，都是那些臭男人，尤其是那个叫 Showfom 的家伙，每次都让人家很快进入高潮，哎呀，坏死了嘛。我有两个小姐妹，据说是双胞胎哦（要双飞吗？坏死了你。） Miss WP-Cache 和 Miss WP Super Cache 不过他们负责记住客人的相貌，而我能记住客人的内心世界。每次最先达到高潮的总是人家，这位大哥，要不要试试？不用带套哦。
PS：纯属虚构，望路过者笑之……

DB Cache 能缓存尽可能多的 php查询 ，官方解释是全部，我的解释是放屁。这不是一个 WP Widget Cache 就能搞定的，使用效果及其明显，尤其是首页，因为不用查询过多的评论，文章页面由于要查询过多的评论（前提是你的文章够热门），所以效果没首页那么明显。

DB Cache 的安装使用方法很简单，上传后台激活，然后选定 Enable 即可（如图）

记得 wp-content 文件夹 要有写入的权限，比如 666 755 777 ，这个我不是很懂，所以犯过一些错误哎。

默认会在中写入一句，比如

当然，我是不会用的，所以清空选项里 Load stats template 里的那句话即可。

效果很明显吧？

下载地址：http://wordpress.org/extend/plugins/db-cache/

2、WP Widget Cache

对于喜欢使用 Widget 的朋友，比如 Showfom 这个自恋的家伙，当然可以配合 WP Widget Cache 一起使用，效果良好，是出家写博的必备良药。

由于 WP Widget Cache 在 《优化你的 WordPress 之减少数据库查询次数（初级篇）》 一文中已经介绍使用，所以这里不多做介绍了。

直接上传后台激活启用即可，当然要用自己的 Widget ，否则缓存没作用

下载地址：http://wordpress.org/extend/plugins/wp-widget-cache/

3、WP Super Cache

WP-Cache 的升级版，所以就忘记 WP-Cache 吧。

基本上国内几个大的博客都使用 WP Super Cache ，优点很多，确实很快。我对 php 还不是很了解，原理也不是很懂，所以最简单的方法就是用我的那几个大流量的博客进行试验，结果发现 WP Super Cache 效果确实好，但是缺点是要改写 .htaccess ，对 Niginx 的童鞋，要自己去搜索 WP Super Cache for Nginx 的代码，而且目录权限要设置，有点高级插件的味道，但是确实不是吹的，速度一流，推荐大站和高手使用。

下载地址：http://wordpress.org/extend/plugins/wp-super-cache/

4、Hyper Cache

Hyper Cache 我使用了好几个月了，速度比 WP Super Cache 要慢上那么一点点，不过总体来说差不多，肉眼看不出哈哈。缺点嘛，用了以后不记录 cookies 每次评论都要再次输入，对一些交流性很强的互动型的博客不适用，当然有方法：WordPress 完全静态化后的 cookie 验证，只是我这个菜鸟用了半天还是不对，所以，我只对两个互动性不太大但是访问量较大的博客使用了 Hyper Cache ，嗯，速度也是一流的。

下载地址：http://wordpress.org/extend/plugins/hyper-cache/

5、COS-HTML-Cache

江东童鞋写的，不过我一直没用，所以不好发表评论，国内用的人还是比较多的，推荐试试，直接生成 html 哦。

下载地址：http://wordpress.org/extend/plugins/cos-html-cache/

6、总结

目前本博客使用的情况是：WP Super Cache

其中 DB Cache 和 WP Widget Cache 可以配合其他几个缓存插件使用，WP Super Cache、Hyper Cache 还有 COS-HTML-Cache 千万别混合使用，不然不只是 MJJ 的事情了……

7、申明

对 php 我不是很在行，所有插件都是亲自测试体验加上四个眼睛加上 Firebug 测试出来的结果，具体数据每个人情况不同就不写了，总是效果就是这样，如有异议，欢迎留言探讨，或许不久的将来，会出现高级篇哦。

8、为什么博主的技术类文章总是那么欠揍？

淫荡的人生，需要解释吗？

© from 走点路博客, 2009/05/23. | 优化你的 WordPress 之减少数据库查询次数（中级篇） | 30 只留言鸟
Tags： WordPress, WordPress优化, WordPress插件 | Link | .me 域名全国最低价，首年仅需40元，续费130元促销中！

优化你的 WordPress 之精简 HTML 代码（进阶篇）

Showfom — Mon, 11 May 2009 07:01:44 +0000

真是不用不知道，一用吓一跳，今天看了 Lightbox 2 的代码才知道，需要用到 4 个 JS ，总共将近 200 KB……所以，我义无反顾地把 Lightbox 2 禁用，本文将以及其猥琐的语言简单描述如何精简你的 WordPress 模板。

1、Header.php 精简

很多插件都是需要加载 js 和 css 的，而且默认就直接放到了函数里，这样做只是为了适合大众的主题，在个性化打造、精简自己的 WordPress 主题时，完全可以把主题目录里的 header.php 中的删除，而采用自己添加 js 和 css 。

(PS:删除以后 All in One SEO 插件的关键词和描述功能将失去作用，可以自行 SEO ，WP-PostViews 也会失去作用，目前头大中……)

由于 HTML 语言和大多数语言一样，采用的是自上而下的顺序，假如头部的 js 太大，那么访问者一开始就会花上几秒甚至十几秒钟的时间来加载你的 js 文件，同样适用 css 。那么，怎么精简呢？我的做法有五点：

1.别去用花哨功能的插件

比如上文提到的 Lightbox 2，启动这个插件，默认就会载入四个 js ，分别是

/wp-includes/js/prototype.js（121KB）

/wp-includes/js/scriptaculous/wp-scriptaculous.js（2.6KB）

/wp-includes/js/scriptaculous/effects.js（38.1KB）

/wp-content/plugins/lightbox-2/lightbox.js（20.8KB）

就为了这个华丽花哨的图片效果，就要载入近 200KB 的 js 文件，值得么？访客愿意花上好几秒钟先把这四个 js 加载完毕再等待正文的出现么？所以我的做法是直接把 Lightbox 2 禁用，当然，假如你非得使用，那么，请把上述四个 js 文件放到 footer.php ，别忘了还有一个 css ，下文会提及。

2.把 js 放在 footer.php 而不是 header.php

除了必要的几个需要加载在头部的文件（比如 css ），其余的实际上都可以放在底部，这样不但美观，而且 js 放在底部是不会影响整个网站的，在整个网页加载完毕以后照样完整显示效果，当然，这里必须注意次序问题，有些 js 的次序千万别颠倒，否则就没法使用，比如本站使用的 Sweet Titles 里的两个 js 文件的次序。

3.使用 Google Code 储存你的js

你的服务器带宽再怎么好，总比不上 Google 吧？所以，个人用户推荐把一些 js 文件直接放在 http://code.google.com/ 当中，比如，你很想使用 Lightbox 2，那么我已经帮你上传好这四个 js ，只要在 footer.php 的前插入

走点路» WordPress优化

更换空间 + 再次提速之 Gravatar 头像缓存

相关文章

优化你的 WordPress 之精简全站 HTML 代码（终极篇）

Autoptimize 的工作原理

Autoptimize 安装使用方法

Autoptimize 忌讳几则

相关文章

优化你的 WordPress 之压缩 CSS/JS 代码（进阶篇补充）

相关文章

优化你的 WordPress 之减少数据库查询次数（中级篇补充之 Object Cache）

相关文章

优化你的 WordPress 之减少数据库查询次数（中级篇）

相关文章

优化你的 WordPress 之精简 HTML 代码（进阶篇）