跳转到主要内容

动机

出于兼容性和简便性的考虑,最好使用 React 内置的状态管理,而不要使用外部的全局 state。但是 React 本身有一定的局限性:

  • 只能通过状态提升至公共祖先来共享 state,但可能导致一颗巨大的树重新渲染。
  • context 只能存储一个值,而不能存储一组不确定的值,且每个值都有自己的消费者。
  • 这两种方式都很难将组件树(使用 state 的地方)与组件树的顶层(state 必须存在的地方)进行代码分离。

我们希望在保持 API 以及语义和行为尽可能接近 React 的同时,对上述问题进行改进。

Recoil 定义了一个正交有向图(directed graph orthogonal),并附加在 React 树中。State 变化从该图的根(我们称之为 atom)开始,通过纯函数(我们称之为 selector)的方式传入组件。具体原理如下:

  • 我们创建了无模板 API,其共享 state 的方式与 React 内部的 state 一致,拥有相同的 get/set 接口(如果需要,也可以使用 reducer 等)。
  • 我们可能会与 Concurrent 模式及其他 React 新特性兼容。
  • state 的定义是增量及分布式的,从而可以进行代码分割。
  • 可以用派生数据替换 state,而无需修改使用它的组件。
  • 派生数据可以在同步与异步间切换,而无需修改使用它的组件。
  • 我们可以将导航视为一等公民,甚至可以对链接中的 state 进行编码。
  • 以向后兼容的方式保存整个应用程序的 state 很容易,因此持久化存储 state 可以在应用程序更改之后避免。