songshao の blog

在过去的 React 版本中，渲染过程是基于递归的，即组件树的遍历是通过递归函数来完成的。Fiber 这个名字来源于计算机科学中的 “Fiber”（纤程）概念，指的是一种轻量级的执行单元，可以在多个任务之间切换，并且可以中断和恢复执行。React 中的 Fiber 也是类似的概念，表示渲染过程中的任务单元，可以根据任务的优先级和时间片进行灵活的调度和中断。值得一提的是，Fiber 架构的设计和实现是一个非常复杂的过程，并且在不同版本的 React 中可能会有一些细节上的差异。

构建 Fiber 树：在进行首次渲染时，React 会构建一棵 Fiber 树，用于表示组件的层级结构和渲染顺序。它的目标是提高渲染性能和用户体验，通过将渲染工作分割成多个小任务，在不阻塞主线程的情况下逐步完成整个渲染过程。任务拆分：在渲染过程中，React 根据时间片（Time Slicing）的概念将渲染任务拆分为多个小任务（Fiber），每个小任务执行时间有限，并且可以中断和恢复。增量更新：在执行每个小任务时，React 会比较前后两次渲染结果，找出需要更新的部分，并对其进行增量更新。

FiberNode（也称为 Fiber 节点）是 React Fiber 架构中的核心概念之一，用于表示组件的层级结构和渲染过程中的任务。