浅谈React 和 Vue

相同之处：

React 和 Vue 有许多相似之处，它们都有：

·       使用 Virtual DOM

·       提供了响应式 (Reactive) 和组件化 (Composable) 的视图组件。

·       将注意力集中保持在核心库，而将其他功能如路由和全局状态管理交给相关的库。

·       vue和react都得到了国内一线互联网的公司的广泛使用，包括百度，阿里巴巴，腾讯，美团，饿了么，滴滴等等。

对比：

1.     从两者的github表现上来看（截止2018年1月8日）

react

vue

可以看出react的star数量依然是前端框架中最火爆的，但是vue也超越angjular紧随其后，react版本已经来到16，而vue也已经发布2.5版，并且从2.5.9之后对typescript有了更好的支持，从维护上来看，react是facebook在维护，而vue现阶段虽然也有了团队，但主要还是尤雨溪在维护贡献代码，并且阿里巴巴开源的混合式框架weex也是基于vue的，所以我们相信vue未来将会得到更多的人和团队维护。毫无疑问，react仍是最受欢迎的框架，但是vue正迎头赶上，从github上的start的增速可以看出，越来越多的开发者正在使用vue，根据不完全统计，包括饿了么、简书、高德、稀土掘金、苏宁易购、美团、天猫、荔枝FM、房多多、Laravel、htmlBurger等国内外知名大公司都在使用vue进行新项目的开发和旧项目的前端重构工作。

2.     UI生态

react有material-design，蚂蚁金服的ant-design等，vue有饿了么出品的element以及iview等。

相比react而言，vue作为一个渐进式的框架，有着更小的体积，更简单的语法和学习实践。

而在创建大型应用时，react可能比vue更有优势，事实上，越来越多的人也开始选用vue着手写大型项目。

3.     语法

在 React 中，一切都是 JavaScript,用独创的jsx进行开发， Vue则是传统的模版语法的思路，虽然vue也可以使用jsx进行开发，但是对于很多习惯了 HTML 的开发者来说，模板比起 JSX 读写起来更自然。这里当然有主观偏好的成分，但如果这种区别会导致开发效率的提升，那么它就有客观的价值存在。

·    基于 HTML 的模板使得将已有的应用逐步迁移到 Vue 更为容易。

·    这也使得设计师和新人开发者更容易理解和参与到项目中。

另外vue一个更大的好处就是组件作用域内的css，可选 scoped 属性会自动添加一个唯一的属性 (比如 data-v-21e5b78) 为组件内 CSS 指定作用域，编译的时候 .list-container:hover 会被编译成类似 .list-container[data-v-21e5b78]:hover。

另外，react和vue都推荐使用es6的语法来进行开发，react和vue也都提供了es5的版本，使得开发者可以用es5进行学习和开发，只不过，react需要转译其jsx的语法，相比而言vue则显得更小巧，轻便。

4.     从两者的路由和状态管理和社区活跃程度来看

Vue 的路由库和状态管理库都是由官方维护支持且与核心库同步更新的。React 则是选择把这些问题交给社区维护，因此创建了一个更分散的生态系统，并且相比react的路由和状态管理，vue的路由和状态管理则显得更加优雅，易懂，入手。

两者都能快速创建项目，react的create-react-app 和vue的 vue-cli，两者都可以做到入手即用，零配置。从社区上来看，在国际上，react显然拥有更活跃的社区，而vue近年来也非常活跃，尤其是中国的社区。

5.     学习曲线

毫无疑问，react的全能性让它在学习时有一定的成本，更多时候需要自己去摸索或者社区交流，而且react的官方教程并没有十分深入的讲解，vue则拥有官方维护的教程和api，从学习难易程度而言的话，vue上手和学习都显得更快。

总结一下，我们发现，Vue的优势包括：

·  模板和渲染函数的弹性选择

·  简单的语法及项目创建

·  更快的渲染速度和更小的体积

React的优势包括：

·  更适用于大型应用和更好的可测试性

·  同时适用于Web端和原生App

·  更大的生态圈带来的更多支持和工具

而实际上，React和Vue都是非常优秀的框架，它们之间的相似之处多过不同之处，并且它们大部分最棒的功能是相通的：

·  利用虚拟DOM实现快速渲染

·  轻量级

·  响应式组件

·  服务器端渲染

·  易于集成路由工具，打包工具以及状态管理工具

·  优秀的支持和社区

更多对比详情：

1.     vue和其他框架对比 https://cn.vuejs.org/v2/guide/comparison.html

2.     我们为什么选择vue

http://www.infoq.com/cn/news/2016/12/why-Vue-js-no-react

3．最喜欢react，vue比angular更值得尝试     http://blog.csdn.net/oschina2017/article/details/78815523