前端模块化发展AMD,CMD,commonjs,es6-CSDN博客

74 阅读2分钟

commonjs

commonjs是node的规范,因为是同步的,所以不适用于浏览器。
服务器上资源存在于硬盘,require起来没问题,但是浏览器资源依赖于服务器,同步加载可能会造成浏览器假死,所以才有了AMDCMD的异步加载,webpack也是以commonjs的形式书写

AMD

AMD是"Asynchronous Module Definition"的缩写,意思就是"异步模块定义"。
RequireJS就是实现了AMD规范的

CMD

跟AMD相似,不过有改进,玉伯写了seajs,就是遵循他提出的CMD规范
特点:
对于依赖的模块,CMD推崇依赖就近,延迟执行。也就是说,只有到require时依赖模块才执行。

ES6 Module

目前浏览器端最流行,有望成为服务端和浏览器通用模块解决方案

AMD对比CMD

  • AMD推崇依赖前置,在定义模块的时候就要声明其依赖的模块
  • CMD推崇就近依赖,只有在用到某个模块的时候再去require
  • -这也是很多人说AMD用户体验好,因为没有延迟,依赖模块提前执行了,CMD性能好,因为只有用户需要的时候才执行的原因

ES6 Module对比CommonJS

  • CommonJS模块是运行时加载,ES6 Module是编译时输出接口;
  • CommonJS加载的是整个模块,将所有的接口全部加载进来,ES6 Module可以单独加载其中的某个接口;
  • CommonJS输出是值的拷贝,ES6 Module输出的是值的引用,被输出模块的内部的改变会影响引用的改变;
  • 在CommonJS顶层,this指向当前模块;而在ES6模块中,this指向undefined;
    目前浏览器对ES6 Module兼容还不太好,我们平时在webpack中使用的export/import,会转译为webpack自身的模块加载机制。