Flux和Redux。。

Question

我刚刚发现了Redux。一切看起来都不错。使用Redux over Flux是否有任何缺点，陷阱或妥协？感谢

Answer 1

Redux作者在这里！

我想说你将使用它做出以下妥协：

你需要学会避免突变。 Flux对变异数据不感兴趣，但是Redux并不喜欢突变，许多与Redux互补的软件包都假设你永远不会改变国家。你可以使用仅限开发人员的软件包强制执行此操作，例如redux-immutable-state-invariant，使用Immutable.js，或者相信自己和您的团队编写非变异代码，但这是您需要注意的事项，这需要你的团队接受有意识的决定。
您必须仔细挑选自己的套餐。虽然Flux明确没有尝试解决“附近”问题，例如undo/redo， persistence或forms，Redux具有扩展点，例如中间件和商店增强器，它产生了young but rich ecosystem。这意味着大多数包装都是新的想法，并且还没有获得足够的使用量。几个月后你可能会依赖一些看起来很糟糕的东西，但现在还很难说。
你还没有很好的Flow集成。 Flux currently lets you do very impressive static type checks Redux doesn't support yet。我们到达那里，但需要一些时间。

我认为第一个是初学者的最大障碍，第二个可能是过度热心的早期采用者的问题，第三个是我个人的宠儿。除此之外，我不认为使用Redux会带来Flux避免的任何特殊缺点，有些人说它与Flux相比甚至有一些上升空间。

另请参阅我对upsides of using Redux的回答。

Answer 2

Redux和Flux都需要大量的样板代码来涵盖许多常见模式，特别是那些涉及异步数据获取的模式。 Redux文档已经有一些减少样板的示例：http://redux.js.org/docs/recipes/ReducingBoilerplate.html。您可以从像Alt或Fluxxor这样的Flux库中获得所需的一切，但Redux更喜欢自由而不是功能。对于一些开发人员而言，这可能是一个缺点，因为Redux会对您的状态做出某些可能无意中被忽视的假设。

您真正回答问题的唯一方法是尽可能尝试使用Redux，也许是在个人项目中。 Redux的出现是因为需要更好的开发人员体验，并且它偏向于函数式编程。如果您不熟悉减速器和功能组合等功能概念，那么您可能会放慢速度，但只会略微降低。在数据流中采用这些想法的好处是更容易测试和可预测性。

免责声明：我从Flummox（一种流行的Flux实施）迁移到Redux，其优势远远超过任何缺点。在我的代码中，我更喜欢魔法。更少的魔力需要花费更多的代价，但这只是一个非常小的代价。

Answer 3

使用Redux而不是其他Flux替代方案的最大好处之一是它能够将您的思维重新定向为更具功能性的方法。一旦你理解了电线如何连接你就会发现它的优雅和简约的设计，并且永远不会回头。

Answer 4

Flux和Redux。。

Redux不是纯粹的Flux实现，但绝对受到Flux的启发。最大的区别在于它使用单个存储来包装包含应用程序所有状态的状态对象。您不必创建像Flux那样的商店，而是编写将改变单个对象状态的reducer函数。此对象表示应用中的所有状态。在Redux中，您将获得当前操作和状态，并返回新状态。这意味着动作是顺序的，状态是不可变的。这让我想到了Redux中最明显的骗局（在我看来）。

<小时/> Redux支持immutable概念。

为什么不变性？

原因很少：
1. 连贯性 - 存储器的状态总是被减速器改变，因此很容易跟踪谁改变了什么。
2. 性能 - 因为它是不可变的，Redux只需要检查以前的状态！==当前状态以及是否要呈现。无需每次都将状态循环到确定的渲染 3. 调试 - 新的精彩概念，例如Time Travel Debugging和Hot Reloading。

更新：如果这还不足以说服，请观看Lee Byron关于Immutable User Interfaces的精彩演讲。

Redux需要开发人员通过代码库/库来维护这个想法。您需要确保选择库并以不可变的方式编写代码。

