framework
framework/react/react19/index.md
medium
framework-react-react19-index
React 19 新特性集合:use + Suspense 取数 / Actions 表单提交 / 并发渲染调度 / React Compiler 自动记忆化 / useEffectEvent。Use when 用 React19+ 新写法重构组件 / 替换 useEffect 取数为 Suspense / 表单改 Actions / 删手写 useMemo
子项索引
| 子项 | 一句话 |
|---|---|
| data-fetching-with-suspense skill | React19 用 use(promise)+Suspense 声明式读已建 promise/context,非取数层 |
| form-actions skill | React 19 表单 Actions 三件套 useActionState / useOptimistic / useFormStatus 替手写 onSubmit |
| concurrent-rendering skill | React 并发渲染防卡顿 — useTransition 标记非紧急更新 / useDeferredValue 延迟昂贵派生值 |
| react-compiler-memo skill | React Compiler 开启后自动记忆化,默认不再手写 useMemo/useCallback/React.memo,仅保留三类例外 |
| effect-event skill | React19.2+ 用 useEffectEvent 把「读最新值但不该触发重跑」的非响应式逻辑移出 effect 依赖 |
React 19 · 新特性
本层包含
| 名称 | 类型 | 一句话 |
|---|---|---|
| data-fetching-with-suspense | 叶 | use(promise) + Suspense 取数 |
| form-actions | 叶 | Actions 表单提交三件套 |
| concurrent-rendering | 叶 | useTransition / useDeferredValue |
| react-compiler-memo | 叶 | Compiler 自动记忆化边界 |
| effect-event | 叶 | useEffectEvent 隔离非响应式逻辑 |
何时下钻
- 异步取数想去掉 loading/error 样板 →
data-fetching-with-suspense.md - 表单提交、乐观更新、pending 态 →
form-actions.md - 输入框 / 大列表过滤卡顿,要分优先级 →
concurrent-rendering.md - 想删手写 useMemo/useCallback/memo 或纠结要不要加 →
react-compiler-memo.md - effect 里读了 prop/state 又不想它进依赖数组 →
effect-event.md
链接
- 上层:
../index.md - 平行:
../hook/index.md·../state/index.md·../error-handling/index.md - 跨引:
../../antd/index.md(表单组件配 Actions 用)