Immer
不可变[可共享]数据结构
对象,数组,map,set 等创建后,内部状态不可以修改的数据结构。
可共享:新建一个数据结构,未修改部分共享旧的部分,修改部分采用新的。
不可变共享数据结构优点
Immutable data structures allow for (efficient) change detection: if the reference to an object didn't change, the object itself did not change. In addition, it makes cloning relatively cheap: Unchanged parts of a data tree don't need to be copied and are shared in memory with older versions of the same state.
便于判断对象是否改变,只需比较引用,无需深度比较
克隆更方便,没变的部分保持旧的引用,节省内存空间
immer 做了什么
检测突变并抛出错误
帮我们用普通的 js 操作,便可以实现不可变数据结构
curried producers
react & immer
useState + produce
useImmer
useReducer + produce
useImmerReducer
redux + immer
api
produce 返回的值默认是 递归 freeze 的
current() original()
patches 补丁
applyPatches
produceWithPatches
todo: 多次 produce,如何快速还原?
性能优化
对大对象提前 shallow freeze
producer 的返回值
直接在 draft 上修改,无需 return
不改动 draft 直接返回新数据, return newData
返回 undefined, return nothing
Use with Typescript
多使用 readonly,借助 utility type Immutable
Immer vs Immutable.js
immer 比较方便,直接使用原生语法即可,immutable 需要使用提供的 api
性能方面:当数据不是超大时,都可胜任;数据超大时,immutable 的性能比较好;但是 immutable 的数据结构不是原生 js,需要转成原生 js 的话 比较耗费性能,比 immer 性能差
最后更新于