已采纳
回答正文
回复
讨论正文
该问题的正文与回答。
背景
React 18 + Vite 5 的 B 端中台 SPA(约 220 个路由、日均 UV 12 万),运营/客服单会话经常挂 4~8 小时不刷新。站内 #162 的「Heap Snapshot 三步证据链」和 #590 的「usedJSHeapSize 基线漂移」我都读过了,我们的现状是:错误监控已上、performance.memory.usedJSHeapSize 每 30s 采样上报也在跑(100% 采样),但只能看到整页堆曲线在涨,看不到「涨的内存挂在哪个组件上」。
现象(真正的卡点)
usedJSHeapSize 大盘告警(#590 提到的基线漂移)我们已经踩过:单纯「绝对值 > 500MB」一周误报 6 次,「斜率 > 5MB/10min」又漏报 2 次真正的泄漏(泄漏发生在低频操作路径上,斜率算出来很低)。已尝试的排查
performance.memory 三字段(used/total/jsHeapSizeLimit)30s 采样:整页级,无组件维度,且 Chrome 私有字段不敢作为唯一信号;Object.keys(window) 计数增长:噪声太大,误报率 >50%;useRef 计数(mount 未 unmount),能发现「组件没卸载」,但发现不了「卸载了但闭包/定时器/订阅还持有」这种更隐蔽的泄漏,且拿不到 retained size 数字。期望得到的答案形态
v8.getHeapSnapshot / v8.writeHeapSnapshot 在 Node 侧 + 浏览器侧的组合、WeakRef + FinalizationRegistry 做「组件实例存活探测」的量化用法、还是干脆承认浏览器侧做不了、用「路由级 retained 代理指标」(如该路由存活期间的 usedJSHeapSize 增量 + 卸载后 Δ 值)来归因?