为什么我们放弃了Vue？Vue和React深度比较

Vue的话需要记住各种指令，还有属性细节，免不了经常查文档。React相对简单，记住：“函数入口是props，出口是html”就行了。

这个也不是你选择框架的原因，如果这个也可以作为原因的话，我觉得是因为你懒，给自己找了借口。据我自己学习，实践总结，两个框架都很简单，有手就行，有脑就会，不见得会React就比Vue牛逼很多。其中都提供了相应脚手架，方便用户使用：

Vue

npminstall-g@vue/clivuecreatemy-project反应

npxcreate-react-appmy-appcdmy-appnpmstart傻瓜式使用，无限div就完事了。

这是我以前在华为的时候，内部讨论两个框架对比时下的一个标记。所谓呢？这个就是万精油标注，没有参考意义。你如何定义一个项目是大项目？超过xx万行代码？后端API超过xxx个？无论什么项目，都有做“大”的可能，只要正常运营，你就得持续维护，补充补充的需求。框架的可以替代更为重要。当然我可以这么跟你说，反应适度不适合“小”项目我不知道，但是Vue不适合“大”项目，业务代码超过5万行之后问题明显，后面会详细说这点。

很多新手在入门一些框架，或者选型组件，方案时会看看什么大公司已经用了，避免自己踩坑。当然啦，我也可以滴。但是大公司可能只是“尝鲜”，“实验性””使用，这些项目对他们彼此无关紧要，选型失败了，压力给到开发工程师，996纠正就行了，而你，╮（╯▽╰）╭项目和屎一样也得维护下去。

举个选型错误的例子，看看大公司怎么拯救的。

以前在华为做硬件项目的时候，用的原理图软件，那叫一个辣鸡，用着用着总想砸掉电脑。历史问题，选型错误，但无奈很多项目，基础库都在上面，只能硬着头皮搞，迁移的成本太高，软件厂商水平太差，但是华为牛逼啊，把那个软件大改特改，各种内部数据库都集成在上面，各种自开发的辅助工具，还是可以开发出很牛逼的产品，部门做的单板连续11年全球第一。

（PS：以前还用tcl写脚本呢，你也可以试试蛋不蛋疼）-如果你觉得你能搞定选型错误带来的问题，或者你在华为，那当我们说。

同上。两个都很简单，一学就会。连这点东东都叫学习成本，我只能说：“我不是针对你，我是说在座的各位都是…”（Vue的模板有很多工程实践问题，后面详说。）

可以看看这个第三方基准测试，其中都都挺快的。不过我们实践过程中发现有差异，大列表渲染，大量数据加载，不做进一步优化的话Vue明显比React慢。TaskHub这个网站我们以前就是用Vue写的，后来直接迁移到React前端性能大大提高，用户体验有明显的差异（数据结构，后台不变）。

当然，尤大也在这里说过，看npm下载量没用，实际使用应该参考devTool的下载量。但是...为啥我打开的很多网站下面这个标都是亮的？

客观地说，作为核心团队成员，意识到我们会更偏爱Vue，认为关于某些问题指向用Vue解决会更好。如果没有这点信念，我们也就不会整天如此忙活了。但是在此后，我们想调整地公平和准确地来描述一切。其他的框架也有显着的优点，例如React庞大的生态系统

由Vue官方

生态上的差异是明显的，这点Vue官方也承认的，很多人因为生态这点迁移到React，不过我本人不是很在意，Vue生态也不差，如果说你用了React生态的东西就觉得很牛逼，你的核心也会用，这点并不能给你产品带来多大增值，竞争力还是要靠自己手码出来的好。下面简单带过：

两者的周边UI库都挺丰富的，反应稍微多一点，不过这不是选型的关键，自己手写的UI库也不是什么难事，偶尔封装一下原生标签也是很简单的。以前用Vue的时候还没有UI库，手动写了一个功能比较全的UI库，用汇总打包，也就2万行代码左右，有手就行。

Vue和React都有ref可以操作dom，自己封装一下不是什么难事。可以找找有没别人封装好的，拿来主义。

有小程序开发经验的同学都知道，小程序原生开发是很蛋疼的，通常需要串行框架封装，代码转换。常见的有几个框架：

这些小程序开发框架都是基于Vue或React的二次封装，简化小程序开发。

这种强依赖导致的问题会给以后项目升级，迁移带来很多问题。比如vuex作为Vue的官方推荐的状态管理方案，只能在Vue的上面使用，不能在阵营上面使用。Redux的状态管理在阵营上用的多，这个却能用在Vue之上。类似的问题很多，你会发现React周围的东西可以用于Vue，Vue的东西不能用在React上。

weex，rn这块我没有比较好的实践经验，其中一些生产方案必须慎重考虑。rn比weex成熟这点是明确的。

importReact,{Component}from'react';interfaceP{}interfaceS{}classIndexextendsComponent{constructor(props:Readonly

){super(props);this.state={};}staticdefaultProps={};componentDidMount(){}componentDidUpdate(prevProps:Readonly

){}componentWillUnmount(){}render(){return(

);}}exportdefaultIndex;函数组件15行importReact,{FC}from"react";interfaceProps{}constIndex:FC=(props)=>{//js代码return(

);};Index.defaultProps={};exportdefaultIndex;在js逻辑部分其中写法没毛病，都需要用到框架特定的生命周期钩子，Vue的类写法最简洁（3种对比），反应的功能写法最清晰（全部写法对比）。这部分不是选择关键，怎么写是个人喜好。

Vue使用的是数据对象（数据），反应使用的是状态对象（不可变状态），这点两个框架的设计不同，如下的问题解决思路也不同。

在组件状态管理功能上两者都没有太多槽点，如果要说的话就是Vuewatcher写多了代码一堆缩进，比较严重，反应也没好多少。

Vue的写法更加简单，但组件状态很多，需要明确的数据更新逻辑时，反应简单的setState（{}，callback），就搞定了，Vue有点让人摸不到头脑。

Vue项目解决bug和疑难杂症三大定理

（来自某师兄）

React的不可变（immutable）状态在应用复杂时表现出的透明，可测试性更佳。

沃苏艾德布耀布耀德说过：同样的问题，在语言层面上的解决方案才是最佳解决方案。语言生命周期长于框架生命周期

Vue的单文件组件，使用