Skip to main content

Fiber ↔ internal React Object to rep each Node of DOM Tree

Fiber acts as unit of work in Render Phase & Commit Phase

Fiber replaces React Element for VDOM

extra intermediate layer between DOM API & React Element, allows optimization

Fiber is a more granular unit in React, smaller than Component

Fiber used to keep track of Component instance

Fiber is used in new Reconciliation Algorithm for React 16+; deprecates older Stack Reconciler algorithm

Stack Reconciler​

deprecated Reconciliation Algorithm used for VDOM from React 15.

References​

  1. Reconciliation ↔ (process) (before Commit Phase) to compare Fiber stored in previous update vs new render

  2. VDOM ↔ Intermediate Abstraction layer between Source Code & DOM API , data structure to mirror DOM API comprised of Fiber (React Element)

  3. Component ↔ 🧱Composable code to Encapsulate, Reuse & return React Element Fiber via JSX