SeaJS 与 RequireJS 的差异对比


Posted in Javascript onDecember 08, 2014

“历史不是过去,历史正在上演。随着 W3C 等规范、以及浏览器的飞速发展,前端的模块化开发会逐步成为基础设施。一切终究都会成为历史,未来会更好。”——引用玉伯原文最后一段话,我个人也非常赞同。既然谈到了“未来”,我个人认为:前端 js 模块如果继续发展,其模块格式很可能会成为未来 WEB 一种标准规范,产生多种实现方式。就好比 JSON 格式一样,最终成为标准、被浏览器原生实现。

谁更有能成为未来的异步模块标准?SeaJS 遵循 CMD 规范,RequireJS 遵循 AMD 规范,先从这两种不同的格式说起。

CMD

CMD 模块依赖声明方式:

define(function (require) {

    var a = require('./a');

    var b = require('./b');

    // more code ..

})

CMD 依赖是就近声明,通过内部require方法进行声明。但是因为是异步模块,加载器需要提前加载这些模块,所以模块真正使用前需要提取模块里面所有的依赖。无论是加载器即时提取,还是通过自动化工具预先提取,CMD 的这种依赖声明格式只能通过静态分析方式实现,这也正是 CMD 的弊端所在。

CMD 规范的弊端

不能直接压缩:require是局部变量,意味着不能直接的通过压缩工具进行压缩,若require这个变量被替换,加载器与自动化工具将无法获取模块的依赖。
模块书写有额外约定:路径参数不能进行字符串运算,不能使用变量代替,否则加载器与自动化工具无法正确提取路径。
规范之外的约定意味着更多的文档说明,除非它们也是规范中的一部分。

注:SeaJS 静态分析实现是把模块包toString()后使用正则提取require部分得到依赖的模块路径。

AMD

AMD 模块依赖声明方式:

define(['./a', './b'], function (a, b) {

    // more code ..

})

AMD 的依赖是提前声明。这种优势的好处就是依赖无需通过静态分析,无论是加载器还是自动化工具都可以很直接的获取到依赖,规范的定义可以更简单,意味着可能产生更强大的实现,这对加载器与自动化分析工具都是有利的。

AMD 规范的弊端

依赖提前声明在代码书写上不是那么友好。
模块内部与 NodeJS 的 Modules 有一定的差异。
关于第二点的问题需要特别说明下。其实无论是 CMD 还是 AMD 的异步模块,都无法与同步模块规范保持一致(NodeJS 的 Modules),只有谁比谁更像同步模块而已。AMD 要转换为同步模块,除了去掉define函数的包裹外,需要在头部使用require把依赖声明好,而 CMD 只需要去掉define函数的包裹即可。

总结

SeaJS 与 RequireJS 的差异对比

从规范上来说,AMD 更加简单且严谨,适用性更广,而在 RequireJS 强力的推动下,在国外几乎成了事实上的异步模块标准,各大类库也相继支持 AMD 规范。

但从 SeaJS 与 CMD 来说,也做了很多不错东西:

1、相对自然的依赖声明风格
2、小而美的内部实现
3、贴心的外围功能设计
4、更好的中文社区支持

如果有可能,我希望看到 SeaJS 也支持 AMD,与前端社区大环境保持一致最终幸福的是广大开发者。

Javascript 相关文章推荐
google地图的路线实现代码
Aug 20 Javascript
工作中常用到的JS表单验证代码(包括例子)
Nov 11 Javascript
Jquery中LigerUi的弹出编辑框(实现方法)
Jul 09 Javascript
javascript一元操作符(递增、递减)使用示例
Aug 07 Javascript
简单的代码实现jquery定时器
Nov 17 Javascript
js中replace的用法总结
Dec 27 Javascript
js实现鼠标感应向下滑动隐藏菜单的方法
Feb 20 Javascript
AngularJs 国际化(I18n/L10n)详解
Sep 01 Javascript
浅谈js对象的创建和对6种继承模式的理解和遐想
Oct 16 Javascript
Bootstrap Table使用方法解析
Oct 19 Javascript
解决vue.js 数据渲染成功仍报错的问题
Aug 25 Javascript
elementUI 动态生成几行几列的方法示例
Jul 11 Javascript
JavaScript中的ArrayBuffer详细介绍
Dec 08 #Javascript
JS实现仿京东淘宝竖排二级导航
Dec 08 #Javascript
js继承call()和apply()方法总结
Dec 08 #Javascript
ANGULARJS中用NG-BIND指令实现单向绑定的例子
Dec 08 #Javascript
详解Javascript动态操作CSS
Dec 08 #Javascript
jquery.ajax之beforeSend方法使用介绍
Dec 08 #Javascript
实例讲解JQuery中this和$(this)区别
Dec 08 #Javascript
You might like
ZF等常用php框架中存在的问题
2008/01/10 PHP
php 数组的创建、调用和更新实现代码
2009/03/09 PHP
PHP下编码转换函数mb_convert_encoding与iconv的使用说明
2009/12/16 PHP
THINKPHP+JS实现缩放图片式截图的实现
2010/03/07 PHP
分享五个PHP7性能优化提升技巧
2015/12/07 PHP
php微信公众平台示例代码分析(二)
2016/12/06 PHP
javascript KeyDown、KeyPress和KeyUp事件的区别与联系
2009/12/03 Javascript
为JavaScript添加重载函数的辅助方法
2010/07/04 Javascript
jqPlot 图表中文API使用文档及源码和在线示例
2012/02/07 Javascript
jquery 获取dom固定元素 添加样式的简单实例
2014/02/04 Javascript
jQuery通过ajax快速批量提交表单数据
2016/10/25 Javascript
网站申请不到支付宝接口、微信接口,免接口收款实现方式几种解决办法
2016/12/14 Javascript
高效的jQuery代码编写技巧总结
2017/02/22 Javascript
jQuery弹出窗口简单实现代码
2017/03/09 Javascript
jQuery EasyUI Layout实现tabs标签的实例
2017/09/26 jQuery
JS实现全屏预览F11功能的示例代码
2018/07/23 Javascript
js屏蔽退格键(backspace或者叫后退键与F5)
2019/02/10 Javascript
vue集成kindeditor富文本的实现示例代码
2019/06/07 Javascript
vue+elementUI 实现内容区域高度自适应的示例
2020/09/26 Javascript
[01:44]Ti10举办地公布
2019/08/25 DOTA
Python多进程编程技术实例分析
2014/09/16 Python
python 性能优化方法小结
2017/03/31 Python
Python模拟三级菜单效果
2017/09/11 Python
对Pandas DataFrame缺失值的查找与填充示例讲解
2018/11/06 Python
Python作用域与名字空间原理详解
2020/03/21 Python
python列表删除和多重循环退出原理详解
2020/03/26 Python
vivo智能手机官方商城:vivo
2016/09/22 全球购物
农民工工资支付承诺函
2014/03/31 职场文书
关于安全演讲稿
2014/05/09 职场文书
自我介绍演讲稿范文
2014/08/21 职场文书
护士工作失误检讨书
2014/09/14 职场文书
2015年重阳节活动总结
2015/03/24 职场文书
2015年高中班主任工作总结
2015/04/30 职场文书
将图片保存到mysql数据库并展示在前端页面的实现代码
2021/05/02 MySQL
python常见的占位符总结及用法
2021/07/02 Python
MySQL分布式恢复进阶
2022/07/23 MySQL