React VS vue,我的选择

#1

react社区开vue专栏了!抢前排,有红包。。

我很好奇vue和react写前端到底哪个用起来舒服,以前一直是用react开发,为了和vue做比较,最近我专门尝试用vue去搭建了框架,并且写了几个简单的组件,下面说说其中的感受。

技术栈主要构成。

react:react-redux(mobx)-webpack

vue:vue-vuex-webpack

技术栈相似性太多,很难去做对比,你要是说redux和vuex哪个难理解,这个就得看个人的悟性了。

使用场景

1、除去redux和vuex这类数据管理的框架。

在小型应用,也就是数据交互不多,组件基数小的情况下,只用react-webpack或vue-webpack来做开发,性能上我没有准确的数据来分析,而且我也不认为那一点性能差距对应用会造成多大的影响,毕竟都是小型应用。

从开发上手的角度来看,vue-webpack模式,更容易被从没有框架开发的前端接受,比如你以前使用jQuery,现在转学框架开发,那么vue的写法非常容易上手,这也是我尝试之后所体会到的。那么react-webpack模式上手难的地方在哪呢?我认为
是国内缺少综合性的学习资料,网上搜索的资料过于庞杂,

比如我最近搭建vue-webpack框架的时候,很容易从官网或者其他论坛获得一个清晰的框架思路,或许这跟我长期做react开发形成的思维有关,但除去这类经验,vue组件的写法的确容易理解。

vue和react都有生命周期的概念,都有父子组件通信机制,都有遍历列表数据,都有http请求,说白了,就是大神们定义了不同的方法去实现同样的功能,至于为什么会做这么蛋疼的事情,你不能把这种行为当做是抄袭,这是一种思想所形成的多种表现形式。每个人接受事物的能力不一样,有的人觉得react的表现形式好理解,有的人觉得vue的表现形式好理解,我相信大部分中国的前端还是会认为vue好理解一些。

2、包含redux或者vuex的框架。

当你打算开发一个包含比较多数据交互或者大量数据交互的应用时,如果没有一个好的数据管理规范,你的项目在后期会很难维护,当然不排除有的大神喜欢一个人单干、死干,就像多年前的网站开发,前端只负责切图,切好静态网页丢给后端工程师,后端去做数据交互,那时候的后端就是独自猛干一个网站,真的很生猛。

vuex我还没使用过,但看了下vue官方的demo,或许是我不够熟悉vuex的思想,竟没有一下子就看懂它这样写代码的意图,个人感觉有点复杂。至于redux,用的挺多了,记得以前刚用redux的时候,还不是很懂为什么我修改个状态还得写一个action,多麻烦啊!不过现在看来,多了这一步在前端中大型应用开发中还是很有好处的,特别是团队开发的时候,我那个CTO以前也认为不需要action去操作数据,也就是component =》store,后来被我硬生生的掰正了观点,事实证明,随着产品需求的不断增加,action给人一种非常清晰的代码模式。

mobx的观察者模式到底是不是比redux好,我还没在实际项目中对比过。

这么一大段话,其实我想表达的是redux目前真的足以满足稍微大型一些的应用开发,你要是觉得功能不够强大或者有缺陷,还可以自己写一些中间件去修补它。

最后,总结一下我的观点。

小型应用:我会选择 vue-webpack

中、大型应用:我会选择 react-redux-webpack

非应用型网站:我目前采用的是 director.js-jquery 或者 page.js-jquery,需要打包的话,再配置个webpack多入口打包。

2 Likes
#2

站在函数式编程的角度看待 React, React 生态大量学习了 Elm 和 ClojureScript 的成果, 比如 React 的组件优化方式来自 ClojureScript, 由于 FP 中大量生成内存, 进而会有强大的内存开销, 因而采用算法做结构复用, 减少各种开销, 然后 Redux 虽然没有直接借鉴 Elm, 但最终实现结果基本模仿 Elm, 通过纯函数的和 action 的抽象, 最终实现 time travaling 的效果, 如果不用 FP 的方式, 必将导致大量状态的被复制保存造成极大的内存消耗.

我记得 React 作者提到, React 越来越多地成为编程语言, 而不是模板引擎. 意味着更多的 FP 研究当中的概念和成果能够在编程语言和编译器当中利用. 从数据结构从算法从类型层面, 能挖掘到很多方式进行优化. 可以说 React 在模仿 FP, 而 Vue 更多的是在模仿着 React. 当然模仿跟抄袭是两码事, 就像商业模式可以被模仿但不能照搬就成功一样. 而 Vue 所做的取舍, 最终不是更加贴近 FP 的成果, 而是更加贴近用户.

编程归根到底是将真实世界的一些问题映射到的数据结构和算法上, 然后通过程序的预演进而来解决. 而模拟业务恐怕还是会有多种不同的办法. 特别是站在 ClojureScript 这边看 js 圈出现的各种各样的想法.

1 Like
#3

我觉得react学习曲线更陡峭。vue我发现好多后台也在搞。react 基本没有。 vue api 设计也更简单。 这也就让一些人更容易上手。 哪怕js 基础并不好的人也一样.

#4

说实话虽然 redux 比 vuex 好理解,但是用起来完全不一样,实在受不了那么绕,vuex 用多了感觉非常舒服,需要改 store 的状态简单的直接 commit 一个 mutation 就行,异步修改就 dispatch 一个 action,界面变化也不需要像 redux 那样加一个 react-redux 做连接,直接 加一个 computed 属性观察 store 的数据就行,全程组件都随时可以拿到 store 的数据和提交 mutation/action 修改 store 的数据,比 redux 一层一层传舒服多了

1 Like
#5

vue 的学习曲线比react相对容易一些,我是先学完react+redux来做些项目之后 去接触vue ,发现vue会相对容易些

#6

分享下你学习vue的心得,我想少走点弯路。

#7

说明vue比react更useful,但是没有react powerful…越抽象就越powerful,档次差远了.
但是对一般应用或者一般场景,useful或许更有用,所以两边吹的也是能理解

1 Like
#8

移动端用哪个

#9

react 我不喜欢的一点就是 太繁琐,不直观 , 尤其是表单操作和 if逻辑判断

#10

可以用switch或三元表达式代替

#11

5月份写过一个小项目,现在来迭代,得先去翻翻文档了:joy:

#12

楼主评价一下mobx吧

#13

用了mobx后不会再想去用redux