此文为“小站提速手记”系列的第二篇，上篇为《小站提速手记之 —— 合并 CSS》。

我们可以简单来回顾下：为什么要合并CSS？

话说“一个页面多调用一个CSS或者JS或者图标，不管是大是小，都会延长打开时间0.2秒”。由此可知，如果把一个小站的一个页面所需的CSS合并起来，那将大大提高页面打开的时间！

当然，也许喜欢折腾WP的你早就想到这里还存在着一个矛盾，只是苦于没有好的解决办法，这个矛盾就是：我们合并CSS后，全站每个页面都都只需加载一个CSS文件就够了，这显然比之前得加载多个CSS快多了，然而同时也会出现拖慢某些特定页面

假如我们合并了很多“评论”、“侧边栏”或者“文章分页导航”插件的CSS，而合并这些CSS后将会严重拖慢没有“评论”、“侧边栏”或者“文章分页导航”这些特定页面的加载速度！

也许，可能，上段文字表述的有点拗口。那来举个实例，同时来说明：为什么要按需加载CSS？

首先，我们一起来分析下WordPress的“首页”和“文章页”：

相同：两个页面一般都加载了页首（header.php）、侧边栏（sidebar.php）和页脚（footer.php），所以这些部分的CSS代码片段它们都是需要的；

区别：显然是它们的主体部分，显然的一点就是评论部分！折腾过WordPress主题的都肯定知道一个主题中关于评论部分的CSS有多少吧？还有比如说，首页有分页导航，文章的展示也完全跟文章页不同等等。

那，我们该怎么做呢？呵呵，当然是俺提出的“按需加载CSS”啦！我们的终极目标是：

绝不加载一个页面中不需加载的CSS代码，去除完全不影响这个页面显示的CSS代码！

实现这个目标当然是需要一定的CSS知识的，至少你要弄清哪部分CSS代码定义了哪部分的显示，这是一个门槛，也是此方法的一个折腾之处！

看到这也许有些童鞋要发难了，那到底怎么做呀，你倒是速度说呀？申明，由于此方法的原理实在是简单，就是加个php的判断语句而已，比如说：

<?php if (is_home()) { ?>
<link rel="stylesheet" href="http://immmmm.com/wp-content/themes/simplelines/style-index.css" type="text/css" />
<?php } elseif( is_single() ) { ?>
<link rel="stylesheet" href="http://immmmm.com/wp-content/themes/simplelines/style-single.css"  type="text/css" />
<?php } elseif( is_category() || is_archive() || is_search() ) { ?>
<link rel="stylesheet" href="http://immmmm.com/wp-content/themes/simplelines/style-category.css"  type="text/css" />
<?php } elseif( is_page(1072) ) { ?>
<link rel="stylesheet" href="http://immmmm.com/wp-content/themes/simplelines/style-links.css"  type="text/css" />
<?php } else { ?>
<link rel="stylesheet" href="http://immmmm.com/wp-content/themes/simplelines/style.css" type="text/css" />
<?php } ?>

以上判断是加在header.php里的相应位置的，怎么个相应发？自个儿折腾哦！好，不岔开。上面这段代码什么意思呢？就是当打开的是首页时加载style-index.css这个CSS文件，打开文章页时加载style-single.css，打开文类也、归档页或者搜索结果页时加载style-category.css，打开页面且其ID=1072时加载style-links.css，其它页面加载style.css。

如果看懂了上上段代码或者上段文字，那你应该知道“按需加载CSS”修改时的顺序了吧？先把所有CSS合并起来，然后具体分析首页到底需要哪些CSS代码，去掉合并后CSS文件中不需要的代码，然后再具体分析文章页……

最后，我想告诉用WordPress的各位童鞋：想愁有一天会没东东让你折腾？那是不可能地！！！

PS1：其实本文中提到的终极目标，还可以拓宽下，就是：绝不加载一个页面中不需加载的CSS以及JS，去除完全不影响这个页面显示的CSS及JS代码！相关文章链接：《WP 提速之按需合并压缩 JS 文件》

PS2：遐想，以后WordPress主题的设计者直接使用这种办法多好呀！