[翻译]为什么redux会超过flux?

72 篇文章 0 订阅
61 篇文章 0 订阅

From:Why use Redux over Facebook Flux?
redux是不同于flux的。尽管它们是相同的框架,但是redux可以通过方法组合的方法减少复杂的累积,而flux通过注册回调方法实现的。
虽然这不是最基础的区别,但是redux却可以实现更轻松的抽象,或者说容易实现,然而在flux中是很难或者不容易实现的。

Reducer 组合
以分页为例,使用flux+react router处理分页,但是实现结果的代码却非常的糟糕,造成代码糟糕的原因之一是flux用一种非常规的方法在store间共享方法。如果两个store处理不同的action请求,即可以通过继承继承store(不推荐使用的方法,当使用继承时你就把自己圈进了一个特定的设计方式中),或者可以从handler中调用一个方法,这个方法在某种程度上是建立在flux中store的私有state上。所有的操作都是比较繁琐的(尽管已经清楚地定义了可能的场景)。
然而,redux的分页自然要感谢reducer可以组合。你可以写一个reducer factory用来生成reducer,然后就可以在reducer目录树中使用。如此简单明了的关键在于redux中reducer是可以通过方法的组合进行嵌套的,而在flux中store却是扁平化的,就想react的组件可以嵌套一样。
这种方式也使得非常炫酷的效果像无用户代码undo/redo。你能想象一下用两行代码就可以把undo/redo添加到flux 应用中吗?挺难的。对于redux,我们还得再一次感谢reduex的这种组合模式。我需要强调的是关于这种组合模式没有任何的噱头,这种模式的详细描述都可以戳这里,这里也是受flux影响的。

服务器渲染
有人已经实现了使用flux在服务器端的渲染,但是我们注意到需要使用20个flux库才能让在服务器端的渲染能轻松一点,也许flux在服务器端的渲染门槛更高一点。可以肯定的是Facebook在服务器渲染方面没有提供太多的支持,所以他们并没有太多的关注这里,而是依靠生态系统进行完善。
flux中,store是单例的。也就意味着在server端很难根据不同的请求分离数据。这样说不是指不可能,而说说很难。这就是为什么大多数大flux库(比如说新的flux工具库)建议使用类而不是单例,这样的话就可以为每个请求都初始化一个store。
在flux中仍然还有下面几种情况是待解决(或者你可以使用自己比较喜欢的库像flummox 和Alt)
1、如果store是类,在和每个请求的dispatcher一起使用是该怎么创建和销毁?在什么时候注册store?
2、该怎样在store中和数据合体,在客户端和data解体?需要实现特定的方法吗?
很显然flux框架(不是vanilla flux)已经提供了解决上面问题的方案,但是我发现已经方法都已经过期。举例说明下:flummox实现serialize()和deserialize()(译者注:想了解细节都可以戳进去看看)。Alt框架是通过takeSnapshot()来解决这样的问题的,这个方法可以自动序列化state。
redux先进了许多,因为只有一个store(被多个reducer管理),你不再需要其他的API进行管理store于data的组合。正是因为单一的store所以你也不需要刷新store,这时你当然也可以读取到当前的state或者创建一个新的state。每个请求都获得一个独立的store实例。更多的服务端渲染。
这是一个可以同时使用flux和redux实现的一个例子,但是为了解决这样的问题flux却要引入太多的API,redux中甚至都不用解决这样的问题因为根本不存在,还多亏了简单的设计理念。

开发体验
我却是没有打算让redux成为一个流行的flux库--为了我的 React Europe talk on hot reloading with time travel,我拟定了一个主题:快速重构reducer代码或者
痛快地删掉action以抛掉过去,state正重新计算。
https://camo.githubusercontent.com/a0d66cf145fe35cbe5fb341494b04f277d5d85dd/687474703a2f2f692e696d6775722e636f6d2f4a34476557304d2e676966
我没有看到过使用单一的flux库来实现这样的功能。react的hot loader 是不会让你这么做的—事实上如果你编辑flux的store你就已经破坏了它,因为它不知道该怎么做了。
当redux需要重新加载reducer,它会掉用replaceReducer()方法,app会重新使用新的代码运行。在flux中,data和function是和store绑定在一起的,所以你不能简单的把function替换掉。然而,你必须使用dispatcher重新注册新的version。

生态
redux拥有大量且迅速壮大的生态系统。这是因为它提供了很多扩展,比如说中间件。被设计成use case 像logging,可以支持Promises,observables,routing, immutability dev checks, persistence等。记住,并不是它们所有都是有用的,但是可以作为有用的组合工具。

易用性
redux吸收了flux的所有优点(记录并且重新执行action,单向的数据流,依赖变动)并且也加入了些新的(简易的undo-redo,hot-reloading)不需要引入新的dispatcher和store注册。
让redux保持简单是非常重要的因为当你要实现更高层次的抽象时它会让你更理性。
和其他的flux库不一样的是,redux API的轻量级。如果你去掉开发者声明,注释和 可运行检查,只有99行。并且没有同步代码需要debug。
你可以好好地学习并了解下redux的全部。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值