用途:这份资料整理 React 19 在启用 React Compiler 后的推荐写法,适合在用 Context、use() 钩子、ViewTransition 与 Suspense 时对照使用,避免沿用旧模式或手动优化。
主要能力与规则: Context 简写:使用 <MyContext value={someValue}>,不再用 <MyContext.Provider value={someValue}>。 use() 钩子:消费 context 时使用 use(MyContext),替代 useContext(MyContext)。 Compiler 自动优化:启用 React Compiler 后,不再使用 useMemo、useCallback 与 memo(),由编译器自动处理记忆化与函数引用稳定。 ViewTransition + Suspense:当 ViewTransition 包裹的内容同时包含 Suspense 与非 Suspense 子节点时,可能出现 hydration 错误(提示 style={{view-transition-name:"T_0"}} 不匹配)。原因是 ViewTransition 只在过渡触发时即时应用 view-transition-name,hydration 期间非 Suspense 内容揭示会提前激活 ViewTransition,导致服务端 HTML 与客户端属性不一致。 修复方式:将所有子内容放入 Suspense 边界,使揭示过程由 Suspense 协调;或把 Suspense 放到 ViewTransition 外层,但这样会让 Header 与 children 共用同一加载状态。
使用方式:按上述规则书写组件。仅在极少数情况下才考虑手动优化,例如外部库要求稳定引用,或性能分析确认 Compiler 未覆盖特定问题;应先做性能分析再添加手动优化。
限制:资料未提供安装命令、依赖版本、配置步骤与更多示例,暂未提供。