压缩CSS和JS代码及加快wordpress的速度
首先通过以下工具判断自己的网站需不需要做些提速。
检查页面是否被压缩输出的工具—“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"); ?>
复制代码时需去掉<后面的空格
