AMD,CMD.CommonJs和UMD还有es6的模块化对比
CommonJS
CommonJS是服务器端模块的规范,Node.js采用了这个规范。
根据CommonJS规范,一个单独的文件就是一个模块。加载模块使用require方法,该方法读取一个文件并执行,最后返回文件内部的exports对象。
例如:
// foobar.js
//私有变量
var test = 123;
//公有方法
function foobar () {
this.foo = function () {
// do someing ...
}
this.bar = function () {
//do someing ...
}
}
//exports对象上的方法和变量是公有的
var foobar = new foobar();
exports.foobar = foobar;
AMD CMD
AMD规范的实现代表是require.js
amd是异步加载规范
CMD规范的实现代表是sea.js
对于依赖的模块AMD是提前执行,CMD是延迟执行。不过RequireJS从2.0开始,也改成可以延迟执行(根据写法不同,处理方式不通过)。
CMD推崇依赖就近,AMD推崇依赖前置。
//AMD
define(['./a','./b'], function (a, b) {
//依赖一开始就写好
a.test();
b.test();
});
//CMD
define(function (requie, exports, module) {
//依赖可以就近书写
var a = require('./a');
a.test();
...
//软依赖
if (status) {
var b = requie('./b');
b.test();
}
});
虽然 AMD也支持CMD写法,但依赖前置是官方文档的默认模块定义写法。
AMD的API默认是一个当多个用,CMD严格的区分推崇职责单一。例如:AMD里require分全局的和局部的。CMD里面没有全局的 require,提供 seajs.use()来实现模块系统的加载启动。CMD里每个API都简单纯粹。
简单来说,就是sea.js属于懒加载,require.js属于预加载.
在这里,顺便扩展一下预加载和懒加载的优缺点
预加载:当第一次访问时将所有的文件加载出来
优点:第一次访问完成以后, 再次访问的速度会很快
缺点:第一次加载页面要等待很久.
懒加载:使用的时候才会加载对应的文件.
优点:第一次访问速度相对快点
缺点:再访问其他新的模块时速度会变慢.
UMD
UMD是AMD和CommonJS的糅合
AMD模块以浏览器第一的原则发展,异步加载模块。
CommonJS模块以服务器第一原则发展,选择同步加载,它的模块无需包装(unwrapped modules)。
这迫使人们又想出另一个更通用的模式UMD (Universal Module Definition)。希望解决跨平台的解决方案。
UMD先判断是否支持Node.js的模块(exports)是否存在,存在则使用Node.js模块模式。
在判断是否支持AMD(define是否存在),存在则使用AMD方式加载模块。
(function (window, factory) {
if (typeof exports === 'object') {
module.exports = factory();
} else if (typeof define === 'function' && define.amd) {
define(factory);
} else {
window.eventUtil = factory();
}
})(this, function () {
//module ...
});
AMD,CMD.CommonJs和UMD还有es6的模块化对比的更多相关文章
- JS模块之AMD, CMD, CommonJS、UMD和ES6模块
CommonJS 传送门 同步加载,适合服务器开发,node实现了commonJS.module.exports和require 判断commonJS环境的方式是(参考jquery源码): if ( ...
- FW: AMD, CMD, CommonJS和UMD
javascript 我是豆腐不是渣 4月5日发布 推荐 2 推荐 收藏 32 收藏,486 浏览 今天由于项目中引入的echarts的文件太大,requirejs经常加载超时,不得不分开来加载ech ...
- AMD, CMD, CommonJS和UMD
我的Github(https://github.com/tonyzheng1990/tonyzheng1990.github.io/issues),欢迎star 今天由于项目中引入的echarts的文 ...
- js模块系统 - amd|cmd|commonjs|esm|umd
写过前端代码大概率听说过amd cmd umd commonjs esm这些名词, 想当初我第一次看到这些的时候, 人都麻了, 都是些啥啊. 后来我知道了, 这些都是js的模块规范. amd - 浏览 ...
- AMD/CMD/CommonJs到底是什么?它们有什么区别?
知识点1:AMD/CMD/CommonJs是JS模块化开发的标准,目前对应的实现是RequireJs/SeaJs/nodeJs. 知识点2:CommonJs主要针对服务端,AMD/CMD主要针对浏 ...
- js模块化开发 AMD CMD Commonjs
在es6全面实行开来之前 js实现模块开发方案有: 1.AMD 异步模块开发定义 依赖前置,requireJs应用了这一规范 require([module], callback); 加载完后回调 ...
- 深度扫盲JavaScript的模块化(AMD , CMD , CommonJs 和 ES6)
原文地址 https://blog.csdn.net/haochangdi123/article/details/80408874 一.commonJS 1.内存情况 对于基本数据类型,属于复制.即会 ...
- AMD CMD commonJS es6
看到很多人傻傻的分不清楚 AMD.CMD . commonJS . es6的区别,实际上这跟这几年前段技术的发展有很大的关系. 实际上这是JavaScript的模块化思想演进的一个过程. 最开始的时候 ...
- es6的模块化--AMD/CMD/commonJS/ES6
, ); ); }) , )); }); , )); ; export { firstName, lastName, year }; // es6引用 import { firstName, last ...
随机推荐
- entity framework 新增,更新,事务
protected void Button1_Click(object sender, EventArgs e) { yyEntities _db; _db = new yyEntities(); t ...
- Integer类之equals与hashCode
一.源码. 1.equals源码.可以看出,比较的是两者的类型相同且内容相同.即是否有相等的int类型的value值. ######################################## ...
- Java事件监听的四种实现方式
1.事件对象: 一般继承自java.util.EventObject对象,由开发者自行定义. 2.事件源: 就是触发事件的源头,不同的事件源会触发不同的事件类型. 3.事件监听器: 事件监听器负责监听 ...
- cc150 --链表分割
题目描述 编写代码,以给定值x为基准将链表分割成两部分,所有小于x的结点排在大于或等于x的结点之前 给定一个链表的头指针 ListNode* pHead,请返回重新排列后的链表的头指针.注意:分割以后 ...
- HZNU_TI1050 训练实录
菜鸡队训练实录 比赛记录:[名称:奖项 / 排名] 2018: ZJPSC Bronze / 86 CCPC Jilin ...
- 岭回归(Ridge Regression)
一.一般线性回归遇到的问题 在处理复杂的数据的回归问题时,普通的线性回归会遇到一些问题,主要表现在: 预测精度:这里要处理好这样一对为题,即样本的数量和特征的数量 时,最小二乘回归会有较小的方差 时, ...
- FastDFS+nginx+keepalived集群搭建
安装环境 nginx-1.6.2 libfastcommon-master.zip FastDFS_v5.05.tar.gz(http://sourceforge.net/projects/fastd ...
- ELK学习笔记之Elasticsearch启动常见错误
问题出现的环境: OS版本:CentOS-7-x86_64-Minimal-1708 ES版本:elasticsearch-6.2.2 1. max file descriptors [4096] f ...
- Nginx 灰度实现方式(支持纯灰度,纯生产,50度灰及更多比例配置)
前言 Nginx相关技术短信本篇幅不做详细介绍,所以学习本文之前要对Nginx有相关的了解. 生产环境即线上环境,在经历开发.测试再到上线,不可避免的会更新生产环境,但谁又能保证测试过的代码到线上运行 ...
- bzoj1648 / P2853 [USACO06DEC]牛的野餐Cow Picnic
P2853 [USACO06DEC]牛的野餐Cow Picnic 你愿意的话,可以写dj. 然鹅,对一个缺时间的退役选手来说,暴力模拟是一个不错的选择. 让每个奶牛都把图走一遍,显然那些被每个奶牛都走 ...