我为什么要立刻放弃React而使用Vue？

现在，Vue.js 在 Github 上得到的星星数已经超过了 React。这个框架的流行度在不断增长，由于它并没有像 Facebok（React）或 Google（Angular）那样的大公司支持，这种增长让人非常惊讶。

我会在这篇文章里说明我对 Vue 流行的一些看法，以及为什么它能超过竞争者。由于 Vue 的设计哲学和特性与 React 十L y 5 9分相似，我会比较这两者C p 9 R ) ; A，并说明为什么 React（即使它是个好框架）经常很有欺骗性。

我自己是一名从事了多年开发的web前端老程序员，目前辞职在做自己的web前端私人定制课程，今年我花了m i t 1 Y一个月整理] h 1 L z - G t O了一份最适合2019年学习的web前端学习干货，各种框架都有整理，送给每一位前端小伙伴，想要获取的可以关注我的头条号并在后台私信我j I ) V & *：前端，即可免费获取。

1. Web 开发的发展

在上个世纪九十年代，写网站还只是纯粹的 HTML，加上一些简单的 CSS 样式而已。好处就是非常简单。坏处就是缺少很多功能。

之后就出现了 PHP，于是我们很高兴地把代y Y &码写成了这个样子：

虽然今天看来这段! x E代码十分糟糕，但在当时是很大的进步。这种进步到现在依然没变：选择我们喜欢的新语言、新框架，直到某一天出现更好的竞争对手。

在 React 出现之前我用过 Ember。之后我切换到 React，它把所有东西都看作 Web 组件的方式，它的虚拟 DOM，和高效的渲染都让我耳目一新。虽然并不是一切完美，但从编写代码的方式来看，它J e = 2 w .是个巨大的进步。

后来我决定切换到 Vue.js，不再使用 React。

React% ~ ` t q E k 并非很差，但我发现它太笨拙，难以掌握，而且有些地方的x j 3 7 9 2 p 9 Q代码看起来完全没有逻辑性。而 Vue 解决这些问题的方法让我感到很轻松。

我来说说原因。

2. 性能

首先来v t x K U B f J W谈一谈性能。

每个 Web 开发者都会面临着带宽的限制，因此网页的大小十分重要。网页越小越好。而现在由于移动浏览器的流4 - F行，这个问题比几年前更重要。

我们来看一G w : : t a m组数字：

Vue 库的大小为 25.6KB。而要让 React 的架构达到相似的功能，需要= d k w 2 有用。项目渲染更m = k W e t 7 # *高效，因此不需要在优化代码上考虑太多，从而把更多精力花在对项目真正有用的功能上。它在移动设备上的性能也很不错，因此不需要采用某种算法使之在手机上能更流畅地渲染。~ , v . E W

从 React 换成 Vue.js 时，你不需要在大小和性能方面做出妥协。你能同时拥有两者。

3. 学5 ^ 0 b习曲线

学习 React 还算不错。整个库都围绕 Web 组件构建，这一点很好。React 的核心很好、很稳定，但我8 . x M一直没弄明白它的高& [ b m级路由配置。这么多路由库的版本是做什么的？B , I现在的版本是4（+ React-router-5 . ~ G % { V g为经常会有几个库试图解决同一个问题。

在这个问题上，React和Vue做得都不错。

代码J s { j C { . J K清晰度

在我看来 React 的代码清晰度很差。JSXi ) ) g | & Z ` & 允许在代码中嵌入 HTML 代码，是代码清晰度方面的灾难。

你还会遇到其他的问题。从组件模板中调用方法经常会造成无法访问this，结果不得不手动绑定：<div onz y % a # * & kClick={this.some & * i BFunction.bind(this, listItem)} E 1 ; = k X /Z 0 >。

有时候React会变得完全不合逻辑……

考虑到应用中很大可能会用到C t n F k R I / .许多条件判断，JSX3 { Z z B的方法就非常糟糕了。写循环的方式更像个笑话。当然你可以换个模板系统，从React栈中去掉JSX，也可以在Vue中使用JSX，但那并不是在学习框架时首先学习的方法，因此这里不做讨论。

另一点# 9 o是，Vuh n I T : & U -e并不要求你必须使用setState或任何类似的方法。当然你还是要在data方法中定义所有的state属性，但如果你忘了定义，那么控制台中就, u I会显示提示。剩下的会自动内部处理，只需要在组件中修改值即可，跟使用普通的 Javascrip7 S et 对象一样。

使用 React 会遇到很多错误。! t w v I ( + X N就算实际的原理很简单，这些错误也会8 I P减慢学习的进度。

至于简洁性，M / L c用 Vue 写出的代码要比其他框架写出的代码要小很多。这是 Vue 框架最好的一点。一切都很简单，只需y = M b w I B几行简明易懂的代码就可以编写出复杂的功能l % l S 9 { b r T。而使用其他框架，你需要多写 10%、20% 甚至 50% 的代码。

使用 Vue 也不需要学太多东西。一切都很直观。书写 Vue.js 代码能够以G / # J最接近的方式表达思想。

Vue 的这种易用性是个非常好的工具，使得接受 Vue 变得容易，也利于团队沟通。不P } e l T { v论是你要改变技术栈的其他部分，还是需要v 9 q D v K a _在紧急状况下向团队里增加更多人，或者解释你b e R C P f Y q b的产品，Vue 都能? 5 s w [ 8节约你的时间，从而节约金钱。

时间估算也很容易，因为实现 S ! c f的。为什么还要应付这些麻烦呢？就为了社区和第三方库？为了获得一小部分好处，我们要承受太多痛苦，而就连这一小部分好处，也越来越变得不重要。

React 曾经让我的生活更容易，但在某些方面又让实现变得更复杂。多年以后，Vue 终于让我得到了解脱。它的实现n Z w与我想像中~ N W } g c 7的开发很相近，而且在开发过程中，q U u ( c Q _ v除了需要实现的东西之外，基本上不需要考虑任何其他P K , L C l h G (东西。它看上去很像原生的 JavaScript 逻辑（没有setn r o w } s z JState，也没有用来实现条件结C { `构的特殊用法，也没有各种算法那）。只需要按你想像的方式写代码就行。它速度很快，很安全，而且能让你高兴。我很高兴看到 Vv a } X ]ue 越来越多被前端开发者和公司接受，我希望它能结束 React 的统治地位。

免责声明P b V Y：这篇文章是我的个人观点，仅表达我现在的观点。随着技术的进步，这些观点会发生变C e 0 ? J )化（可能会变好5 ` x T b t或变坏）。

原文链接7 e P：https://blog.sourcerer.io/why-you-should-leave-react-for-vue-and-never-use-j * Rit-again-5e274bef27c2

作者：, 7 e Y R v ]GD | swenael P