React as a UI Runtime — overreacted
13 hours ago
- React is a UI library that functions as a programming runtime, managing a host tree (e.g., DOM) through a reconciliation process.
- Host instances (like DOM nodes) are managed by renderers (e.g., React DOM) in either mutating or persistent modes.
- React elements are lightweight, immutable JavaScript objects describing UI at a point in time; they form trees and are recreated on each render.
- Reconciliation decides whether to reuse or recreate host instances based on element type and position; keys help with dynamic lists.
- Components are functions that return React elements; they are assumed pure but allow local mutation and lazy initialization.
- Inversion of control lets React call components, enabling features like state, reconciliation, lazy evaluation, and better debugging.
- State (via useState) is local to component position in the tree; React batches updates and splits work into render and commit phases.
- Memoization (React.memo, useMemo) optimizes subtrees; React uses raw data without fine-grained reactivity for performance.
- Effects (useEffect) handle side effects after paint; they run on mount/update and can clean up; dependencies control re-execution.
- Custom Hooks compose reusable stateful logic; Hook calls must be at top level and unconditional, enforced by lint rules.
- Context provides dynamic scoping for values like themes; Fibers store local state and represent the component call tree.