首页 电脑 电脑学堂 查看内容

Javascript无阻塞加载方式

2012-5-4 09:23 1181 0

摘要: 最近在看javascript高性能一书里面提到的javascript的加载方式很好。 现总结如下:1、YUI3的方式2、LazyLoad(1.5k)Yahoo!Search工程师Ryan Gro...
关键词: javascript 一个 LazyLoad 地址 文件 项目 LABjs 框架 模块 多个

最近在看javascript高性能一书里面提到的javascript的加载方式很好。 现总结如下:1、YUI3的方式2、LazyLoad(1.5k)Yahoo!Search工程师Ryan Grove创建的一个通用的延迟加载工具,是loadScript()函数的增强版。 用法示例:<script type="text/javascript" src="lazyload-min.js"></script><script type="text/javascript">    LazyLoad.js('the-reset.js', function(){        Application.init();    });</script>LazyLoad同样支持多个javascript文件,并能保证在所有浏览器中都可以按正确的顺序执行。要加载多个javscript文件,只需要给LazyLoad.js()y方法传入一个url数组:<script type="text/javascript" src="lazyload-min.js"></script><script type="text/javascript">    LazyLoad.js(['first.js', 'the-reset.js'], function(){        Application.init();    });</script>项目地址:https://github.com/rgrove/lazyload 3、LABjs(4.7k)LABjs是Kyle Simpson受Steve Sounders的启发实现的无阻塞加载工具。用法示例: <script type="text/javascript" src="lab.js"></script><script type="text/javascript">    $LAB.script('the-reset.js')        .wait(function(){            Application.init();        });</script>$LAB.script()方法用来定义需要下载的javascript文件,$LAB.wait()用来指定文件下载并执行完毕后所调用的函数。 要下载多个javscript文件,只需链式调用另一个$LAB.script()方法: <script type="text/javascript" src="lab.js"></script><script type="text/javascript">    $LAB.script('first.js')        .script('the-reset.js')        .wait(function(){            Application.init();        });</script>LABjs与众不同的是它管理依赖关系的能力。通常来说,连续的<script>标签意味着文件逐个下载并按顺序执行。 LABjs允许使用wait()方法来指定哪些文件需要等待其它文件。上面的例子中first.js不能保证会在the-reset.js的代码前执行,为了确保这一点,必须在第一个script()方法后调用wait(): <script type="text/javascript" src="lab.js"></script><script type="text/javascript">    $LAB.script('first.js').wait()        .script('the-reset.js')        .wait(function(){            Application.init();        });</script>项目地址:hhttp://labjs.com/ 4、SeaJS(7.5k)SeaJS 是淘宝玉伯开发的一个遵循 CommonJS 规范的模块加载框架,可用来轻松愉悦地加载任意 javascript 模块。详细请参考:http://seajs.com/docs/ 5、do 框架(3.5k)Do是豆瓣网kejun开发的一个很轻量的Javascript开发框架。目前do.min.js。它的核心功能是对模块进行组织和加载。加载采取并行异步队列的策略,并且可以控制执行时机。Do可以任意置换核心类库,默认是jQuery。 项目地址:https://github.com/kejun/Do 6、RequireJS(13.1k)项目地址:http://requirejs.org/摘自 dz45693的专栏
声明:文章版权归原作者所有 部分文章转自互联网 如有侵权请联系 [邮箱地址] 删除

路过

雷人

握手

鲜花

鸡蛋

最新评论

返回顶部