用途：为构建现代 React 应用定义规则、约定与架构决策，偏好使用 TanStack 生态与 XState，跨 Web 与 React Native 通用。平台特定模式分别参考 react-web-advanced（TanStack Router、Start、Virtual）与 react-native-advanced（Expo Router、FlashList、MMKV）。
主要能力与规则：
- useEffect 禁则：禁止用 useEffect 做数据获取、派生状态、状态与 props 同步、响应事件、订阅外部 store 或复杂异步流程；允许用于非 React 外部系统同步、需清理的浏览器/原生 API 订阅、挂载时分析日志，以及将 React Query 数据桥接到 XState。挂载一次性副作用建议封装 useMountEffect。
- 状态管理分工：服务端状态归 React Query；URL/路由状态归 Router；复杂 UI 流程归 XState；共享客户端 UI 归 Zustand；表单字段归 TanStack Form；Schema 校验归 Zod；简单局部 UI 用 useState。服务端状态与客户端状态不得混用。
- 优选替代：数据获取用 useSuspenseQuery + 路由预取；消费 Promise 用 use() + Suspense；派生值用 useMemo 或直接计算；外部 store 订阅用 useSyncExternalStore；昂贵渲染用 useDeferredValue/useTransition；复杂异步编排用 XState invoke/fromPromise；prop 变化重置状态用 React key。
- 何时用 XState：3 个以上互斥状态、异步副作用需在状态切换时取消、带守卫条件、需要并行状态、流程需脱离 React 独立测试、多步向导。简单开关或计数器仍用 useState。
- 架构分层：React Query 负责获取/缓存/失效/后台刷新；XState 负责状态机与流程编排；Zustand 负责跨组件 UI 状态；TanStack Form 负责表单生命周期；Zod 负责校验；TanStack Table 负责无头排序筛选分页分组；Vitest + Testing Library 负责测试。queryOptions 作为单一数据源，在 loader、组件与失效逻辑中统一复用。
- 组件组合：使用基于 Context 的复合组件（记忆化 context value）、具名 props 插槽模式，以及在布尔 props 泛滥时通过回调/渲染函数反转控制权。
常见陷阱：在 useEffect 中做派生状态、把服务端数据存入客户端状态、用 useState 复制 URL 状态、React Query 与 XState 重复管理同一数据、在状态机中调用 React hooks、用数组索引作 key、在组件内定义组件、用 Context 存高频变化状态、Zod 搜索参数 Schema 未用 .catch()。
参考文件按库分章：react-query、table、form、xstate、zustand、zod、testing、integration，遇到具体库时按需查阅。限制：技能聚焦“如何用与为何用”，不提供完整 API 文档，需借助文档查询或网络搜索；未提供安装命令、收费与价格信息。