Skip to content

React 源码和分析中常用术语的解释。阅读过程中如果遇到不熟悉的概念,可以回到这里查看。每个术语在仓库中有对应的深入讲解文档。

术语英文含义对应文档
FiberFiberReact 的最小工作单元,JS 对象,记录组件状态和工作进度01-fiber-node-structure
ReconcilerReconciler协调器,负责对比新旧树找差异,React 内部核心ReactFiber.js (GitHub)
RendererRenderer渲染器,将差异应用到目标平台(DOM/Native/SSR)08-renderer/01-dom-renderer
SchedulerScheduler调度器,决定任务何时执行、按什么优先级05-scheduler
Work LoopWork Loop工作循环,while 遍历 Fiber 树的 performUnitOfWork03-work-loop/01-work-loop-overview
beginWorkbeginWork"递"阶段,向下处理 Fiber,调用组件函数/renderReactFiberBeginWork.js (GitHub)
completeWorkcompleteWork"归"阶段,向上冒泡,创建 DOM、收集 flagsReactFiberCompleteWork.js (GitHub)
CommitCommit提交阶段,同步执行 DOM 操作和生命周期(不可中断)03-work-loop/05-commit-phase
LaneLane优先级模型,31 位二进制表示,支持组合和分离ReactFiberLane.js (GitHub)
LanesLanes多个 Lane 的组合(位掩码)同上
WorkTagWorkTagFiber 类型标记(0=函数组件, 5=DOM元素, 等)ReactWorkTags.js (GitHub)
FlagsFlags副作用标记(Placement/Update/ChildDeletion 等)ReactFiberFlags.js (GitHub)
subtreeFlagssubtreeFlags子树的 flags 合集(冒泡收集)同上
bailoutbailout跳过不需要更新的子树(props 没变时的优化)03-work-loop/02-begin-work
alternatealternate双缓冲指针,current ↔ workInProgress 互指02-fiber-architecture/05-double-buffering
currentcurrent当前显示在屏幕上的 Fiber 树同上
workInProgressworkInProgress正在内存中计算的 Fiber 树同上
stateNodestateNodeFiber 对应的真实 DOM/组件实例01-fiber-node-structure
memoizedStatememoizedState类组件存 state,函数组件存 hooks 链表头04-hooks-internals/01-hooks-mount-update
memoizedPropsmemoizedProps上次渲染使用的 props01-fiber-node-structure
pendingPropspendingProps本次渲染待处理的 props同上
updateQueueupdateQueue更新队列(不同 Fiber 类型存不同内容)同上
HookHookhooks 链表上的一个节点(useState/useEffect 等)ReactFiberHooks.js (GitHub)
DispatcherDispatcherHooks 分发器,mount 和 update 时不同ReactHooks.js (GitHub)
EffectEffectuseEffect/useLayoutEffect 的内部表示04-hooks-internals/03-effect-hooks
Eager StateEager StatesetState 时的优化:预计算新状态避免不必要的渲染04-hooks-internals/02-state-hooks
HostConfigHostConfig宿主配置,Reconciler 与平台交互的接口08-renderer/03-custom-renderer
HostRootHostRootFiber 树根节点(tag=3)ReactRootTags.js (GitHub)
HostComponentHostComponent原生 DOM 元素(tag=5)ReactWorkTags.js (GitHub)
HostTextHostText文本节点(tag=6)同上
HydrationHydration将 SSR HTML 与客户端 React 状态连接The Perils of Hydration
SuspenseSuspense组件挂起时显示 fallback(throw Promise 机制)06-concurrent-features/02-suspense
TransitionTransition过渡更新,低优先级可中断06-concurrent-features/03-transitions
ConcurrentConcurrent并发渲染,可中断可恢复06-concurrent-features/01-concurrent-rendering
RSCRSCReact Server Components,服务端组件09-react-server/01-rsc-architecture
FlightFlightRSC 的序列化协议09-react-server/02-flight-protocol
FizzFizzReact 的 SSR 渲染器代号08-renderer/02-ssr-fizz
MessageChannelMessageChannelScheduler 使用的时间切片机制Scheduler.js (GitHub)
shouldYieldshouldYield检查时间片是否用完的函数05-scheduler/03-time-slicing
propagateContextChangepropagateContextChangeProvider value 变化时通知子树消费者01-react-core/03-context
unwindunwind错误恢复时回退到边界的操作03-work-loop/06-error-handling
mountmount首次渲染04-hooks-internals/01-hooks-mount-update
updateupdate后续更新渲染同上
ChildDeletionChildDeletion (flag)删除子节点标记(旧名 Deletion,已改名)ReactFiberFlags.js (GitHub)
PlacementPlacement (flag)插入节点标记同上
PassivePassive (flag)useEffect 相关标记04-hooks-internals/03-effect-hooks
RootTagRootTag根类型(LegacyRoot=0, ConcurrentRoot=1)ReactRootTags.js (GitHub)
TypeOfModeTypeOfMode模式位标记(ConcurrentMode, StrictMode 等)ReactTypeOfMode.js (GitHub)

下一步

Released under the MIT License.