React Query+Zustand+Next.js + MongoDB全栈面试

一、React Query 高频面试题 + 精简标准答案

1. React Query 解决了原生 useEffect 请求什么痛点?

答:原生需手动维护 loading、error、缓存、重复请求;React Query 内置全局缓存,自动去重请求、页面切回刷新、过期策略,简化异步数据管理。

2. queryKey 作用是什么?

答:缓存唯一标识,相同 key 共享数据;key 变化自动重新请求,可数组传参区分不同接口数据。

3. staleTime 和 gcTime 区别?

答:staleTime:数据新鲜期,期间不重发请求;gcTime:缓存存活时间,无组件订阅后多久清空缓存。

4. 自动后台刷新原理?

答:监听页面 visibilitychange,切回页面判断数据过期则后台静默请求;支持轮询自动拉新。

5. 乐观更新 optimisticUpdates 原理?

答:先更新本地缓存,提升页面响应;接口失败自动回滚原有缓存数据。

6. 服务端渲染 Next 中怎么搭配 React Query?

答:App Router 用 hydration 同步服务端预取数据,避免客户端二次重复请求。

二、Zustand 高频面试题 + 精简标准答案

1. Zustand 对比 Redux 优势?

答:轻量无模板代码,无需 Provider 包裹;精准片段订阅,减少无效重渲染;API 简洁,上手成本低。

2. 为什么不需要 Context 就能全局共享状态?

答:store 是独立 JS 实例,内部维护订阅回调数组,组件直接订阅 store,不依赖 React 上下文。

3. 精准订阅怎么实现性能优化?

答:组件传入 selector 只订阅所需字段;仅选中状态变更,才触发组件重渲染。

4. persist 持久化中间件原理?

答:状态更新后序列化存入 localStorage;初始化读取本地存储回填 store。

5. 中间件执行顺序?

答:管道串行执行,前置处理数据 → 更新 state → 后置持久化 / 打印 dev 日志。

三、Next.js + MongoDB 高频题(你临时自学部分)

1. Next 连接 MongoDB 如何规避热更新重复连接?

答:全局缓存 mongoose 实例,判断已有连接不再重复创建,避免连接池溢出。

2. App Router SSR/SSG/ISR 取数据库数据区别?

答:SSG:构建时查库生成静态页;SSR:每次访问实时查库;ISR:定时增量更新静态页面。

3. Next API Route 作用?

答:搭建后端接口,前端页面直接请求,中间层对接 MongoDB,隐藏数据库密钥。

4. Mongoose Schema 作用?

答:约束数据库字段类型、默认值、校验规则,规范存入 Mongo 的数据结构。

四、综合追问(必问,串联你项目)

1. RN 项目里 Zustand + React Query 怎么配合分工?

答:React Query 管服务端接口缓存数据;Zustand 存纯客户端临时状态(弹窗、路由、筛选条件),职责分离。

2. 为什么 RN 不用 Redux,选 Zustand?

答:移动端追求包体积与渲染性能,Zustand 极简无冗余渲染,减少页面卡顿。

3. Next 全栈和 RN 客户端数据处理有什么区别?

答:RN 全客户端渲染,全靠 React Query 缓存;Next 可在服务端提前拉取 Mongo 数据,减轻客户端请求压力。

相关推荐
安妮细水长流1 小时前
【无标题】
数据库·mongodb
ly76891 天前
MongoDB 读写策略与一致性取舍:readConcern、readPreference 与 causal session
数据库·mongodb·writeconcern·readconcern·readpreference·因果一致性
ly76892 天前
MongoDB 事务开销实测:快照隔离下的写冲突、重试与分片事务边界
数据库·mongodb·事务·分片集群·快照隔离·写冲突
ly76892 天前
Spring Data MongoDB 批量写入实践:BulkOperations 批大小与写关注权衡
java·mongodb·spring·批量写入·bulkoperations·写关注·mongotemplate
Aolith2 天前
从收藏到错题本,我在 React 全栈项目里实现了一套复习系统
mongodb·react.js·全栈
ly76894 天前
MongoDB 副本集选举风暴排查:从心跳超时到 Journal 刷盘阻塞
数据库·mongodb·php·mongodb 副本集·选举风暴·journal 刷盘·writeconcern
SL-staff5 天前
技术实践:将Excel自动升级为可搜索的知识节点(JVS平台实现)
mongodb·elasticsearch·知识图谱·jvs平台·语义解析·企业文档管理·excel结构化
ClouGence6 天前
数据库迁移工具 CloudCanal v6.5.0.0 发布:新增 TDSQL PostgreSQL 多条链路,支持 MongoDB 双向同步
数据库·mysql·mongodb
浪子明X6 天前
MongoDB 迁移方案评审:用双写窗口和回放样本控制切换风险
数据库·mongodb
光影少年9 天前
Taro 是如何解析入口配置 app.config.ts 和页面配置的?
微信小程序·小程序·typescript·reactjs·百度小程序·taro