zoukankan      html  css  js  c++  java
  • Redux 和 Mobx 区别

     

    为什么会将两者进行对比?

    一. 关于状态管理

    Redux 和 Mobx它们都有统一维护管理应用状态的能力;

     某一状态只有一个可信数据来源(通常命名为store,指状态容器);
     操作更新状态方式统一,并且可控(通常以action方式提供更新状态的途径);
     支持将store与React组件连接,如react-redux,mobx-react;通常使用状态管理库后,我们将React组件从业务上划分为两类:
      1.容器组件(Container Components):负责处理具体业务和状态数据,将业务或状态处理函数传入展示型组件;
      2.展示型组件(Presentation Components):负责展示视图,视图交互回调内调用传入的处理函数;

     二. 关注点的不同

    1. Redux更多的是遵循Flux模式的一种实现,是一个JavaScript库,它的关注点在于:

         Action:一个JavaScript对象,描述动作相关信息,主要包含type属性和payload属性:

         Reducer:定义应用状态如何响应不同动作(action),如何更新状态;

         Store:管理action和reducer及其关系的对象,主要提供以下功能:

              1>. 维护应用状态并支持读取访问状态(getState());

              2>. 支持监听action的分发,更新状态(dispatch(action));

              3>. 支持订阅store的变更(subscribe(listener));

              4>. 支持通过中间件(redux-thunk、redux-saga、redux-promise等)处理异步任务流程

    2. Mobx是一个透明函数响应式编程的状态管理库,它使得状态管理简单可伸缩,它的关注点在于:

        Action:定义改变状态的动作函数,包括如何变更状态;

        Store:集中管理模块状态(State)和动作(action);

        Derivation(衍生):从应用状态中派生而出,且没有任何其他影响的数据,我们称为derivation(衍生),衍生在以下情况下存在:

           1>. 用户界面;

           2>. 衍生数据, 衍生主要有两种:

            Computed Values(计算值):计算值总是可以使用纯函数(pure function)从当前可观察状态中获取;

     

            Reactions(反应):反应指状态变更时需要自动发生的副作用,这种需要实现其读写操作;

    三. 设计思想的不同

    Redux 更多的是遵循函数式编程思想
    Mobx 设计更多偏向于面向对象编程和响应式编程,通常将状态包装成可观察对象,一旦状态对象变更,就能自动获得更新。

    四. 对store管理的不同

    Redux将所有共享的数据集中在一个大的store中,统一管理
    Mobx是按模块将状态划分出多个独立的store进行管理

    五. 数据可变性的不同

    Redux强调的是对象的不可变性,不能直接操作状态对象,而是在原来状态对象的基础上返回一个新的状态对象,最后返回应用的上一状态
    不通过action更新一下state,当然不能成功

    Mobx中可以直接使用新值更新状态对象(直接修改状态与react的理论完全相悖啊,最好还是开启严格模式。
    
    

    六. 学习成本方面

    Redux 较繁琐,流程较多,需要配置,创建store,编写reducer,action,如果涉及异步任务,还需要引入中间件
    Mobx 流程相对就简单很多,根据文档上手也比较快

  • 相关阅读:
    215. Kth Largest Element in an Array
    214. Shortest Palindrome
    213. House Robber II
    212. Word Search II
    210 Course ScheduleII
    209. Minimum Size Subarray Sum
    208. Implement Trie (Prefix Tree)
    207. Course Schedule
    206. Reverse Linked List
    sql 开发经验
  • 原文地址:https://www.cnblogs.com/SallyShan/p/13606751.html
Copyright © 2011-2022 走看看