如果您想了解更多关于Flux概念的不同实现（以及最适合您需求的概念），请查看this有用的比较。

在说完之后，我必须承认Redux是JS未来发展的目标（就像写这些行一样）。

Answer 5

我更喜欢使用 Redux ，因为它使用一个商店，与 Flux 相比，状态管理更容易，同时 Redux DevTools 它＆＃39;这是一个非常有用的工具，可以让您通过一些有用的数据了解您在状态中所做的事情，并且它与React开发工具非常一致。

Redux 与其他流行的框架（如 Angular ）一起使用时也更灵活。无论如何，让我们看看Redux如何将自己介绍为一个框架。

Redux有三原则，它可以很好地引入Redux，它们也是Redux和Flux之间的主要区别。

单一来源

整个应用程序的状态存储在对象树中   一家商店。

这使您可以轻松创建通用应用程序，作为您的状态   服务器可以序列化并充当客户端而无需额外的   编码工作。单个状态树也使调试或更容易   检查申请;它还可以让你坚持你的应用程序   处于发展状态，以加快开发周期。一些   传统上难以实施的功能 -   例如，撤销/重做 - 如果可以突然变得微不足道   你所有的状态都存储在一棵树上。

console.log(store.getState())

/* Prints
{
  visibilityFilter: 'SHOW_ALL',
  todos: [
    {
      text: 'Consider using Redux',
      completed: true,
    },
    {
      text: 'Keep all state in a single tree',
      completed: false
    }
  ]
}
*/

状态为只读

改变状态的唯一方法是发出一个动作，一个对象   描述发生的事情。

这确保了视图和网络回调都不会   永远写到国家。相反，他们表达了一种意图   改变国家。因为所有变化都是集中的并且发生   一个接一个严格的命令，没有微妙的竞争条件   提防。由于动作只是普通对象，因此可以记录它们，   序列化，存储，然后重放以进行调试或测试   目的。

store.dispatch({
  type: 'COMPLETE_TODO',
  index: 1
})

store.dispatch({
  type: 'SET_VISIBILITY_FILTER',
  filter: 'SHOW_COMPLETED'
})

使用纯函数进行更改

要指定动作如何转换状态树，请编写   纯粹的减速器。

Reducers只是纯粹的函数，它采用先前的状态和   动作，并返回下一个状态。记得要回归新的状态   对象，而不是改变以前的状态。你可以从一开始   单个减速器，随着您的应用程序的增长，将其拆分为更小的   管理状态树特定部分的reducer。因为   reducer只是函数，你可以控制它们的顺序   被调用，传递附加数据，甚至为可重用的Reducer   常见的任务，如分页。

function visibilityFilter(state = 'SHOW_ALL', action) {
  switch (action.type) {
    case 'SET_VISIBILITY_FILTER':
      return action.filter
    default:
      return state
  }
}

function todos(state = [], action) {
  switch (action.type) {
    case 'ADD_TODO':
      return [
        ...state,
        {
          text: action.text,
          completed: false
        }
      ]
    case 'COMPLETE_TODO':
      return state.map((todo, index) => {
        if (index === action.index) {
          return Object.assign({}, todo, {
            completed: true
          })
        }
        return todo
      })
    default:
      return state
  }
}

import { combineReducers, createStore } from 'redux'
let reducer = combineReducers({ visibilityFilter, todos })
let store = createStore(reducer)

了解更多信息，请访问here

Answer 6

Redux需要有关不变性的纪律。我可以推荐的东西是ng-freeze，让你知道任何意外的状态变异。

Answer 7

据我所知，redux受通量的启发。 Flux是一种类似于MVC（模型视图控制器）的体系结构。由于使用MVC时，由于可伸缩性问题，facebook引入了变化。因此，flux不是实现，而是一个概念。实际上，redux是通量的实现。

使用Redux而不是Flux可能有什么缺点

7 个答案:

Flux和Redux。。

为什么不变性？

使用Redux而不是Flux可能有什么缺点

7 个答案:

Flux和Redux。 。

为什么不变性？

Flux和Redux。。