React 并发渲染中『渲染可中断』具体指什么,中断后工作会被浪费吗?
围绕“React 并发渲染中『渲染可中断』具体指什么,中断后工作会被浪费吗”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出渲染可在浏览器空闲分片执行、可丢弃重来。
性能与并发专题面试题第 1 页,显示第 1–39 题,共找到 39 道完整解析,可继续按分类、标签与关键词缩小范围。
按稳定语义路径排序
围绕“React 并发渲染中『渲染可中断』具体指什么,中断后工作会被浪费吗”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出渲染可在浏览器空闲分片执行、可丢弃重来。
围绕“用 React DevTools Profiler 的火焰图和排序图如何定位最耗时的组件”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出按提交录制、按渲染耗时排序定位的流程。
围绕“如何诊断一个组件发生了本不该发生的重渲染,根因通常有哪些”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须给出 props 引用变化、父级重渲染、context 变化三类根因的排查思路。
通过候选人列表说明 React.memo 自定义比较器需要覆盖全部输出与事件行为,解释函数 prop 导致旧闭包的风险、不可变数据前提,以及有界逐项比较和深比较的成本取舍。
解释内联对象与箭头函数每轮产生新引用的原因,用筛选工具栏示例展示 useMemo 和 useCallback 的完整依赖,并讨论减少 props、移动对象创建位置和避免空依赖闭包错误。
用父组件计数与子组件成绩卡的示例解释 React.memo 如何逐项比较 props,区分父级更新、本地状态、Context 和重新挂载,并说明渲染次数为什么不能成为业务正确性的条件。
对照函数组件与类组件解释 memo 和 PureComponent 的比较范围,使用独立展开状态演示自身更新,说明 shouldComponentUpdate 与 arePropsEqual 返回值方向,以及迁移时的 state 合并差异。
从频繁变化的输入、便宜的子树、深比较和宽 Context 订阅分析 React.memo 无收益的原因,给出可复现的性能对照步骤,区分渲染次数减少与用户交互真正变快。
围绕“React 如何决定多个待处理更新的先后顺序,车道优先级模型解决什么问题”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出按更新来源分优先级、高优可抢占低优的调度思路。
围绕“React Profiler 组件如何包裹子树,onRender 回调能拿到哪些指标”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出 id/phase/actualDuration 等回调字段含义。
围绕“Profiler 报告的 actualDuration 与 baseDuration 差异说明什么优化机会”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出实际耗时与无 memo 全量耗时对比反映 memo 收益。
围绕“为什么生产环境默认拿不到 React Profiler 数据, profiling 构建有什么开销”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出生产构建移除 profiling 能力及其原因与按需开启的代价。
围绕“为什么并发渲染要求组件渲染必须是纯函数,副作用应该放在哪里”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出渲染可能被中断重放导致副作用重复执行。
围绕“React 的 render 阶段和 commit 阶段分别做什么,对性能优化有什么意义”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须区分纯计算与 DOM 提交两个阶段及其对中断和副作用放置的影响。
围绕“startTransition 标记的非紧急更新在调度上有什么不同的行为”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出被标记的更新可被打断、让位给紧急更新。
围绕“并发渲染下直接订阅外部 store 为什么会出现 tearing,useSyncExternalStore 如何解决”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出中断期间外部值变化导致同次渲染读到不一致值的问题及 API 的一致快照保证。
围绕“React 19 中 startTransition 接受 async 函数(Action)后与 React 18 ”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须对比 React 19 异步 Action 自动管理 pending/错误与 React 18 只接受同步作用域的差异。
围绕“为什么不能把受控输入框的 value 更新包在 startTransition 里”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出输入是受控同步渲染、延迟会导致打字卡顿/丢字符。
围绕“为什么 transition 不能减少渲染的总工作量,什么场景用它没有收益”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出 transition 只改变优先级和可中断性,并给出真正耗时在计算本身时的无效场景。
围绕“transition 与 Suspense 配合时如何避免已显示内容被 fallback 骨架屏替换”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出 transition 让已有内容停留直到新数据就绪这一行为。
围绕“用 transition 优化搜索输入与用防抖优化有什么本质区别”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出 transition 不延迟更新而是降低优先级、仍每次响应。
围绕“优化慢列表渲染时,useTransition 和 useDeferredValue 应该如何选择”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出能控制 setState 入口用 transition、只能拿到值用 deferredValue 的判断标准。
围绕“把每次渲染都新建的内联函数放进 useEffect 依赖数组会导致什么问题,如何修复”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出函数引用变化触发 effect 反复执行的症状及 useCallback/移入 effect 两种修法。
围绕“为什么只用 useCallback 而子组件没有 memo,仍然阻止不了子组件重渲染”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出父组件重渲染本身就会重渲染子组件这一前提。
围绕“useCallback 解决了什么问题,它的返回值在渲染之间如何保持”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出按依赖缓存函数实例保持引用稳定。
围绕“useCallback 的依赖数组写错为什么会产生读取到旧 state 的过期回调”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出缓存函数闭包捕获了旧值这一机制与修复方式。
围绕“useDeferredValue 在组件首次渲染时是否会产生延迟效果”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出初始渲染 deferredValue 等于原值、无延迟行为这一边界。
围绕“为什么 useDeferredValue 通常要和 React.memo 配合才能真正看到性能收益”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出延迟重渲染需要子树在紧急渲染中可被跳过的前提。
围绕“useDeferredValue 返回的滞后值在渲染过程中经历哪两个阶段”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出先以旧值渲染、后台再以新值重渲染的过程。
围绕“使用 useDeferredValue 时如何判断并提示用户当前展示的是过期内容”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出比较原值与 deferredValue 判断过期并做视觉降级。
围绕“React 实验性 API useEffectEvent 相比 useCallback 解决稳定回调问题有什么不同思”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须对比『非响应式事件函数读取最新值』与『依赖数组缓存引用』两种思路,并注明实验性版本状态。
围绕“useMemo 依赖数组漏写或多写会有什么症状,如何保证依赖正确”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须区分漏依赖导致陈旧值与多依赖导致缓存失效两类症状。
解释 useMemo 在开发编辑、初次挂载挂起等情况下可能丢弃缓存,用房间连接示例说明如何把资源创建与清理放在 Effect,并区分缓存、state、ref 和重新挂载后的生命周期。
围绕“什么情况下不该使用 useMemo”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须给出廉价计算、非稳定引用需求等不该用的判断标准。
用按标签筛选条目的示例解释 useMemo 何时计算、如何按 Object.is 比较依赖,说明同引用突变、新数组重算、A 到 B 再到 A,以及纯计算与开发严格模式的边界。
围绕“只在挂载时算一次的昂贵初始值,应该用 useMemo 还是 useState 惰性初始化”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出 useMemo 依赖变化会重算而惰性初始化只算一次这一关键差异。
围绕“与 props 和 state 无关的常量,放 useMemo 里和提升出组件外有何区别”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须指出与组件输入无关的值应提升到模块作用域而非占 Hook。
通过报价与确认按钮解释 useMemo 缓存计算结果、useCallback 缓存函数引用的区别,展示完整依赖和旧闭包边界,并说明函数创建、函数调用、请求去重与异步缓存并不是同一件事。
围绕“useTransition 返回的 isPending 适合设计什么样的加载反馈”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出用 pending 状态做内联弱反馈而非替换内容的 UX 决策。