Facebook打造的JavaScriptUI框架React简介。它支持大多数Facebook网站，包括Instagram。React不同于当时流行的jQuery、Backbone.js和Angular1框架，它的诞生改变了JavaScript的世界。其中一个最大的变化是React推广了虚拟DOM（VirtualDOM）并创建了一种新的语法——JSX，它允许开发者用JavaScript编写HTML（译者注：HTMLinJavaScript）。Vue致力于解决与React相同的问题，但它提供了另一套解决方案。Vue使用模板系统（弱化jsx），可以更轻松地升级现有应用程序。这是因为模板使用普通的HTML。通过Vue集成现有系统相对容易，不需要整体重构。同时，Vue的学习曲线比React更容易。相似点React和Vue有很多相似之处，比如都是JavaScriptUI框架，专注于创建丰富的前端应用。与“功能齐全”的早期JavaScript框架不同，Reat和Vue只有框架的骨架，路由、状态管理等其他功能都是框架的独立组件。两者都是用于创建UI的JavaScript库；两者都快速且轻便；两者都有基于组件的架构；都使用虚拟DOM；两者都可以放入单个HTML文件中，或者成为更复杂的webpack设置中的模块；两者都有独立但常用的路由器和状态管理库；它们之间最大的区别是，Vue通常使用HTML模板文件，而React完全是JavaScript。Vue具有双向绑定的语法糖。区别1.监控数据变化的实现原理不同。Vue通过getter/setter和一些函数的劫持可以准确的知道数据的变化。默认情况下，React使用比较引用（diff）的方法。如果不优化，可能会造成大量不必要的VDOM重新渲染。为什么React不能准确监控数据变化？这是因为Vue和React的设计理念不同。Vue使用可变数据，而React强调数据的不可变性。两者没有区别。Vue更简单，而React在构建大型应用程序时更鲁莽。伟大的。2、数据流向不同Vue1.0可以实现两种双向绑定：父子组件之间，props可以双向绑定；组件和DOM之间可以通过v-model进行双向绑定。第一个在Vue2.x中去掉了，即父子组件之间不再可以双向绑定（但是提供了一个语法糖，通过事件自动帮你修改），Vue2.x对组件不鼓励从拥有道具进行任何修改。React一直不支持双向绑定，提倡单向数据流，称为onChange/setState()模式。但是，由于我们一般使用Vuex、Redux等单向数据流的状态管理框架。3、HoC和mixinsVue结合不同功能的方式是通过mixin。Vue中的组件是一个封装好的函数，而不仅仅是我们定义组件时传入的对象或者函数。比如我们定义的模板是如何编译的？例如，声明的props是如何接收的？这些都是Vue在创建组件实例时隐式做的事情。既然vue默默的为我们做了这么多事情，如果我们直接把组件的声明包装起来，返回一个HoC，那么包装好的组件是无法正常工作的。React结合不同功能的方式是通过HoC（高阶组件）。React一开始也是用mixins，但是后来觉得这种侵入组件的方式会带来很多问题，所以放弃了mixinx，改用HoC。高阶组件的本质是高阶函数。React组件是纯函数，因此高阶函数对于React来说非常简单。4.组件通信的区别Vue中实现组件通信的方式有3种：父组件通过props向子组件传递数据或者回调，虽然回调可以传递，但是我们一般只传递数据；子组件通过事件向父组件发送消息；通过V2.2.0新增的provide/inject，父组件可以向子组件注入数据，可以跨越多个层级。React中也有对应的三种方法：父组件可以通过props向子组件传递数据或回调；可以通过context进行跨层通信，其实类似于provide/inject。React本身不支持自定义事件，在Vue中子组件向父组件传递消息有两种方式：事件和回调函数，但Vue更喜欢使用事件。在React中，我们都使用回调函数，这可能是它们之间最大的区别。5.模板渲染方式的差异从表面上看，模板的语法是不同的。React通过JSX渲染模板。Vue是通过扩展的HTML语法来渲染的，但其实这只是表面现象。毕竟，React不必依赖JSX。从深层次来说，模板的原理不同，这是它们本质的区别：React在组件JS代码中通过原生JS实现模板中的常用语法，比如插值、条件、循环等，都是通过JS语法实现的，更纯粹和原始。但是，Vue是通过与组件JS代码分离的单独模板中的指令来实现的。例如，条件语句需要v-if来实现。这种方法有些独特，会弄乱HTML。6.不同的渲染过程Vue可以更快的计算出VirtualDOM的差异，因为它会在渲染过程中跟踪每个组件的依赖关系，不需要重新渲染整个组件树。当应用程序的状态发生变化时，React会重新渲染所有子组件。可以通过shouldComponentUpdate生命周期方法来控制，但Vue将此视为默认优化。7.框架性质不同。Vue本质上是一个MVVM框架，由MVC发展而来；React是一个前端组件框架，由后端组件化发展而来。8.Vuex和Redux的区别从表面上看，store注入和使用有一些区别。在Vuex中，$store是直接注入到组件实例中的，因此可以更灵活的使用：使用dispatch和commit来提交更新，通过mapState或者直接通过this.$store来读取数据。在Redux中，我们的每个组件都需要显式地使用connect来连接所需的props和dispatch。另外，Vuex更加灵活。组件可以派发操作或提交更新，而Redux只能派发，不能直接调用reducer进行修改。在实现原理上，最大的区别有两点：Redux使用的是不可变数据，而Vuex的数据是可变的。因此，Redux每次都是用新状态替换旧状态，而Vuex直接修改它。Redux检测数据变化时，通过diff比较差异，而Vuex其实和Vue的原理一样，通过getter/setter比较。这两点的区别也是因为React和Vue的设计理念不同。.React更倾向于构建稳定的大型应用，非常专业。相比之下，Vue更倾向于简单快速地解决问题，更加灵活，不严格遵守规章制度。因此，也会给人一种大项目用React，小项目用Vue的感觉。综上所述，Vue的优点包括：灵活选择模板和渲染函数、简单的语法和项目创建、更快的渲染速度和更小的体积，而React的优点包括：更适合大型应用程序和更好的可测试性，适用于Web来自更大的端到端和本机应用程序生态系统的更多支持和工具。其实React和Vue都是非常好的框架。它们之间的相同点多于不同点，而且大多数都是最好的。功能相通：使用虚拟DOM实现快速渲染轻量级响应式组件服务端渲染易于集成的路由工具、打包工具和状态管理工具优秀的支持和社区
