实践中的 Mobx 和 Redux

原创
2018/01/25 15:23
阅读数 151

第一个 React Native 应用是用 Mobx 写的,已经在市场上了。

使用 Mobx 过程中,发现其优点是:

  • 轻松上手,看下文档很快就可以用
  • 性能据称好于 Redux
  • 同步异步通行,支持同步刷新,异步刷新
  • 传统 MVC 模型,虽说是 observe ,代码写出来还是 MVC

缺点是:

  • 传统 MVC ,MVC 的缺点全都有了

使用 Redux 过程中,发现优点是:

  • 代码逻辑清晰,流程可以预测,如官方所言
  • 所谓的函数流模型,保证 Action Store View 中数据的单向流动
  • 性能尚可
  • 项目结构清晰

缺点是:

  • 默认必须用 Immutable data ,导致多余代码增加
  • 本身不支持异步,需要中间件
  • 需要大量的第三方组件支持
  • Dispatch 不易控制,代码修改牵动地方较多,不要共享 ActionType!!
  • 学习成本高,并不容易上手

Youtube 上有很多探讨的视频,Reactjs 的社区对于 Redux 和 Mobx 都很欢迎,Angular 的社区比较排斥 Redux ,倾向于使用 Mobx 。

特别是 Redux ,通常用在大型的复杂的项目中,例如有基于 Redux + RxJS 写的 epics 等,使得异步的数据流通信,可以通过 reactive 编程模型观察、介入异步通信的各阶段操作,说到 reactive 模型,其理念在 Akka 上体现的很完整,其基本原理,就是在数据的发送方 publisher 和 接收方 subscriber 之间建立了一个数据通道,可以协调流量,以及观察通信过程。

个人使用 Redux 的体验就是,没有耐心就不要学下去了,其实 Mobx 非常快,也很实用,先用 Mobx 就可以了。

如果项目很大,还是用 Redux 好了,而且学了 Redux 之后,也许不想再用 Mobx 了,毕竟调试起来 Redux 更可追溯,更容易。

用 Redux 组织的代码是这样

  "dependencies": {
    "app-data": "file:./app/module-data",
    "app-redux": "file:./app/module-redux",
    "app-service": "file:./app/module-service",
    "app-style": "file:./app/module-style",

输入图片说明

用 Mobx 组织的代码是这样:

仅仅指 Store 这一部分

输入图片说明

展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部