React NativeUIManager cũ (Paper):
- React reconciler tính diff trên JS thread → gửi message "createView/updateView/removeView" qua bridge → UIManager native execute trong background queue → áp lên main thread.
- Async commit → có thể desync giữa state JS và UIView (vd state nói btn ẩn, UIView vẫn hiện trong vài frame).
- Concurrent React 18 không hoạt động đúng (commit không đồng bộ).
Fabric:
- Reconciler giờ chạy trong C++ (Hermes hoặc node-side), không qua bridge serialize.
- Layout (Yoga) + ShadowTree đặt trong C++, share memory với native renderer.
- Commit phase chạy đồng bộ với React reconciler — khi setState callback chạy, UIView đã updated.
- Hỗ trợ useLayoutEffect đúng nghĩa "trước paint".
- Concurrent React: Suspense, useTransition, automatic batching hoạt động đúng.
Khác biệt thực tế:
- Tap → setState → render: trên Paper có lag visible 16–32ms; trên Fabric đồng bộ trong cùng frame.
- Animation Reanimated UI thread giờ commit đúng order với React commit.
- Custom view native phải register qua Fabric component spec (Codegen) thay vì RCTViewManager.
Migrate cost: native components cũ (vd map view, chart custom) phải refactor sang <ComponentName>Fabric.tsx + .cpp spec. Đa số component thông dụng đã có version Fabric trong RN 0.76+.
Old UIManager (Paper):
- The React reconciler computes diffs on the JS thread → sends "createView/updateView/removeView" messages over the bridge → UIManager native executes in a background queue → applies on the main thread.
- Async commit → JS state and UIView can desynchronize (e.g. state says button is hidden but the UIView remains for a few frames).
- React 18 concurrent rendering does not work correctly (non-synchronous commit).
Fabric:
- The reconciler now runs in C++ (Hermes-side or node-side), no bridge serialization.
- Layout (Yoga) + ShadowTree live in C++ and share memory with the native renderer.
- The commit phase runs synchronously with the React reconciler — when a setState callback fires, the UIView has already updated.
- useLayoutEffect truly fires before paint.
- Concurrent React works: Suspense, useTransition, automatic batching.
Practical differences:
- Tap → setState → render: 16–32 ms visible lag on Paper, in-frame on Fabric.
- Reanimated animations on the UI thread now commit in the correct order with the React commit.
- Custom native views must register via a Fabric component spec (Codegen) instead of RCTViewManager.
Migration cost: old native components (map views, custom charts) must refactor to <ComponentName>Fabric.tsx + .cpp specs. Most popular components already ship a Fabric version in RN 0.76+.