Fabric UI update lifecycle vs old architecture

WHAT THIS TESTS The interviewer wants you to walk the Fabric pipeline phase by phase and contrast it with the legacy bridge's serialized, asynchronous three-thread flow.

A GOOD ANSWER COVERS In Fabric a UI update has three phases. Render: when component state changes, React runs the render and the Fabric renderer creates a React Shadow Tree composed of immutable C++ shadow nodes describing the UI. Commit: the new shadow tree is committed, which involves running Yoga layout to compute each node's position and size and diffing the new tree against the previously mounted one to determine the minimal set of changes; because nodes are immutable, this can happen on a background thread and supports concurrent rendering. Mount: the computed mutations are applied to the real native views on the main UI thread, updating only what changed. Crucially, the shadow tree lives in C++ and is shared with JavaScript through JSI, so there is no JSON serialization and no asynchronous bridge round trip. This contrasts with the old architecture, where JS computed updates, serialized them to JSON, and sent them asynchronously over the bridge to the shadow (layout) thread and then the main thread, a flow that could not be synchronous and congested under load. Fabric's design also unlocks React 18 concurrent features like Suspense and prioritized updates.

COMMON WRONG ANSWERS Describing UI updates as JSON messages crossing the asynchronous bridge describes the old architecture, not Fabric. Saying layout no longer uses Yoga is wrong; Yoga still computes layout. Claiming everything runs on the main thread misses that render and commit can be off-main. Conflating Fabric with TurboModules confuses the renderer with the module system.

LIKELY FOLLOW-UPS Why immutable shadow nodes? They enable safe concurrent rendering and clean diffing. Where does layout happen now? Still Yoga, during commit, in C++. How does this enable concurrent React? Synchronous, thread-safe access via JSI lets React schedule and interrupt work. What stays on the main thread? Mounting the actual view mutations.

ONE CONCRETE EXAMPLE A button press toggles state. React renders a new shadow tree (render), Fabric runs Yoga and diffs it against the old tree to find the changed node (commit), then on the main thread it updates just that native view's properties (mount), with no JSON serialized across an async bridge as the legacy model required.