持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第1天，点击查看活动详情
模块化
JS的作用域隔离机制较弱，因此使用不当时会产生命名冲突的问题，尤其是在单页应用日益复杂、使用的第三方框架越来越多的情况下更容易产生冲突问题。而且JS本身没有直接提供使用代码加载其它脚本文件的机制。因此产生了JS模块化概念。
JS模块化通常要解决2个问题：
1. 提供定义JS模块的办法
2. 提供按需加载模块及其依赖模块的办法
常用的JS模块化方案有以下几种：
1. Node.js中的模块化方案（通常称为CommonJS规范，最简单易用，通过约定取消了配置）
2. 浏览器中使用中RequireJs（称为AMD规范）和SeaJs（称为CMD规范），这两个都需要配置
3. ES6中的模块化方案（无需配置）
目前在浏览器端使用最广泛的是RequrieJs（jQuery、Underscore、Backbone、Angular、ionic等流行的库和框架都支持），RequireJs通过AMD规范描述了定义和使用模块的方法，本身支持JS文件的按需加载，另外RequireJs还有很多官方和第三方插件可以实现各种文件（如HTML、CSS、其它文本文件等）的动态加载。
另外还需要注意的是Webpack打包工具支持混合使用Nodejs中的require()导及ES6中的import … from …，还支持直接从npm模块包中导入js，因此使用Webpack + npm也越来越流行，尤其是在React阵营中几乎成为主流。
组件化技术
自从HTML产生之后，就以其简单易出成果而被广泛应用，HTML的功能也越来越强大，标签数量也越来越多，到H5标签已经超过100个。但是希望自定义HTML标签的人并不会因为HTML标签越来越多而止步，他们的期望更高，那就是可以自由地增加HTML标签。于是产生了各种支持自定义标签的技术，都可以称之为Web组件化技术，常见的有：
1. 现代浏览器支持的直接自定义新标签的技术（可以理解为是XML），在HTML代码中直接写新标签，默认是inline的，通过CSS可以给予更多的控制。老浏览器不支持。
2. 通过Angular的指令或组件自定义标签。成熟，功能强大，商业应用广泛。ionic中就通过Angular定义了大量的UI控件。
3. 通过Vue.js的组件定义标签。Vue.js中可以定义componet（组件），然后在模版中可以像标签一样使用（Vue.js见下文第三方库及框架列表）。
4. 通过React组件定义标签。这种其实算不上自定义标签，因为它不是HTML，而是JS（所谓的标签其实是jsx组件，编译后变成了js，与HTML关系不大）。
5. Web Components技术，由W3C提出的技术，有望成为未来的标准。允许直接从DOM的HTMLElement类继承出新标签。这种技术是多种Web新技术的综合，包含自定义标签类、template模板、shadow封装、import导入等，目前还处于试验阶段，除了谷歌外大多数公司都还没有提供支持，离商业应用还很远。
