服务端状态缓存

共 34 题
#

1. useSuspenseQuery 与 React 19 use()/Suspense 的集成边界,流式渲染与错误边界的工程协作

A useSuspenseQuery 无法使用 error boundary
B useSuspenseQuery 在 pending 时抛出 promise 触发 Suspense fallback ✓ 正确答案
C 流式渲染只能在服务端使用
D Suspense 边界只用于 UI 懒加载
#

2. Persisted Query Client(localStorage/OPFS)

A localStorage 容量远大于 OPFS
B 它把查询缓存持久化到 storage,刷新后可恢复避免重复请求 ✓ 正确答案
C 持久化缓存无需版本管理
D 它只能存到服务器
#

3. TanStack Query 的 select 选项在数据转换与缓存命中的应用

A select 在查询层转换数据,原始数据仍保留在缓存中供其他组件复用 ✓ 正确答案
B select 每次渲染都会重新执行,无法缓存
C select 会修改原始缓存数据
D select 与 useMemo 的作用完全相同
#

4. Optimistic Update 与 revalidation 的实现

A 乐观更新在服务端响应后才更新 UI
B 乐观更新先更新本地缓存,revalidation 再重新获取保证最终一致 ✓ 正确答案
C 乐观更新失败时无需回滚
D revalidation 会删除全部缓存
#

5. 依赖 hydration 的请求级 QueryClient 模式

A hydration 只在客户端创建新缓存
B 多个请求共享一个 QueryClient 是推荐做法
C 每个请求创建独立 QueryClient 避免串数据,dehydrate/hydrate 复用服务端缓存 ✓ 正确答案
D 请求级 QueryClient 无法配合 SSR
#

6. 客户端缓存的内存上限与淘汰策略(gcTime、容量清理)在长会话 SPA 的工程取舍

A gcTime 控制缓存回收时间,长会话 SPA 需主动管理缓存容量 ✓ 正确答案
B TanStack Query 自带严格的内存上限
C gcTime 越小越好,不会影响请求频率
D 缓存数据不会造成内存占用
#

7. RTK Query 与 TanStack Query 在 Redux 生态内外的工程取舍

A 两者都必须在 Redux 中运行
B RTK Query 与 Redux 深度集成,TanStack Query 框架无关、更灵活 ✓ 正确答案
C TanStack Query 是 Redux 官方方案
D RTK Query 无法配合 DevTools
#

8. SWR 的 mutation + optimistic update + rollback 机制在点赞/表单的工程价值

A 乐观更新只在服务端响应后生效
B 失败时无需回滚
C rollback 会删除整个缓存
D 先乐观更新本地缓存,失败时回滚,实现即时反馈与最终一致 ✓ 正确答案
#

9. TanStack Query v5 的 queryKey 序列化、staleTime/gcTime 缓存生命周期工程价值

A staleTime 控制缓存回收时间
B queryKey 对象按稳定顺序序列化,等价对象命中同一缓存 ✓ 正确答案
C gcTime 控制数据过期时间
D 对象 key 顺序不同会影响缓存命中
#

10. SWR 的 mutate 全局刷新与 revalidate 边界

A mutate 只能全局刷新
B revalidate 只会更新本地缓存
C mutate 可定向更新指定 key,revalidate 从服务器重新获取 ✓ 正确答案
D 全局刷新比定向刷新更高效
#

11. TanStack Query 的 queryClient.getQueryData/setQueryData 在跨组件通信的工程价值

A 组件可通过 queryKey 读写共享缓存,其他组件订阅后自动响应 ✓ 正确答案
B 它们需要组件处于渲染中才能调用
C 它们只能读取,不能写入
D 它们无法跨组件共享数据
#

12. Query 与 Server Components 的职责边界

A RSC 负责客户端缓存
B Query 库无法在 RSC 应用中使用
C 两者职责完全相同
D RSC 在服务端取数渲染首屏,Query 在客户端管理缓存与动态更新 ✓ 正确答案
#

13. SWR 与 TanStack Query 的能力对比

A TanStack Query 不支持无限查询
B 两者功能完全一致
C SWR 简洁轻量,TanStack Query 功能更丰富(无限查询、DevTools 等) ✓ 正确答案
D SWR 支持乐观更新而 TanStack Query 不支持
#

14. Redux Toolkit 的 listenerMiddleware 与 URL 状态/路由器的协作

A 它可在某 action 触发后同步更新 URL 或发起导航 ✓ 正确答案
B 它只能监听网络请求
C 它无法与 router 交互
D 它替代了所有 reducer 功能
#

15. Apollo Client + GraphQL 在缓存归一化(normalized cache)

A 数据按实体 type+id 归一化存储,更新一处全局生效 ✓ 正确答案
B 同一实体在缓存中存多份
C 缓存直接存储整棵查询树
D 归一化缓存无法自定义主键
#

16. SWR 的 fallbackData/fallback 在 SSR 与初始化的工程价值

A fallbackData 只在请求成功后生效
B fallback 无法在 SSR 中使用
C fallback 会清空已有缓存
D fallback 在 SSR 中把服务端预取数据注入客户端,避免首屏重复请求 ✓ 正确答案
#

17. stale-while-revalidate HTTP 缓存语义与 TanStack Query 的协同工程价值

