# 1. useContext 的 Provider 拆分与 re-render 性能治理 A memo 包裹的组件不会因 context 值变化而重渲染 B React Compiler 可以自动解决 context 广播问题 C 拆分 Provider 越多越好，没有成本 D context 值变化会重渲染所有直接消费者，应按变化频率拆分 Provider 并用 useMemo 稳定 value ✓ 正确答案
# 2. use() Hook 在条件中调用不等于完全放开 Hook 规则的边界 A use() 可在条件中调用，意味着所有 Hooks 都可以条件调用 B use() 在条件中调用会导致状态错乱 C useState 也可以随意放在条件分支中 D 仅 use() 不受调用顺序约束，其它 Hooks 仍须顶层固定顺序调用 ✓ 正确答案
# 3. useId、useSyncExternalStore、useInsertionEffect 的场景 A useId 生成稳定 ID、useSyncExternalStore 订阅外部源、useInsertionEffect 在 DOM 变更前注入样式，三者场景各异 ✓ 正确答案 B useInsertionEffect 用于读取 DOM 布局 C useId 适合直接作为列表 key D useSyncExternalStore 的 getSnapshot 每次返回新对象
# 4. useImperativeHandle 与 forwardRef（现代 ref-as-prop） A React 19 中函数组件仍需 forwardRef 才能接收 ref B React 19 中 ref 可作普通 prop 传递，useImperativeHandle 用于定制暴露的命令式 API ✓ 正确答案 C useImperativeHandle 会暴露整个 DOM 节点给父组件 D ref-as-prop 下 ref 可以通过 ...props 展开而不会丢失
# 5. useId SSR 一致性 ID 的工程价值 A useId 基于树位置编码生成，SSR 与水合时同一组件必然得到相同 ID ✓ 正确答案 B useId 基于随机数生成，SSR 与客户端可能不一致 C useId 生成的 ID 适合持久化存储 D useId 生成的值可以作为列表 key
# 6. useDebugValue 在自定义 Hooks 调试的应用 A useDebugValue 会影响生产环境的渲染性能 B useDebugValue 在 DevTools 中显示自定义 Hook 的调试标签，formatter 可延迟昂贵的格式化 ✓ 正确答案 C useDebugValue 可以在组件内部任意位置调用 D useDebugValue 用于修改 Hook 的返回值
# 7. useActionState/useFormStatus/useOptimistic 在表单场景的应用 A useFormStatus 可以读取任意表单的 pending 状态 B useActionState 的返回值只能是字符串 C useOptimistic 的乐观值在提交失败后需要手动还原 D useActionState 管理提交结果、useFormStatus 在子组件读 pending、useOptimistic 展示乐观中间态，三者分工协作 ✓ 正确答案
# 8. useInsertionEffect 在性能预算与首屏渲染的工程价值 A useInsertionEffect 在 DOM 变更前同步注入样式，避免 FOUC，专用于 CSS-in-JS 库 ✓ 正确答案 B useInsertionEffect 在浏览器绘制后执行 C useInsertionEffect 可以安全地读取 DOM 布局 D useInsertionEffect 在 SSR 中同样执行
# 9. eslint-plugin-react-hooks 与 React Compiler 对依赖数组的静态检查协作，自动化与手动标注的边界 A React Compiler 开启后 exhaustive-deps 规则完全没有存在必要 B eslint-plugin-react-hooks 只能检查 useEffect C 依赖数组可以随意省略，Compiler 会全部自动补全 D lint 插件检查 Hook 规则与依赖完整性，Compiler 自动记忆化并推断依赖，无法证明的代码需手动标注兜底 ✓ 正确答案
# 10. useEffectEvent（React 19.2）与 ref 化回调方案的对比，稳定引用与依赖收集的工程取舍 A useEffectEvent 提供 Effect 内可调用、总读最新值且不进依赖的稳定回调，比手工 ref 化方案更语义化 ✓ 正确答案 B useEffectEvent 返回的回调是响应式的，每次渲染都变化 C useEffectEvent 可以在事件处理器中调用 D ref 化回调方案可以完全替代 useEffectEvent 且没有缺点
# 11. useFormStatus（React 19）在父组件读取表单状态的工程价值 A useFormStatus 可以读取任意父组件的 state B useFormStatus 返回的是表单的输入值 C useFormStatus 让表单内部子组件直接读取最近 form 的 action pending 状态，免去 props 逐层传递 ✓ 正确答案 D useFormStatus 只能在服务端渲染中使用
# 12. use server/use client（React Server Functions） A use server 模块中的函数可以在客户端直接访问文件系统 B use server 标记服务端函数，参数与返回值经 Flight 序列化、以 action ID 跨网络调用，只支持可序列化数据 ✓ 正确答案 C Server Function 可以接收任意 JS 对象包括函数闭包 D use client 模块中的代码不会打包进客户端 bundle
# 13. React Server Components（RSC） A RSC 在服务端执行并输出 Flight Payload，不进客户端包，数据获取前移可减少 bundle 与瀑布流 ✓ 正确答案 B Server Components 会被打包进客户端 bundle 用于水合 C Server Components 可以使用 useState 管理交互状态 D 客户端组件可以直接 import 服务端组件
# 14. RSC 在 Next.js 16（默认 Turbopack） A Next.js 16 中 Turbopack 不支持 RSC 边界识别 B 修改 Server Components 会触发客户端整页热重载 C Next.js 16 默认使用 webpack 打包 D Turbopack 原生理解 use client/use server 边界并自动分割模块图，服务端依赖不会进入客户端 bundle ✓ 正确答案
# 15. RSC 边界跨越与 "use client"/"use server" 的混合使用 A Client Components 可以直接 import Server Components B 跨边界可以传递任意 JS 对象 C 服务端组件可把渲染好的子树作为 children 插槽传给客户端组件，跨边界 props 必须可序列化 ✓ 正确答案 D use server 只能用于整个文件，不能标记单个函数
# 16. React 19 的 use()、Actions 与 form 状态管理与老版本 Hooks 的差异？ A use() 与 Actions 体系减少 loading 样板代码，useActionState 替代了 useReducer+submit 的常见组合 ✓ 正确答案 B use() 可以完全替代 useEffect 的所有职责 C useActionState 与老版 useReducer 的职责完全相同 D form action 提交后表单不会自动重置
# 17. 自定义 Hooks 的设计原则，返回稳定引用、状态隔离、SSR 安全 A 自定义 Hook 可以安全地在渲染期访问 window 对象 B 自定义 Hook 内部可以使用共享的可变对象而不影响多实例 C 自定义 Hook 应返回稳定引用、保证每次调用状态独立，并延迟浏览器 API 访问到 effect 中保证 SSR 安全 ✓ 正确答案 D 自定义 Hook 不需要以 use 开头
# 18. useRef 的两阶段更新（mutation 不触发 render）与 useState 的边界 A ref mutation 立即生效但不触发渲染，UI 需要跟随值变化时应使用 useState ✓ 正确答案 B 修改 ref.current 会触发组件重新渲染 C useRef 的初始值每次渲染都会重新创建 D 渲染期间读写 ref.current 是安全的推荐做法
# 19. useEffect 的执行时机（commit 后）与 useLayoutEffect 在 DOM 测量场景的差异 A useEffect 在浏览器绘制之前同步执行 B useLayoutEffect 在服务端渲染时正常执行 C useEffect 与 useLayoutEffect 的执行时机完全相同 D useLayoutEffect 在 DOM 更新后、绘制前同步执行，适合 DOM 测量，useEffect 绘制后异步执行 ✓ 正确答案
# 20. useMemo/useCallback 与 React Compiler 自动 memoization 的关系 A Compiler 自动生成与 useMemo/useCallback 等价的记忆化，无法证明安全的代码 bailout 后仍需手工优化 ✓ 正确答案 B React Compiler 会移除 useMemo/useCallback 的语义 C 开启 Compiler 后所有手工 memo 都必须删除 D Compiler 只优化 Class 组件
# 21. useEffect 的依赖数组与清理函数机制 A 依赖变化时先执行新的 effect 再清理旧的 B 依赖数组逐项 Object.is 比较，变化时先执行上次清理再运行新 effect，闭包引用的响应式值必须全部列入 ✓ 正确答案 C 省略依赖数组表示只在挂载时执行一次 D 内联对象作为依赖不会导致 effect 重跑
# 22. Hooks 规则与闭包陷阱（Stale Closure）的成因与修复 A Hooks 可以在条件分支中调用，React 会自动处理 B Stale Closure 是闭包捕获旧渲染值的现象，可通过补全依赖、函数式更新或 ref 镜像修复 ✓ 正确答案 C useCallback 缓存函数后闭包永远是最新的 D Hooks 的调用顺序可以随意变化
# 23. useTransition 在性能预算与首屏渲染的工程价值 A Transition 把非关键更新移出紧急路径，保障输入响应预算，首屏关键内容仍应走紧急更新 ✓ 正确答案 B useTransition 能减少后台更新的总工作量 C 首屏的 LCP 内容应该包进 Transition 渲染 D Transition 更新永远不会执行完成
# 24. useEffect 的替代心智模型（You Might Not Need an Effect），渲染期计算、事件处理与 key 重置的工程取舍 A 所有数据派生都应该用 useEffect + setState 实现 B key 重置只影响单个组件不影响子树 C effect 是处理用户事件的首选方式 D 渲染期可计算的派生数据直接渲染或用 useMemo，用户操作放事件处理器，重置状态用 key 变化 ✓ 正确答案
# 25. React 19 Hooks 的依赖数组（deps） A 依赖数组使用深比较判断变化 B 依赖数组逐项 Object.is 比较，须包含闭包引用的所有响应式值，稳定引用不必列入 ✓ 正确答案 C 依赖数组可以随便写，不影响 effect 执行 D useRef.current 每次渲染变化，必须加入依赖
# 26. React 19 的 useEffect 在副作用清理（cleanup）的工程应用 A cleanup 在依赖变化重跑前与卸载时执行，应对称销毁资源并保证幂等，StrictMode 双调用可暴露非幂等清理 ✓ 正确答案 B cleanup 只在组件卸载时执行 C cleanup 里可以做任何 UI 重置 D 卸载后 setState 没有任何副作用可以忽略
# 27. React 19 的 useState 的函数式更新（setX(prev => prev + 1)）的工程取舍 A setX(x + 1) 与 setX(prev => prev + 1) 在任何场景下等价 B 异步回调中只能使用直接传值 C 函数式更新的回调中可以执行任意副作用 D 函数式更新按队列顺序基于最新 state 计算，批处理下多次增量更新更安全 ✓ 正确答案
# 28. React 19 的 useReducer 在复杂状态机与表单管理的工程应用 A useReducer 适合多字段联动与状态机，提交类场景 React 19 优先 useActionState，reducer 必须纯净 ✓ 正确答案 B useReducer 与 useState 完全等价，可随意替换 C reducer 中可以直接修改原 state 对象 D useReducer 不能管理表单状态
# 29. React 19 的 useLayoutEffect 在 DOM 测量与同步副作用的工程应用 A useLayoutEffect 在浏览器绘制之后执行 B useLayoutEffect 可以替代 useEffect 处理所有副作用 C useLayoutEffect 在绘制前同步测量与修正 DOM，避免闪烁，但会阻塞绘制且 SSR 不执行 ✓ 正确答案 D useLayoutEffect 在服务端渲染中正常执行
# 30. React 19 的 Hooks 规则（顶层调用、不在条件中） A Hooks 的调用顺序可以变化，React 会自动重新对应 B Hook 状态按调用顺序存入链表，条件调用会破坏对应导致状态错位，React 19 中 use() 是例外 ✓ 正确答案 C 条件渲染组件时可以直接在 if 中调用 useState D lint 无法检测 Hook 规则违反
# 31. React 19 的并发特性（Concurrent Features） A createRoot、Transition、useDeferredValue、Suspense、use() 等共同构成并发特性，输入保持紧急、派生工作降级 ✓ 正确答案 B 并发特性只包括 useTransition 一个 API C 并发特性会改变渲染结果的正确性 D flushSync 会把更新降级为低优先级
# 32. React 19 的 useActionState 在 Server Actions 的工程协作 A Server Action 抛出的错误会自动变成 useActionState 的 state B 无 JS 时 form action 完全失效 C useActionState 只能用于客户端本地函数 D useActionState 包装 Server Action，返回值驱动状态、isPending 覆盖提交期间，错误应返回结构化结果 ✓ 正确答案
# 33. React 19 的自定义 Hook 单元测试（renderHook from RTL）的工程实践 A renderHook 返回 result/rerender/unmount，配合 act/waitFor 断言返回值与副作用，wrapper 提供 context ✓ 正确答案 B renderHook 只能测试没有状态的自定义 Hook C renderHook 直接渲染真实 DOM 供断言 D renderHook 不能测试有副作用的 Hook
# 34. React 19 的 Hooks 在 Strict Mode 下双调用的工程意义与边界 A StrictMode 在生产构建中也会双调用 B StrictMode 开发环境双调用渲染与 effect 挂载清理，用于暴露非纯渲染与泄漏，生产构建不生效 ✓ 正确答案 C 双调用会改变最终渲染结果 D StrictMode 双调用是并发模式的产物，不能关闭
# 35. React 19 的 useContext 在跨组件状态共享的性能代价 A context 值变化时只有直接子组件重渲染 B context 广播式更新会让所有消费者重渲染，value 未 useMemo 时 Provider 每次渲染都会波及消费者 ✓ 正确答案 C memo 可以完全阻止 context 消费者的重渲染 D React Compiler 会自动优化 context 广播问题
# 36. React 19 的 useRef 在命令式 DOM 访问与缓存值的工程应用 A useRef 用于命令式 DOM 操作与缓存不参与渲染的稳定值，渲染期读写应避免 ✓ 正确答案 B 修改 ref.current 会触发组件渲染 C ref 缓存适合所有派生数据 D React 19 中 ref 必须通过 forwardRef 传递
# 37. React 19 的 useMemo 在依赖稳定性与缓存命中率的工程取舍 A useMemo 的依赖是每次渲染的新引用时缓存命中率依然很高 B useMemo 的依赖比较是深比较 C 所有计算都应该用 useMemo 包裹 D useMemo 的缓存命中率取决于依赖引用稳定性，应治理稳定引用并保持最小依赖 ✓ 正确答案
# 38. Server Components 在大型 Next.js 应用的代码分割价值 A Server Components 的代码会打包进客户端 bundle B RSC 让服务端代码不进客户端包，客户端代码按边界分割懒加载，客户端体积只随交互表面积增长 ✓ 正确答案 C 客户端组件可以直接 import 服务端工具库 D RSC 对大型应用的 bundle 体积没有影响
# 39. Server Actions 的安全考量（CSRF、Origin 验证、idempotency） A Server Action 只接受 POST 就能完全防御 CSRF B SameSite=Lax 可以解决所有安全问题 C 需校验 Origin/Host、设置 SameSite Cookie 并配合幂等键去重，POST 不自动免疫 CSRF ✓ 正确答案 D Server Actions 不需要幂等性设计
# 40. 服务端缓存管理（cache/use cache）的 revalidation 策略 A cache() 的缓存跨请求共享 B 强一致数据也应使用长缓存 C use cache 的缓存永远不过期 D 时间型 revalidate 适合延迟可接受的静态数据，事件型（tag/path）revalidate 适合写操作后的精准失效，两者可组合 ✓ 正确答案
# 41. React 19 的资源预加载 API（prefetchDNS/preconnect/preload/preinit） A prefetchDNS 会下载资源内容 B 预加载 API 只能用于客户端组件 C preload 适用于所有资源，越多越好 D prefetchDNS 只解析 DNS、preconnect 建立连接、preload 下载关键资源、preinit 立即初始化，用于缩短关键路径 ✓ 正确答案
# 42. RSC 数据预取 cache()/fetch(...{cache:force-cache}) 的边界条件 A cache() 的缓存跨请求跨用户共享 B cache() 只在请求作用域内去重，force-cache 跨请求缓存，用户个性化数据需按用户键隔离 ✓ 正确答案 C force-cache 的缓存会自动过期 D 所有 fetch 都应该加 cache: 'force-cache'
# 43. RSC 与 Client Component 交互，serializable props 边界与传递非可序列化对象的工程价值 A 跨边界 props 必须可 Flight 序列化，class 实例与函数会被丢弃，应设计为可序列化 DTO ✓ 正确答案 B RSC 可以把任意 JS 对象作为 props 传给 Client Components C 函数可以作为 props 直接跨边界传递 D Promise 不能跨边界传递
# 44. RSC 与 Suspense 在数据流边界的协作 A RSC 必须等所有数据就绪才能发送任何内容 B 流式传输只在客户端组件中生效 C Suspense 边界把 RSC 数据流切成独立单元，先发外壳再流式补发增量，客户端渐进呈现 ✓ 正确答案 D 边界越细越多越好
# 45. React Compiler 自动记忆化的原理与手动 memo/useMemo 的边界？ A React Compiler 通过运行时代码生成实现记忆化 B Compiler 编译期分析响应式依赖并自动生成等价 memo/useMemo/useCallback，无法证明安全的代码 bailout 后手工兜底 ✓ 正确答案 C Compiler 会删除所有手工 memo 导致语义变化 D Compiler 只优化 SSR 组件
# 46. React 19 的 useFormStatus/useFormState 在表单交互的工程价值 A useFormStatus 返回的是表单的输入值 B useFormStatus 管提交过程反馈（pending），useFormState/useActionState 管提交结果回显，配合实现自动禁用与错误展示 ✓ 正确答案 C 两者功能完全重复可以互换 D useFormStatus 可以读取任意表单的状态
# 47. Next.js 的 RSC Payload 因重复数据和过深 Client Boundary 持续增大时，如何定位 Flight 响应中的主要贡献者，并结合 use cache、cache tag 与 revalidation 控制传输体积和数据新鲜度 A RSC Payload 体积只取决于组件数量 B 边界越深 Flight 体积越小 C 用 Network/DevTools 定位 Flight 贡献者，cache() 与 use cache 去重降体积，tag/path revalidate 控制新鲜度 ✓ 正确答案 D revalidateTag 只能全站刷新
# 48. RSC 向 Client Component 传参时，React Flight 可处理的 Date、Map 与普通 JSON 有何差异，为什么带原型和方法的 class instance 不能直接跨边界 A Flight 可以把 class 实例的完整原型链传给客户端 B 普通 JSON 在 Flight 中携带类型信息 C Flight 对 Date/Map/Promise 做类型标记与重建，class instance 的原型与方法不可序列化，需用 DTO + 客户端重建 ✓ 正确答案 D 跨边界传递 class 实例是推荐做法
# 49. Server Action 仅接受 POST 仍不能自动消除 CSRF；在反向代理、多自定义域和预览环境下，应如何校验 Origin/Host、SameSite Cookie、CSRF token 与 Fetch Metadata，并处理缺失 Origin 的合法请求 A Server Action 只接受 POST 就能免疫 CSRF B 缺失 Origin 的请求可以一律放行 C 跨站表单可伪造 POST 且 Cookie 自动携带，需 Origin/Host 校验、SameSite、token 与 Fetch Metadata 多层防护 ✓ 正确答案 D SameSite=Strict 能解决全部安全问题
# 50. 恶意 Flight 负载、伪造 Server Function 调用和资源耗尽分别可能从哪里进入 A Server Action 端点是内部接口，不需要防护 B 限流只防 DDoS，防不了伪造调用 C 客户端提交的数据可以完全信任 D 恶意 Flight 负载、伪造 action 调用与资源耗尽分别从解析器、暴露端点与并发/体积进入，需解析校验、鉴权与限流 ✓ 正确答案
# 51. 把 "use client" 从应用布局根节点下移到交互叶子后，如何通过构建 manifest、Flight 响应和浏览器 coverage 对比客户端 JS、共享 chunk 与水合时间，并防止服务端依赖被意外拉入客户端包 A 边界下移后客户端 bundle 体积会增大 B 服务端依赖被打入客户端包不会报错也无法预防 C "use client" 下移不影响水合时间 D 用构建 manifest、Flight 响应与 Coverage 对比边界下移收益，并靠构建审计与依赖 lint 防服务端依赖泄漏 ✓ 正确答案
# 52. RSC 与 Client Component 的序列化边界，哪些值不能跨边界传递？ A 所有 JS 值都可以跨 RSC 边界传递 B 函数、class 实例、Symbol、循环引用等不可跨边界传递，应传可序列化 DTO 或标识 ✓ 正确答案 C 跨边界传函数是 React 19 的推荐做法 D 非序列化 props 在生产环境会抛出致命错误
