文章目录
一,方向
减少WP连接请求次数当前方法主要是:一是图片合并用CSS分割,二是合并CSS同JS。
图片合并CSS分割同本文无关,再加上都唔算是D乜技术,冇乜好都讲的。
合并CSS同JS,表面上就是并所有CSS文件合成一个,所有JS合成一个。如果你念住用手一个个来搞。。。你都傻的。。。晒心机挨眼训。。。
目标是自动、可控。效果可以直接右键睇我BLOG源码。
呢次用minify来做解决方案(自动合并兼压缩),下载网址:http://code.google.com/p/minify/
二,minify基本配置
将minify压缩包里边的min目录放到wordpress的根目录
进入min目录,打开config.php,改:
1 2 3 |
$min_enableBuilder = false; $min_cachePath = dirname(dirname(__FILE__)). '/cache/min'; |
解释:
dirname(dirname(__FILE__)) 是指上一级目录,就是wordpress的根目录。
/cache/min 是指缓存目录,有需要改成你自己钟意的。
三,源码
本来呢部分应该是做成插件形式的,不过个人情况唔同,我系整到主题的functions.php内的。
首先来处理CSS,以下函数自动解决head里的CSS,一般都系head加载CSS。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
function bd_minify_style() { global $wp_styles; $minifystyle = array(); foreach ((array)$wp_styles->registered as $thisstyle) { if (stristr($thisstyle->src, '/wp-content/')) { //排除条件 if ( stristr($thisstyle->src , '/bluedream/css/') ) { continue; } array_push($minifystyle, $thisstyle->src); wp_deregister_style($thisstyle->handle); } } $minifystyle = apply_filters('bd_minify_style', $minifystyle); $alen = count($minifystyle); if (0 < $alen) { $blogurl = get_bloginfo('url').'/'; echo '<link rel="stylesheet" href="'. $blogurl . 'min/?f='; $anow = 0; foreach ( $minifystyle as $src ) { echo str_replace( $blogurl , '', $src); if ( $anow != $alen-1 ) { echo ','; $anow++; } } echo '" type="text/css" media="all" />' . "\n"; } } add_action('wp_print_styles', 'bd_minify_style'); |
再来处理JS,只处理wp_footer的部分,因为一般JS都掉到尾部先加载。要系head加载的唔建议处理。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
function bd_minify_js() { $minifyjs = array(); global $wp_scripts; foreach ((array)$wp_scripts->registered as $thisscript) { if (stristr($thisscript->src, '/wp-content/')) { //排除条件 //if ( stristr($thisscript->src , '/bluedream/js/') ) //{ //continue; //} array_push($minifyjs, $thisscript->src); wp_deregister_script($thisscript->handle); } } //额外添加 //array_push($minifyjs, get_template_directory_uri() . '/js/bluedream_js.js'); $minifyjs = apply_filters('bd_minify_js', $minifyjs); $alen = count($minifyjs); if (0 < $alen) { $blogurl = get_bloginfo('url').'/'; echo '<script type="text/javascript" src="'. $blogurl . 'min/?f='; $anow = 0; foreach ( $minifyjs as $src ) { echo str_replace( $blogurl , '', $src); if ( $anow != $alen-1 ) { echo ','; $anow++; } } echo '"></script>'."\n"; } } add_action('wp_footer', 'bd_minify_js', 0); |
以上两段都好简单,唔觉得边度要解释,要讲的就是CSS同JS都系要用wp_enqueue_style同wp_enqueue_script来添加的。
一般负责的主题同插件的作者都会用佢来添加,不过世事无绝对,如果有边条CSS或者JS冇被自动处理,你自己查一下佢的代码,有需要果阵改下。