压缩CSS和JS代码及加快wordpress的速度

触手所及 | April 3, 2007

首先通过以下工具判断自己的网站需不需要做些提速。

检查页面是否被压缩输出的工具—“Real-Time Compression Check”,可提示页面被压缩前后将会提升的传输速度;预估压缩百分比;显示不同的带宽下压缩前后的对比速度。

在线网页分析工具—“ Web Page Analyzer”,可用来查看页面中的HTML、JS、CSS代码和图片的size,计算出不同的带宽下的加载速度,并给出优化网页,speed up的建议。

如果需要提速,除了

1.尽量减少加载的css,image,js的数量(减少插件,或合并文件)

2.使用wp-cache(不推荐)

3.通过wordpress自带的压缩功能压缩php代码:
在管理界面的 Options->Reading选项中,开启WP自带的压缩功能(WordPress should compress articles (gzip) if browsers ask for them)

4.最有效的是,压缩CSS,image,js的大小:
1)
利用CSS Tweak压缩CSS代码,注意。为了方便自己编辑,最好保留一份未经过压缩的代码。
利用Shrinksafe 压缩JS代码,同样的,最好保留未经过压缩的JS代码,以便将来更改时候便于阅读。
2)在php文件头加上ob_start(’ob_gzhandler’);使用wordpress自带的压缩功能压缩css和js。

比如对style.css进行压缩
A)把style.css复制一份,命名为style.css.php
在style.css.php顶部加入这句:
< ?php if(extension_loaded('zlib')) {ob_start('ob_gzhandler');} header("Content-type: text/css"); ?>
在最后加上
< ?php if(extension_loaded('zlib')) {ob_end_flush();} ?>
复制代码时需去掉<后面的空格
B)按照下面的方式修改header.php中的css连接
原来的: 修改后的: 现在你的CSS就可以被gzip压缩了。

JS也可以使用同样的方法,只是在xx.js.php头部加入的应该是这样:
< ?php if ( extension_loaded('zlib') ) {ob_start('ob_gzhandler');} header("Content-Type: text/javascript"); ?>
复制代码时需去掉<后面的空格


J for J的個人生活, 始于公元2001. | Permalink
……更多文章,在 触手所及中找啦 | del.~ | Tech~
……或者查看標簽: .


嘿嘿……

JunePoetry

『静极--谁的叹嘘?

密西西比河此刻风雨,在那边攀援而走。
地球这壁,一人无语独坐。』

-- 昌耀《斯人》

令人感动的诗歌,继续阅读J推荐的诗歌»

Leave a Reply

垃圾留言渐增,烦请留下姓名和email(支持Gravatar头像)。

  • :em01:
  • :em02:
  • :em03:
  • :em04:
  • :em05:
  • :em06:
  • :em07:
  • :em08:
  • :em09:
  • :em10:
  • :em11:
  • :em12:
  • :em13:
  • :em14:
  • :em15:
  • :em16:
  • :em17:
  • :em18:
  • :em19:
  • :em20:
  • :em21:
  • :em22:

CC.All trademarks and copyrights on this page are owned by their respective owners. Comments are owned by the Poster.
The rest copyright © 2001 - 2008 J's Life, powered by WP. Theme: night or light. Entries RSS.