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

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

 

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 主题的代码系列文章到此结束,接下来我也要学学缓存插件之类的优化,不过貌似人气没那么高以前,我也是懒得用缓存插件的人,所以,下一篇系列文章就要在以后和大家见面了,嘎嘎~


.De域名注册

相关信息

已有90条评论

  1. huaimao CHINA Mozilla Firefox Windows 发表于2009年07月28日20:04

    哈哈!偶先来占位!

    改天详细阅读!

    [回复]

  2. 章鱼 CHINA Mozilla Firefox Windows 发表于2009年07月28日20:08

    板凳还是要做的 :grin:

    [回复]

    章鱼 CHINA Mozilla Firefox Windows 回复:

    @章鱼, 贱人 :mad:

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @章鱼, 自己骂自己贱人,哎……

    [回复]

  3. ZH CEXO CHINA Google Chrome Windows 发表于2009年07月28日20:08

    我还是来晚了,下次给我沙花 :grin:

    [回复]

  4. magehao CHINA Internet Explorer Windows 发表于2009年07月28日20:10

    都这么厉害···

    [回复]

  5. 洪涛 CHINA Internet Explorer Windows 发表于2009年07月28日20:10

    真的有用么?

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @洪涛, 你试试访问我的博客速度如何呗。

    [回复]

  6. Cat. CHINA Mozilla Firefox Windows 发表于2009年07月28日20:12

    现在追求的不是数据查询的多少了,是PHP执行的效率,这个才是关键啊...WP的执行效率太低了~

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @Cat., 效率归效率,不是这个文章的重点,这个文章的重点是精简HTML代码,减少输出的体积 嘎嘎

    [回复]

  7. 石老人 CHINA Google Chrome Windows 发表于2009年07月28日20:12

    好厉害,先mark一下,吃完饭回来研究一下

    [回复]

  8. Cat. CHINA Mozilla Firefox Windows 发表于2009年07月28日20:13

    不过你的网站在国内,已经很快了...你还真有空折腾啊~暑假真好

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @Cat., 那是,追求用最少的字节来达到最美的效果,是我的目标 嘎嘎~~ :mrgreen:

    [回复]

    Cat. CHINA Mozilla Firefox Windows 回复:

    @Showfom, 我在想办法讲数据查询的速度将到0.1秒以下...看看DZ论坛吧..太恐怖了~

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @Cat., DZ 的效率不是一般的好,PW 的也一样,其实我教你,用 DZ 的内核,做个符合博客的皮肤,然后……哦哈哈

    [回复]

  9. icebugger CHINA Google Chrome Windows 发表于2009年07月28日20:14

    看了你blog的src,果然很乱很简短。。。

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @icebugger, 乱米关系,只要效果对就可以了,这个插件最大的好处就是,后台主题管理里的代码是很完整的。

    [回复]

    Cat. CHINA Mozilla Firefox Windows 回复:

    @Showfom, 嗯嗯,我知道吖,意思就是叫你去折腾这个...

    [回复]

    icebugger CHINA Google Chrome Windows 回复:

    @Showfom, 哇,这样的话就大赞了~

    [回复]

  10. Donald CHINA Opera Windows 发表于2009年07月28日20:35

    :oops: 我是路过的。我强烈支持任何给我一个链接的朋友,嗯,特别是小锅~

    [回复]

  11. 章鱼 CHINA Mozilla Firefox Windows 发表于2009年07月28日20:37

    强烈建议把sweet title和下面的无用工具栏关掉

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @章鱼, 关你个毛。

    [回复]

    章鱼 CHINA Mozilla Firefox Windows 回复:

    @Showfom, 加载JS是罪恶

    [回复]

  12. 章鱼 CHINA Mozilla Firefox Windows 发表于2009年07月28日20:38

    你那个ST有个JS+CSS 我操

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @章鱼, 本来就是js+css的,咋了,日。

    [回复]

    章鱼 CHINA Mozilla Firefox Windows 回复:

    @Showfom, 慢死 我日

    [回复]

  13. Joya CHINA Mozilla Firefox Windows 发表于2009年07月28日20:48

    外行慢慢研究中.... :oops:

    [回复]

  14. 小峰JoysBoy CHINA Google Chrome Windows 发表于2009年07月28日20:58

    那个WP Super Cache我感觉也没啥用,主要我博客没多少人看

    [回复]

  15. 小明猪 CHINA Mozilla Firefox Windows 发表于2009年07月28日20:59

    学习一下,不过你的那句"谢谢你的崇拜。".........我好囧

    [回复]

  16. 小猪vs蛋挞 CHINA Safari Mac OS 发表于2009年07月28日22:07

    这些东西不知道要啃多久了,看了5分钟就看不下去了,汗,不过进步了,上次看了3分钟..... :evil:

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @小猪vs蛋挞, 囧 这次介绍的多简单,启动一个插件就是了。 :mrgreen:

    [回复]

    小猪vs蛋挞 CHINA Safari Mac OS 回复:

    @Showfom, 所以偶看了5分钟,走马观花也算看完了,我汗...唉,学习真累....

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @小猪vs蛋挞, 谁要你是文科生的 嘎嘎 :arrow:

    [回复]

    小猪vs蛋挞 CHINA Safari Mac OS 回复:

    @Showfom, 是啊,谁叫我是文科生的....啊啊啊啊啊啊 :cry:

    [回复]

  17. LAONB CHINA Mozilla Firefox Windows 发表于2009年07月29日00:35

    这两天天热,没开QQ,竟然连板凳都没了。 :mad: 所有的SHOPEX的代码都是这样,不知道会不会影响蜘蛛爬行,最好模拟下蜘蛛的访问。

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @LAONB, 影响个毛。自己爱测试就测试去。

    [回复]

    LAONB CHINA Internet Explorer Windows 回复:

    @Showfom, 我才懒得测呢,看这乱七八糟的代码心情不爽 :grin:

    [回复]

  18. 我爱娱乐人 CHINA Internet Explorer Windows 发表于2009年07月29日08:39

    慢慢研究中

    [回复]

  19. 美国VPS推荐 CHINA Internet Explorer Windows 发表于2009年07月29日08:49

    大早晨就占满座了,早起的鸟有虫吃啊 :oops:

    [回复]

  20. Dwin CHINA Internet Explorer Windows 发表于2009年07月29日09:34

    :mrgreen: 有空俺也试试

    [回复]

  21. 久酷 CHINA Mozilla Firefox Windows 发表于2009年07月29日16:34

    先来报个到哈,这里真热闹,你这是用的酋长的主机?

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @久酷, 嗯 国内的。

    [回复]

  22. 北方熊之舞 CHINA Internet Explorer Windows 发表于2009年07月29日17:44

    做记号先~改天好好学习~

    [回复]

  23. shun CHINA Opera Windows 发表于2009年07月29日17:48

    Autoptimize真的很方便
    不用瞎折腾 :shock:

    [回复]

  24. zwwooooo CHINA Mozilla Firefox Windows 发表于2009年07月29日18:56

    貌似很不错的插件,试试去

    [回复]

  25. zwwooooo CHINA Mozilla Firefox Windows 发表于2009年07月29日19:07

    试了一下,貌似快了很多,只能优化html,优化css会出错。

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @zwwooooo, 个别主题插件的话,js也可以的,css看主题写的css是否规范,不规范就出错了。

    [回复]

    zwwooooo CHINA Mozilla Firefox Windows 回复:

    @Showfom, 我也不知道规不规范,反正通过css2.1验证。我现在用你另外介绍的工具给css瘦身。

    [回复]

  26. Thinkqob CHINA Mozilla Firefox Windows 发表于2009年07月29日20:25

    我装的插件够多多了 不过这个还是可以试试的

    [回复]

  27. 回憶 CHINA Mozilla Firefox Windows 发表于2009年07月29日21:24

    在群裏看見了,有時間搞下 :grin:

    [回复]

  28. 牛雜檔CEO CHINA Mozilla Firefox Windows 发表于2009年07月29日22:49

    不要说是你原创啊

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @牛雜檔CEO, 你废话,本来就是我原创啊

    [回复]

  29. Leeiio CHINA Mozilla Firefox Windows 发表于2009年07月30日00:31

    使用中,感谢推荐。

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @Leeiio, 记得检查是否会有错误,我昨天试过,阿里妈妈的广告就会显示不正常的

    [回复]

  30. 博译论 CHINA Mozilla Firefox Windows 发表于2009年07月30日03:04

    歇斯底里的完美主义

    顺便:日你学校,这么早开学

    再顺便:beat it是开打还是开溜?!

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @博译论, Michael Jackson 的 Beat It 嘎嘎 这开学不早吧,20多号也。

    [回复]

  31. 365hope CHINA Internet Explorer Windows 发表于2009年07月30日08:52

    Wordpress 优化,永远是个不朽的话题,因为大家都想更多地被搜索到的。

    本文一些方法+技巧,还是非常使用的,研究研究吧! :idea:
    另,兄弟有侧边栏上的'倒计时"非常漂亮,使用的是哪个插件啊?舍得公开一下吗??

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @365hope, 一个Flash而已,这个也要用插件的话也就太那啥了…… :idea:

    [回复]

  32. laofan CHINA Internet Explorer Windows 发表于2009年07月30日12:20

    学习了,莫非你就是传说中的高手

    [回复]

  33. 快活林主人 CHINA Internet Explorer Windows 发表于2009年07月30日12:20

    :grin: 不错不错,哈,我研究研究

    [回复]

  34. 万戈 CHINA Mozilla Firefox Windows 发表于2009年07月31日06:41

    我对这个很有兴趣,不是因为优化,是因为加密源码,不错不错 :mrgreen:

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @万戈, 囧 没加密呀 只是删除不必要的空格和换行,然后优化了css和js的代码…… :arrow:

    [回复]

  35. bolo CHINA Mozilla Firefox Windows 发表于2009年07月31日16:48

    不如直接把所有代码都压缩了

    [回复]

  36. simaopig CHINA Mozilla Firefox Windows 发表于2009年07月31日16:48

    疯子,搞那么多优化干什么。嗯。。

    [回复]

  37. 妖狐闪现 CHINA Mozilla Firefox Windows 发表于2009年07月31日21:29

    学习一下:-)

    [回复]

  38. 小Bee CHINA Mozilla Firefox Windows 发表于2009年08月2日13:47

    我开启了 Autoptimize之后...邮件回复会失效...

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @小Bee, 别优化js即可 我试过~~

    [回复]

    小Bee CHINA Mozilla Firefox Windows 回复:

    @Showfom, 你的邮件回复用哪个插件呢?

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @小Bee, 我是嵌套回复+回复邮件集一身的 WordPress Thread Comment

    [回复]

  39. keelii CHINA Mozilla Firefox Windows 发表于2009年08月3日11:12

    我都没优化过代码。做主题的时候一次搞定^!^

    [回复]

  40. 木頭龍 CHINA Mozilla Firefox Windows 发表于2009年08月5日20:00

    啊哈哈,这个插件恰好帮我解决了头疼很久的cos html cache不缓存首页和page页的问题,只是效率没有那么高而已~
    这个插件应该有缓存的吧~
    哦啦~开心~

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @木頭龍, 嗯,有缓存的啦 哈哈

    [回复]

  41. 所以说 CHINA Internet Explorer Windows 发表于2009年08月14日14:49

    WP Super Cache 我觉得小站也是有必要做的。。这个目的不是减少流量,是数据库查询量

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @所以说, :oops: 大家都能这么做就好了。

    [回复]

  42. 风之幻龙 CHINA Internet Explorer Windows 发表于2009年08月15日17:35

    看了你这几篇优化的文章,很实用,支持下~~
    很喜欢你的写作风格的说,哈~

    [回复]

  43. whisperer CHINA Internet Explorer Windows 发表于2009年08月15日20:04

    这个℃蛮有创意~~

    说起优化我就得汗颜了

    抱着你们的教程回家啃去。。。 :mad:

    [回复]

  44. 妖狐闪现 CHINA Google Chrome Windows 发表于2009年09月4日09:37

    哈哈,太好了,这样我就不用每次改完js再去压缩了。

    [回复]

  45. whisperer CHINA Internet Explorer Windows 发表于2009年09月19日16:17

    成功减小了5KB,汗~~~~ :shock:

    来看下lss~~ :evil:

    [回复]

  46. 善用佳软 CHINA Google Chrome Windows 发表于2009年09月19日20:22

    看了一下源代码,果然与众不同。
    一方面增加华丽的效果,一方面精简代码,这是怎样的一种折腾精神啊!

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @善用佳软, 无折腾 不人生~ :oops:

    [回复]

  47. chancat CHINA Google Chrome Windows 发表于2009年11月1日23:42

    汗,原来是作甚 这家伙汉化的 。、。

    [回复]

  48. chancat CHINA Internet Explorer Windows 发表于2010年01月3日22:24

    我想知道怎么卸载它

    [回复]

    Showfom CHINA Mozilla Firefox Windows 回复:

    @chancat, 直接停用就卸载了

    [回复]

  49. chancat CHINA Internet Explorer Windows 发表于2010年01月6日21:50

    :arrow: 那么简单还用问你么 - -! 被定义死了 我换玉米换主机 OVER

    凸 MJJ 话说 你和酋长一样 猥琐 :-D

    [回复]

  50. 离鸣 CHINA Mozilla Firefox Windows 发表于2010年01月7日10:52

    谢谢分享,我也用了这个插件 :-D

    [回复]

  51. 灵亦rEd CHINA Mozilla Firefox Ubuntu Linux 发表于2010年06月5日14:29

    :mrgreen: 不错的文章。。表情也很不错。。表情怎么弄的哦 :idea:

    [回复]

  52. 周哥哥 CHINA Internet Explorer Windows 发表于2010年07月30日21:31

    我的网站4399nn.com使用Autoptimize结果头部文件错误,难道是空间的问题?

    [回复]

欢迎写下您的评论,其中 * 为必填项目

这里写下你想说的话

:wink: :-| :-x :twisted: :) 8-O :( :roll: :-P :oops: :-o :mrgreen: :lol: :idea: :-D :evil: :cry: 8) :arrow: :-? :?: :!:


Follow us on Twitter