RequireJS 和 SeaJS
RequireJS SeaJS
CMD规范
CommonJS的规范: 根据CommonJS规范,一个单独的文件就是一个模块。加载模块使用require方法,该方法读取一个文件并执行,最后返回文件内部的exports对象
SeaJS定义模块方式
在 SeaJS 里,模块只有一种书写格式
define(function(require, exports, module) {
var A = require('a');
A.do();
return function () {};
});
RequireJS定义模块方式
在 RequireJS 里,模块有多种书写格式,推荐的是
define(['dep1', 'dep2'], function (dep1, dep2) {
//Define the module value by returning a value.
dep1.do();
return function () {};
});
现在RequireJS 也提供了CMD的写法
模块的依赖可以像 CommonJS 一样「就近定义」
PS 两者都是以文件做为模块 一个文件一个模块
AMD执行策略
http://imququ.com/post/amd-simplified-commonjs-wrapping.html
AMD 运行时核心思想是「Early Executing」 也就是提前执行依赖 尽早执行
define(['a', 'b'], function(A, B) {
//运行至此,a.js 和 b.js 已下载完成(运行于浏览器的 Loader 必须如此);
//A、B 两个模块已经执行完,直接可用(这是 AMD 的特性);
return function () {};
});
CMD的执行策略
按需执行 CMD 推崇 as lazy as possible.
[只是执行时间晚了 但是加载和RequireJS是一样的]
//main.js
define(function(require, exports, module) {
//运行至此,mod1.js 和 mod2.js 已经下载完成;
console.log('require module: main');
var mod1 = require('./mod1'); //这里才执行 mod1
mod1.hello();
var mod2 = require('./mod2'); //这里才执行 mod2
mod2.hello();
return {
hello: function() {
console.log('hello main');
}
};
});
写法上可能更易读 「就近」书写
SeaJS RequireJS 区别 知乎篇
http://www.zhihu.com/question/20342350
- requirejs:一个模块的factory函数执行是紧跟随在define(也就是Evaluate Script脚本模块文件)之后
- seajs: 执行一个模块的factory函数需要等待所有模块define完毕。
- RequireJS的异步模块加载迎合了浏览器端JS程序员固有的异步思维,学习成本低
- RequireJS和Sea.js在资源加载的时间点都是一样的,所以论“懒”的程度都是一样的。差别仅仅在于加载的脚本什么时候执行。RequireJS的依赖模块在回调函数执行前执行完毕,而Sea.js的依赖模块在回调函数执行require时执行。
- 对于非AMD规范的js插件,require js提供了shim支持,非常方便。RequireJS早有了Shim等支持,不需要修改第三方类库就可以完全支持.如Ember,JQuery等引用,都直接可以异步加载为一个模块.
- requirejs目前支持了sourcemap,配合grunt,简直爽爆了。
SeaJS与RequireJS最大的区别 豆瓣篇
http://www.douban.com/note/283566440/
这篇文章的结论似乎有误 作者最开头也已经注明了
作者一开始认为requeireJS有bug 实际上不是
原因是即使是RequireJS采用了CMD的写法
实际上还是的执行还是不变 也就是预先加载并执行了依赖
关于豆瓣的这个例子 在这篇博文中也有说明
http://imququ.com/post/amd-simplified-commonjs-wrapping.html
结论
RequireJS的做法是并行加载所有依赖的模块, 并完成解析后, 再开始执行其他代码, 因此执行结果只会"停顿"1次, 完成整个过程是会比SeaJS要快.
而SeaJS一样是并行加载所有依赖的模块, 但不会立即执行模块, 等到真正需要(require)的时候才开始解析(也就是执行),
评论
AMD
我个人感觉requirejs更科学,所有依赖的模块要先执行好。被依赖的模块必须先于当前模块执行,而没有依赖关系的模块,可以没有先后。
AMD规范了"依赖提前加载提前执行"的根本
合并
RequireJS 有 r.js SeaJS 有spm 来合并
为什么不直接用grunt的concat呢 因为这两者有个要求就是一个模块对应一个文件
Browserify
Browserify 是一个基于 Node 模块化方案的浏览器端版本
browserify查找语法树种global域下的require和module变量,对其调用进行变形替换。这是静态分析,像module[‘exp‘+’ort’] = {} , require('path'+'to'+‘file')目前还无法被正确替换。
Browserify的出现,不仅仅是让NPM(或者说之前适用于Node.js)上的代码可以给浏览器端使用。更重要的意义,是Browserify代码组织更符合CommonJS规范,让浏览器前端代码也可以通过预编译实现CommonJS规范
SeaJS和Browserify
browserify不需要 define(function(require, exports, module) {...}) 。代码更符合CommonJS模块化规范,可以和nodejs共同require同一个文件,以及node_modules里的库
依赖分析时机不一样:SeaJS是在客户端运行时解析依赖,可以说是“运行时”解析;而Browserify是在服务端就依赖分析打包成单个文件,可以说是“预编译”
RequireJS 和 SeaJS的更多相关文章
- RequireJS与SeaJS模块化加载示例
web应用越变的庞大,模块化越显得重要,尤其Nodejs的流行,Javascript不限用于浏览器,还用于后台或其他场景时,没有Class,没有 Package的Javascript语言变得难以管理, ...
- RequireJS和seaJS的区别与联系
RequireJS和seaJS的区别与联系联系:都是模块加载器,倡导模块化开发理念,核心价值是让 JavaScript 的模块化开发变得简单自然. RequireJS(除了是 ...
- 从Java的角度理解前端框架,nodejs,reactjs,angularjs,requirejs,seajs
[前端神秘的面纱] 对后端开发来说,前端是神秘的, 眼花缭乱的技术,繁多的框架, 如果你还停留在前端等于只用jquery做开发,那么你out了, 本文从Java的角度简述下目前前端流行的一些框架. 水 ...
- LABjs、RequireJS、SeaJS 哪个最好用?为什么?
感谢玉伯在知乎的奉献,下面全文转载:http://www.zhihu.com/question/20342350/answer/14828786 LABjs 的核心是 LAB(Loading and ...
- LABjs、RequireJS、SeaJS 哪个最好用?为什么?- 玉伯的回答
LABjs 的核心是 LAB(Loading and Blocking):Loading 指异步并行加载,Blocking 是指同步等待执行.LABjs 通过优雅的语法(script 和 wait)实 ...
- requirejs和seajs使用感受
这几天看了下前端模块化的知识,主要是requirejs和seajs相关的知识,还未看es6的模块化知识. 由于目前项目组内的开始推广使用vue,并且开始简单的封装组件,但发现组件js的使用方式依然是原 ...
- RequireJS 与 SeaJS 的异同
相同之处 RequireJS 和 SeaJS 都是模块加载器,倡导的是一种模块化开发理念,核心价值是让 JavaScript 的模块化开发变得更简单自然. 不同之处 两者的区别如下: 定位有差异.Re ...
- 模块化以及requirejs和seajs
我们用模块化的思想进行网页的编写是为了更好的管理我们的项目 模块与模块之间是独立存在的,每个模块可以独立的完成一个子功能. 模块化所涉及的规范commonjs,AMD,CMD,UMD 其中的commo ...
- RequireJs 与 SeaJs的相同之处与区别
相同之处: RequireJS 和 Sea.js 都是模块加载器,倡导模块化开发理念,核心价值是让 JavaScript 的模块化开发变得简单自然. 不同之处: 定位有差异.RequireJS 想成为 ...
随机推荐
- CSS3盒模型display:-webkit-box;的使用
box-flex是css3新添加的盒子模型属性,它的出现可以解决我们通过N多结构.css实现的布局方式.经典的一个布局应用就是布局的垂直等高.水平均分.按比例划分. 目前box-flex属性还没有得到 ...
- caffe 配置 札记
cudnn的配置 1. 安装前请去先官网下载cuDNN (cudnn-7.0-linux-x64-v3),建议安装v3,v4有些问题. 将cudnn-7.0-linux-x64-v3解压后会有两个文件 ...
- asp.net内置对象session和cookie
1.各个机器的session对象不同,不同浏览器之间不通用(换个浏览器,是个新的session). 2.session状态对象起始于网页打开,终止于网页关闭,生命周期有限. 3.关闭浏览器/超时的情况 ...
- 基于Socket的UDP和TCP编程介绍
一.概述 TCP(传输控制协议)和UDP(用户数据报协议是网络体系结构TCP/IP模型中传输层一层中的两个不同的通信协议. TCP:传输控制协议,一种面向连接的协议,给用户进程提供可靠的全双工的字节流 ...
- linux 环境操作faq 记录
1. ubuntu adb 提示???? 找不到设备 这个问题不是一次两次了记录下,以后好找点. 问题:ubuntu下adb 不是别设备 http://blog.csdn.net/chychc/art ...
- 限制ITEM读取其它物料的物料描述
应用 Oracle Purchasing 层 Level Function 函数名 Funcgtion Name CUXPOXPOEPO 表单名 Form Name POXPOEPO 说明 Des ...
- 組裝工廠設置IQC的目的
在電子組裝工廠的組織裡,一般都會有 IQC (Incoming Quality Control) 這個單位,台灣稱之為「入(進)料管控」,大陸稱之為「來料管控」,其最主要目的在攔檢所有買進材料是否符合 ...
- hibernate详解
Hibernate原理与应用 主要内容 1.引入 2.安装配置 3.基本概念和CURD 4.HQL和Criteria 5.关联映射 6.继承映射 7.集合映射 8.懒加载 9.缓存 10.事务 11. ...
- image.xx.com 通过haproxy 跳转到内部图片服务器
<pre name="code" class="html">http://www.hyyche.com/#main C:\Users\Adminis ...
- UberX及以上级别车奖励政策(优步北京第二、三组)
优步北京第二.三组: 定义为2015年6月1日至7月19日激活的司机(以优步后台数据显示为准) 滴滴快车单单2.5倍,注册地址:http://www.udache.com/如何注册Uber司机(全国版 ...