前言
一般的异步请求,可以在componentDidmount中直接进行请求,无需借助redux。
但是在一定规模的项目中,上述方法很难进行异步流的管理,通常情况下我们会借助redux的异步中间件进行处理。
异步流的中间件有很多,当下主流的异步中间件有两种,redux-thunk、redux-saga。
一、redux-thunk中间件?
redux-thunk的优点?
- 体积小:redux-thunk的实现方法很简单,只有不到20行代码。
- 使用简单:redux-thunk没有引入像redux-saga或者redux-observable额外的范式,上手比较简单。
redux-thunk的缺点?
- 样板代码过多:与redux本身一样,通常一个请求需要大量的代码,而且很多请求都是重复性质的。
- 耦合性严重:异步操作与redux的action耦合在一起,不方便进行管理。
- 功能孱弱:有一些实际开发中常用的功能需要自己进行封装
redux-saga中间件?
redux-saga优点?
异步解耦:saga异步操作被转移到saga.js中,不再是参杂在axtion.js或者是component.js
中。
action的摆脱thunk function,dispath的参数依然是一个纯粹的action,而不是充满黑魔法的thunk function。
功能强大:redux-saga提供了大量的saga辅助函数和 Effect创建器供开发者使用,开发者无需封装或者简单封装即可使用。
灵活性:redux-saga可以串行/并行组合起来,形成一个非常使用的异步flow。
易测试:提供了各种case的测试方案,包括mock task,分支覆盖等等。
redux-saga缺陷?
额外的学习成本:redux-saga不仅在使用难以理解的gennertor function,而且有数十个API,学习成本远超过redux-thunk。最重要的是额外的学习成本是只服务于这个库的,与redux-observable不同,redux-observable,虽然有额外的学习成本,但是背后是rxjs和一整套思想。
体积庞大:体积略大,代码近2000行,min版25KB左右
功能过剩:实际上并发控制等功能很难用到,但是我妈依然需要引入这些代码。
ts支持不友好:yield无法返回Ts类型。