使用CDN和AJAX加速WordPress中jQuery的加载-木庄网络博客

本文整理自网络，侵删。

确定要放在Head部分 ?

事实上最好的情况是，js文件都不要在<head>部分进行加载，否则会影响到head部分的载入速度，直接导致网站的内容（body）载入延迟。如果你确定你不需要在head部分载入jQuery，请将载入代码移动到</body>前，准确的说是第一个会用到jQuery函数的javascript代码前。

当然，如果你需要head部分加载jquery，也请确保所有的js文件，包括jquery，都要放在调用CSS文件的代码之后，来实现同步下载。这也是Google官方给出的建议。例如下面的加载不推荐：

<script src=jquery.js></script>

<link  .../>

而是应该使用:

<link  .../>

<script src=jquery.js></script>

确定不要异步加载 ?

异步加载不会阻塞网页的载入，而非异步加载则会在加载本身js之前短暂阻塞浏览器的网页载入。这可能影响浏览体验。

如果你的加载代码是

<script type="text/javascript" src="jquery.js"></script>

那么你需要知道这可不是异步加载的方式，这是一种同步加载。如果你不需要在页面加载后及时的调用jquery函数，你完全可以用异步加载的方式，使得网页onload之前才加载jquery，大大加快载入速度。这样的代码看起来像是Google Analytics的代码。

(function(doc){

var j =doc.createElement("script");

j.type = "text/javascript"; j.async = true; j.src = "jquery.js";

var s = doc.getElementsByTagName("script")[0];

s.parentNode.insertBefore(j, s);

})(document);

但是经我观察，大多数的时候我们需要同步加载，尤其是你还需要引入jQuery插件的时候。

使用哪个版本的jQuery ?

wordpress总是自带最新的jQuery库，每一个版本的使用方法总有细微的不同。越新的jQuery版本，性能提升也越高。不过，某些jquery插件可能不太兼容太新的插件，而它自己也没有推出更新。也许有些你会使用的方法函数，到了新版本发现已经被改变，曾经能工作的现在已经不能了。对于这种情况，应该遵从这样的原则，那就是在确保兼容性的同时，做到使用尽可能新的jQuery库。

例如你以前使用1.6.2版本的jquery，到了现在你发现2.X某些函数有改变，你又不愿意去变更代码，就最好逐个调试，例如你发现1.7.2的兼容性就不错。这个时候就可以抛弃1.6.2，可以用1.7.2版本的jQuery去替换掉2.X的新版。

使用哪个jQuery CDN库 ?

jQuery实在是太大了！如果你的网站速度不是飞快，jquery肯定会影响到你的页面加载速度。好在百度、新浪、微软、Google等公司都推出了公共js库，方便网站主调用来缩短下载时间，而它们本身有着超快的CDN服务器，节约了下载时间。

阅读剩余部分