VUE与Reactjs、angualrjs的区别

Vue与react.js的区别

相同点：

vue和react是两个不像相同的框架，但是他们之间也是用共同特点的，所有的前端框架都有一些相同的特点，

vue和react之间关键的相同之处在于，它们在被设计出来时所用的理念是一样的，

比如：都用到了component组件，props参数传递，组件之间的通信，state状态管理器，lifecircle声明周期等等，

似乎现在的前端框架都已经成为了mvc或则mvvc的样子，虽然还有一部分前端开发还是传统模式，

但是必然会被node+webpack+vue /react---之类的自动化逐渐替代。

使用 Virtual DOM

提供了响应式（Reactive）和组件化（Composable）的视图组件。

保持注意力集中在核心库，伴随于此，有配套的路由和负责处理全局状态管理的库。

不同点：

vue和react.js最大不同之处在于它们对DOM的渲染方式不同，vue可以直接在vue文件中使用html标签，

数据绑定时类似angular，可以进行条件渲染，

而react.js则采用了jsx语法，运用虚拟DOM 的概念进行，DOM对页面元素进行渲染，

获取页面元素需要用ref来获取。

细说：

性能简介

到目前为止，在现实的测试中，Vue 是优于 React 的（通常至少快20%-50%，尽管在某些情况下还要更快）。

渲染性能

在渲染用户界面的时候，DOM的操作是最昂贵，不幸的是没有库可以让这些原始操作变得更快。
我们能做的最好的就是：

1. 尽量减少DOM操作。Vue 和 React 都使用虚拟DOM来实现，并且两者工作一样好。
2. 尽量减少除DOM操作以外的其他操作。这是 Vue 和 React的一个不同的地方。

更新性能

在React中，你需要在每个地方去实现 shouldComponentUpdate 。

在 Vue 中，组件的依赖被自动追踪，所以当这些依赖项变动时，它才会更新。

在长列表中，有时候需要进一步优化的话，只需要在每项上添加 key 属性。

这意味着，由于Vue内改进过的渲染性能，更新未经优化的Vue会比未经优化的React要快的多。

甚至全面优化过的React通常也会慢于未加处理的Vue。

开发中

用 Vue 和 React 开发大多数应用的速度都是足够快的。

然而，当你要开发一个对性能要求比较高的数据可视化或者动画的应用时，这将会很有用。

在开发中， Vue 每秒最高处理10帧，而 React 每秒最高处理不到1帧。

是由于 React 有大量的检查机制，这能让它提供许多有用的警告和错误提示信息。

我们同意那些很重要的，但在我们实现这些检查时候，也更加密切地关注着性能。

HTML & CSS

在React中，所有的都是 JavaScript，听起来十分简单和优雅。不幸的事实是，JavaScript 内的 HTML 和 CSS 会引起很多痛苦。

在 Vue 中我们采用的 Web 技术并在其上面扩展。接下来将通过一些实例向你展示这所意味的是什么。

在 React 中，所有的组件的渲染功能使用的都是JSX；

JSX的渲染功能有一些优势：

• 你可以使用的完整的编程语言JavaScript来构建你的视图页面。
• 工具对JSX的支持相比于现有可用的其他Vue模板还是比较先进的（比如，linting、类型检查、编辑器的自动完成）

vue中的 Templates（Vue拥抱HTML，而不是用JavaScript重塑它）

优势如下：

• 在写模板的过程中，样式风格已确定和更少地涉及业务逻辑。
• 一个模板总是被声明的。
• 模板中任何 HTML 都是有效的。
• 阅读起来更像英语（比如，for each item in items）。
• 高级版本的 JavaScript 增加可读性。

React 生态也有一个项目允许你写模板，但是有一些缺点：

• 功能远没有 Vue 模板系统的丰富。
• 需要从组件文件中分离出HTML代码。
• 这是个第三方库，而非官方支持，可能未来核心库更新就不再支持。

规模

扩大：

Vue和React都提供了强大的路由来应对对于大型应用。

React社区在状态管理方面非常有创新精神（比如Flux、Redux），而这些状态管理模式甚至 Redux本身 也是非常容易能够集成在Vue应用中的。

实际上，Vue更进一步地采用了这种模式（Vuex），把Vuex集成进Vue能带来更好的开发体验。

两者另一个重要差异是，

Vue伴随的路由库和状态管理库都是由官方支持维护且和核心库同步更新的。

React 生态更成熟，选择是把这些问题交给社区维护。

最后，Vue 提供了一个Vue-cli 脚手架，能让你非常容易地构建项目，可以包含 Webpack, Browserify, 或者 no build system。

React在这方面也提供了create-react-app，

缩小：

React学习曲线陡峭，在你开始学 React 前，你需要知道 JSX 和 ES2015，因为许多示例用的是这些语法。

Vue样扩大后就像React，缩小后就像 Jquery。

vue与AngularJS的区别

相同点：

都支持指令：内置指令和自定义指令。
都支持过滤器：内置过滤器和自定义过滤器。
都支持双向数据绑定。
都不支持低端浏览器。

不同的：

1.AngularJS的学习成本高，比如增加了Dependency Injection特性，而Vue.js本身提供的API都比较简单、直观。
2.在性能上，AngularJS依赖对数据做脏检查，所以Watcher越多越慢。
Vue.js使用基于依赖追踪的观察并且使用异步队列更新。所有的数据都是独立触发的。
对于庞大的应用来说，这个优化差异还是比较明显的。

复杂性

在 API 与设计两方面上 Vue.js 都比 Angular 1 简单得多，因此你可以快速地掌握它的全部特性并投入开发。

灵活性和模块化

Vue.js 是一个更加灵活开放的解决方案。它允许你以希望的方式组织应用程序，

而不是在任何时候都必须遵循 Angular 1 制定的规则，这使让Vue能适用于各种项目。

数据绑定

Angular 1 使用双向绑定，Vue在不同组件间强制适用单向数据流。这使应用中的数据流清晰易懂。

指令与组件

在 Vue 中指令和组件分得更清晰。指令只封装 DOM 操作，而组件代表一个自给自足的独立单元 —— 有自己的视图和数据逻辑。在 Angular 中两者有不少相混的地方。

性能

Vue.js 有更好的性能，并且非常非常容易优化，因为它不使用脏检查。

在Angular 1中，当 watcher 越来越多时会变得越来越慢，因为作用域内的每一次变化，所有 watcher 都要重新计算。

并且，如果一些 watcher 触发另一个更新，脏检查循环（digest cycle）可能要运行多次。

Angular 用户常常要使用深奥的技术，以解决脏检查循环的问题。有时没有简单的办法来优化有大量 watcher 的作用域。

Vue.js 则根本没有这个问题，因为它使用基于依赖追踪的观察系统并且异步列队更新，所有的数据变化都是独立地触发，

除非它们之间有明确的依赖关系。