Javascript无阻塞加载具体方式

看了《高性能JavaScript》的读书笔记

几个原则：

1、将脚本放在底部

<link>还是在head中，用以保证在js加载前，能加载出正常显示的页面。

<script>放在</body>前。

2、成组脚本

由于每个<script>标签下载时阻塞页面解析过程，所以限制页面的<script>总数也可以改善性能。适用于内联脚本和外部脚本。

3、非阻塞脚本

等页面完成加载后，再加载js代码。也就是，在window.load事件发出后开始下载代码。

（1）defer属性：支持IE4和fierfox3.5更高版本浏览器

<script defer>...</script>

内联和外部文件

带defer属性的<script>可出现在文档的任何位置，对应的js文件将在<script>被解析时启动下载，但代码不会执行，直到DOM加载完毕（在onload事件句柄被调用之前）。所以实现了和也卖弄其他资源一起并行下载。

（2）动态脚本元素

文档对象模型（DOM）允许你使用js动态创建HTML的几乎全部文档内容。

（3）The YUI3 approach

理念：用一个很小的初始代码，下载其余的功能代码，先引入文件：

使用：

The LazyLoad library

使用：先引入：lazyload-min.js

(4)

先引入：lab.js

他的独特之处在于能够管理依赖关系。

可以通过wait()函数指定哪些文件应该等待其他文件。

例如：b.js的代码保证不在a.js之前运行