A 两者只能选用其一
B HTTP 层与应用层都采用 SWR 语义,分层优化响应与一致性 ✓ 正确答案
C SWR 语义会在返回前阻塞请求
D HTTP 缓存与应用缓存完全无关
#

18. Query 的 Devtools 与 setQueryData 在 mutation 错误的协作

A setQueryData 只能读取不能写入
B DevTools 可视化缓存,帮助调试 setQueryData 的乐观更新与回滚 ✓ 正确答案
C DevTools 无法查看缓存状态
D mutation 错误时无需处理缓存
#

19. Query 的 placeholderData: keepPreviousData 在分页 UX 的工程价值

A 切换参数时先用上一页数据占位,新数据到达后替换,避免 loading 闪烁 ✓ 正确答案
B 它只用于服务端缓存
C 它会阻塞新数据加载
D 它会让分页无法更新
#

20. Mutation、Infinite Query、Suspense Query 的场景

A mutation 用于读取数据
B Infinite Query 用于写操作
C Suspense Query 无法配合 Suspense
D mutation 用于写操作,Infinite Query 用于无限滚动,Suspense Query 编排加载 ✓ 正确答案
#

21. TanStack Query 的 useMutation 在乐观更新与回滚的工程实践

A onMutate 只在成功后执行
B onMutate 存快照并乐观更新,onError 回滚,onSettled 重新验证 ✓ 正确答案
C onError 会更新乐观值
D 乐观更新无需取消查询
#

22. 乐观更新的并发冲突处理与 mutation scope/串行化,多用户编辑同一数据的冲突解决策略

A 乐观更新天然避免并发冲突
B 多用户编辑无需处理冲突
C mutation scope 串行化可避免并发覆盖,版本检测可发现冲突 ✓ 正确答案
D 冲突只能通过刷新解决
#

23. 查询取消(AbortSignal)与竞态条件处理,路由切换/组件卸载时请求自动取消的工程实现

A queryFn 传入 AbortSignal 并转发给 fetch,卸载时取消请求避免竞态 ✓ 正确答案
B 路由切换会自动忽略竞态,无需取消
C AbortSignal 无法取消 fetch
D 取消请求会导致内存泄漏
#

24. TanStack Query 的 invalidateQueries 在数据同步的工程应用

A 它只能失效全部查询
B 它不会触发重新获取
C 它只能失效单一查询
D 它使指定前缀的查询失效并重新获取,实现数据同步 ✓ 正确答案
#

25. TanStack Query 的 useInfiniteQuery 在无限滚动分页的现代实践

A getNextPageParam 返回 undefined 表示继续加载
B 它一次加载全部数据
C getNextPageParam 计算下一页参数,fetchNextPage 加载更多,data.pages 拼接数据 ✓ 正确答案
D 它无法处理分页
#

26. RTK Query 在 Redux Toolkit 中的服务端状态管理的工程应用

A 它独立于 Redux,不共享 store
B createApi 定义端点并自动管理缓存与失效,状态存于 Redux store ✓ 正确答案
C tags 机制只在服务端生效
D 它无法做乐观更新
#

27. TanStack Query 的 prefetchQuery 在路由预加载的工程实践

A 在路由 loader 或交互时预取数据写入缓存,导航后直接命中 ✓ 正确答案
B 预取会阻塞导航
C prefetchQuery 只在导航后生效
D 预取数据无法被 useQuery 命中
#

28. TanStack Query 在 SSR(Next.js、Remix)

A 用请求级 QueryClient 隔离数据,服务端预取后 hydrate 到客户端复用 ✓ 正确答案
B hydrate 只用于客户端取数
C SSR 无法配合 TanStack Query
D SSR 中可直接共享全局 QueryClient
#

29. TanStack Query 的 dependent queries(enabled)在条件请求的应用

A enabled 为 false 时查询仍会执行
B enabled 只影响缓存
C 依赖查询无法用 enabled 实现
D enabled 控制查询在依赖就绪后才执行,避免无效请求 ✓ 正确答案
#

30. TanStack Query 的 retry 与 retryDelay 在网络重试的工程取舍

A 重试次数越多越好
B 所有错误都应无限重试
C retry 控制重试次数,retryDelay 用退避策略避免重试风暴 ✓ 正确答案
D retryDelay 与重试体验无关
#

31. TanStack Query 的 queryClient 单例在多模块共享的工程实践

A 每个模块必须创建独立 queryClient
B 单例无法共享缓存
C 单例通过 QueryClientProvider 注入,跨模块共享缓存与统一配置 ✓ 正确答案
D SSR 下也应用单例
#

32. TanStack Query 的 suspense: true 在 React 19 Suspense 的工程协作

A 它只在客户端生效
B 它禁用了缓存
C 查询 pending 时抛出 promise 触发 Suspense fallback,配合错误边界处理错误 ✓ 正确答案
D 它无法与错误边界配合
#

33. TanStack Query 的 initialData 在 SSR 与客户端注水的工程应用

A 它无法用于 SSR
B 它只在请求成功后生效
C 它提供初始数据,SSR 中承接服务端预取结果避免首屏请求 ✓ 正确答案
D initialData 会覆盖服务端数据
#

34. TanStack Query 的 structuralSharing 在大数据响应的工程优化

A 它每次都会重建整个对象
B 它复用未变化部分的引用,减少新引用带来的重渲染 ✓ 正确答案
C 它对大数据响应没有帮助
D 它默认是关闭的