Arunoda Susiripala 参看原文,这篇文章发布有些时间了,但仍然是很好的学习资料,而且在随着学习和了解的深入,许多有意思的想法得到证实,那感觉真是很好.比如我前面诞生了一个想法,redux就是一个数据层啊!可以借助数据库的思想来学习,包括其中诞生的一些中间思想.在这篇文章有有了新的发现,在Meteor的state管理方法直接使用了
minimongo cache的名字,名字里的含义不言自明了.就是这些小点慢慢使我的学习过程更加深入.当然也有一些新的想法,有兴趣的往下看看.
Dec 22, 2015
重新思考Redux
Redux是非常好的框架.这篇文章既不是Redux的扩充也不是要创建一个新的Flux库,这里是对Redux模式的重新思考.
什么是Redux?
在我们讨论新内容之前,让我们先看看Redux是什么.
本质上,Redux是我们的app里存储客户端state的地方.
一些actions可以改变state.
我们使用纯函数来监听所有的actions并且使用当前的state作为上下文去创建新的state.这个函数叫reducer.
(之所以叫纯函数,是因为它不会突变state,而且它也没有任何异步操作.)有很多订阅者监听着他们需要修改的state.
如果你是Redux新手,看看这些由Redux创建者发布的视频
我以前和你一样,但是我现在喜欢Redux.
为什么是Redux?
现在有足够的理由使用React构建app.我们可以使用父子数据流,Meteor的Tracker based system,Relay或者Mobservable.
这些方法对于简单app(或者中型app应用)来说还是挺好的.但是一旦app规模变大,极有可能会丧失app的控制权.
我之所以这么说是从我两次重构kandira UI的经验来的,那个过程太痛苦了.
能和Redux很高工作的构架就是Redux.
Redux是一个简单概念,它采用了一些函数式编程的概念(实际上来自Elm)和Flux的构架.
有了Redux,
- 我们的state是可以预期的,在app中也是这样
- app的大部分是纯函数,UI也是纯函数.所以很容易测试.
- Redux是一个简单的库,所以没有任何魔法.
- Redux里的模式被很多开发者使用.所有你可以依据很好的生态系统.
上面这些观点就是我认为Redux非常重要的原因.
重新思考
我们正在考虑使用客户端state和Metero后台交互来重写app.我们认为Redux的模型更合适.但是我们还有许多问题要考虑,在那些地方书写逻辑代码,怎么减少模板代码量.
我们也不怎么确信Redux的state管理怎么和其他的state管理系统整合,比如Meteor的minimongo cache(译者:单词的含义意味着可以看做简单的mongo 数据库,看到这里你有什么想法呢？).这就是为什么我们想要寻求一些改变.
现在让我们讨论一下我们建议的一些修改.
使用Redux管理UI的state
在我们的app中,我们要保留一些states,Redux就是用于UI state管理的组件.在Redux之外可能会有其他部分来管理state,例如像是REST API的缓存或者GraphQL.在Meteor中,可能是Minimongo cache.
Redux中的导航
update:
在评论和其他地方,我准备试试simple-redux-router.看起来可以在Redux中进行导航.他允许React路由器管理布局和dispatch actions到store.
我把simple-redux-router和我的sample app进行整合,整合过程还好除了即时加载过程.
现在,我们准备把React Router和Redux合并.但是我们仔细考虑一下就可以发现,routing(路由)其实是另一种用户的action,类似按钮的点击action.所以router不应该成为app的管理或者app state的管理工具.
理想Redux中的router应该应route的改变而发起actions.这就是我们需要做的工作.然后我们使用reducer来改变需要的app state.
使用模块的目录结构
推荐的是默认的布局目录结构.但是我们需要添加新的特性时,我们需要在多个目录中添加代码.
有一个模式叫做鸭子模型,建议我们按组把相关的actions creators和reducer放到一个文件中.我们准备使用这个方法.我们也准备把相互关联的组件和redux container放到一个单一目录中.
用于数据加载的一些助手函数.
我们需要数据来渲染组件,通常我们通过action creator来做这件事.但是为了把数据加载和组件渲染很好的整合在一起,我们需要写一些模板式的代码.我们可以使用一些助手方法来消除这些模板代码.
整合在一起
为了充分理解这些理念,我们必需读一些代码.这也是我们构建实例代码app的原因.
这里是repo:rethinking-redux-demo.
