1.1.4 Vue的优势

1.Vue与React

Vue和React有许多相似之处，都使用Virtual DOM，都提供了响应式（Reactive）和组件化（Composable）的视图组件，将其他功能如路由和全局状态管理交给相关的库，从而能够将开发者的注意力集中在核心库。鉴于其众多的相似处，这里对其进行简单的比较。

（1）运行时性能

Vue和React运行都非常快，都具有优秀的运行性能，但是优化方面有区别。React的某个组件状态发生变化时会以该组件为根，重新渲染整个组件子树，想要避免不必要的子组件重渲染，就需要使用PureComponent或实现shouldComponentUpdate方法，而且有限定条件，如可能需要使用不可变的数据结构、保证组件的整个子树渲染输出都由组件的props决定等，组件的优化非常复杂。Vue组件的依赖在渲染过程中能自动追踪，系统能够精确知道哪个组件需要重新渲染，开发者不需要考虑此类优化，从而能够更好地专注于应用本身。

（2）HTML与CSS

React中一切都是JavaScript，HTML可以用JSX来表达，CSS也越来越多地被纳入到JavaScript中来处理，因此学习React就需要掌握相关语法。Vue的整体思想是拥抱经典Web技术，并在其上进行扩展，对于很多习惯了HTML的开发者来说，开发更为自然，且基于HTML的模板使得将已有的应用迁移到Vue更为容易。针对组件作用域内的CSS，React通过CSS-in-JS的方案实现CSS作用域，与普通CSS撰写过程不同，引入了新的面向组件的样式范例。Vue设置样式的默认方法是单文件组件（类似style属性的标签），样式设置更为灵活，通过vue-loader可以使用任意预处理器、后处理器，甚至可以将CSS Modules深度集成在<style>标签内，使用更为方便。

（3）规模

向上扩展方面，Vue和React都提供了应对大型应用的强大路由。React提供了Flux、Redux等状态管理模式，这些模式可以非常容易地集成在Web应用中，Vue拓展了状态管理模式（Vuex），开发体验更好。Vue还提供了CLI脚手架，通过交互式的脚手架可以方便地构建项目和快速开发组件原型，React的create-react-app尚存在一些局限性。

向下扩展方面，React的学习曲线陡峭，开始学React前需要知道JSX和ES2015，Vue向下扩展后类似于jQuery，只需要引入类库就可以运行程序，可以是本地类库，也可以是在线类库。以下代码引入在线类库。

特别是将Vue开发环境代码应用到生产环境中只需要用min版Vue文件替换开发环境的Vue类库文件即可，不需要担心其他性能问题，更为方便。

（4）原生渲染

React Native能使用相同的组件模型编写具有本地渲染能力的App（iOS和Android），能同时跨多平台开发，开发效率非常高。Vue和Weex进行了官方合作（Weex是阿里巴巴发起的跨平台用户界面开发框架），允许使用Vue语法开发可以运行在浏览器端、iOS和Android上的原生应用组件。

2.Vue与AngularJS

AngularJS是Vue早期开发的灵感来源，Vue的一些语法和AngularJS很类似，这里也对其进行简单比较。

（1）复杂性

在API与设计上，Vue.js都比AngularJS简单得多。

（2）灵活性和模块化

Vue.js是一个更加灵活、开放的解决方案，允许以任意方式组织应用程序，提供了Vue CLI搭建应用项目，能够使多样化的构建工具通过妥善的默认配置无缝协作，节约了用户在配置上的时间花费。同时还提供配置的灵活性，方便特殊的应用搭建需求。AngularJS需要遵循AngularJS制定的规则，灵活性不及Vue。

（3）数据绑定

AngularJS使用双向数据流，Vue使用单向数据流，应用中的数据流更加清晰易懂。

（4）指令与组件

Vue中的指令和组件划分更为清晰，指令用于封装DOM操作，组件是一个具有视图和数据逻辑的独立单元。AngularJS中每件事都由指令来做，组件是一种特殊的指令，Angular（Angular 2）采用了和AngularJS完全不同的框架，也具有优秀的组件系统。

（5）运行时性能

Vue使用基于依赖追踪的观察系统，队列异步更新，所有数据变化独立触发，不使用脏检查，具有更好的性能，非常容易优化。AngularJS中watcher增加时会变得越来越慢，特别是一些watcher触发另一个更新时，脏检查循环（digest cycle）可能需要运行多次，效率会非常低。

3.Vue的优势

通过前面的比较，可以简单总结Vue的优势如下。

1）Vue是一款轻量级框架，使用相对简单、直接，学习成本低，更加友好。

2）Vue可以进行组件化开发，将数据与结构进行了分离，代码量更少，开发效率更高。

3）Vue是一个MVVM框架，可以实现数据双向绑定，使视图和数据同步变化，在进行表单处理时非常方便。

4）Vue是单页面应用，使用路由进行页面局部刷新，不必每次都请求数据，加快了访问速度，提升了用户体验。

5）Vue使用虚拟DOM，浏览器不必多次渲染DOM树，页面更为流畅，用户体验更好。

6）Vue的运行速度更快，性能更为优化。