如何深入掌握并灵活运用React Immutable库进行高效数据管理？

本文共计2389个文字，预计阅读时间需要10分钟。

目录

1.介绍

2.优点

3.对象处理

4.数组处理

5.优化组件渲染

6.使用 immutable 和 Redux 集成

1.介绍

假设之前的 Redux 集成体积为 1GB，现在需要修改 Redux 树中的某个小节点（节点大小非常小），我们来进行优化。

目录

• 1. 介绍
• 2. 优缺点
• 3. 对象处理
• 4. 数组处理
• 5. 优化组件渲染
• 6. immutable和redux集合使用

1. 介绍

假设当前 redux 的大小为 1G，现在要修改 redux 树中的某个节点（节点的大小很小），我们就需要深复制整棵 redux 树，只为了修改很少的数据，这样对于性能的损耗是非常大的。于是我们使用 Immutable 来对这一现象进行优化，Immutable 只会深复制发生改变的节点及其祖先节点，然后修改后返回新数据。

Immutable.js 出自 Facebook，是非常流行的不可变数据结构的实现之一。它实现了完全的持久化数据结构，使用结构共享。所有的更新操作都会返回新的值，但是在内部结构是共享的，来减少内存占用。

• 持久化数据结构：这里说的持久化是用来描述一种数据结构，指一个数据，在被修改时，仍然能够保持修改前的状态，即不可变类型。