Twenty 内存泄漏快速排查指南：用 Chrome DevTools 10 分钟锁定泄漏源头-平芜编程栈

Twenty 内存泄漏快速排查指南：用 Chrome DevTools 10 分钟锁定泄漏源头

【免费下载链接】twentyThe open alternative to Salesforce, designed for AI.项目地址: https://gitcode.com/GitHub_Trending/tw/twenty

Twenty 是一款面向 AI 设计的开源 CRM（Salesforce 的开源替代方案）。用它久了，页面越来越卡、标签页冻结甚至被浏览器强杀——多半是 Twenty 内存泄漏。这篇教程带你用 Chrome DevTools 走完"复现→抓现场→定位→修复"的完整排查流程，读完你能独立判断是否存在泄漏，并找到元凶。

复现现场：什么时候该怀疑内存泄漏

内存泄漏，指程序把"已经不再需要的内存"一直攥在手里不释放，占用量只增不减。它不是一上来就崩，而是慢性恶化：

用半小时后，滚动数据列表开始掉帧，切页面明显变卡
反复使用 AI 对话或工作流功能后，卡顿逐轮加重
浏览器提示标签页无响应，强制重启后短暂恢复

关键判据是内存只涨不跌。如果只是刚打开就慢，那多半是性能问题，不是泄漏。先按你日常的操作路径走 30 分钟，确认症状稳定复现，再开始抓现场——不可复现的泄漏没法排。

打开 Chrome DevTools 内存面板：准备工作

如果本地还没有源码，先克隆仓库：git clone https://gitcode.com/GitHub_Trending/tw/twenty，再按项目文档把 Twenty 跑起来并登录。
在 Chrome 里按F12（或Ctrl+Shift+I）打开 DevTools，切到Memory面板。
熟悉两个核心模式：
- Heap snapshot（堆快照）：拍下"此刻所有活着的对象"的照片；
- Allocation sampling（分配采样）：在你操作期间持续采样"谁在分配内存"，最适合抓现场。

排 Twenty 内存泄漏时，两种模式都会用到：采样负责抓动态现场，快照负责做前后对比。

如何录制内存分配：Allocation sampling 三步走

在 Memory 面板顶部选择Allocation sampling，点Start开始录制；
回到 Twenty 里做一轮完整操作：打开联系人列表、切换看板/表格视图、和 AI 助手聊几轮、触发一次工作流；
点Stop结束。

结束后按Retained Size（对象占用的保留内存大小）排序，看排在前面的条目。判断原则一句话：一次性出现正常，同类对象反复累积、越攒越多才可疑。

对比内存快照的 3 个要点

采样只能看个大概。要坐实嫌疑对象，取两次堆快照对比，只盯三点：

先取基线：页面加载完成、还没做任何操作时，取第一份快照。
再做压测：把同一组操作（比如开关 AI 对话面板、跑一遍工作流）重复 3 轮，每轮结束前点面板左上的垃圾回收图标清理一次可回收对象，再各取一份快照。先回收再拍，剩下的才是"真留着不放"的。
看差异：在快照对比视图中，只关注"操作后新增、且下一轮没有被释放"的对象。如果某一类对象每轮都多出一批、内存只涨不跌，泄漏基本锁定。

锁定 3 类常见泄漏源头

前端代码里的泄漏，九成落在下面三类。定位到可疑对象后，顺着引用链找到对应源码对号入座：

元凶一：变量没声明，偷偷挂到全局

写data = fetchData()而不是const data = fetchData()，这个data就会挂到window上永久驻留。修法只有一个字：补上let或const。

元凶二：定时器不清理

setInterval/setTimeout的回调会攥住它引用的整棵对象树。不清理，对象永远不会被回收。在 React 里，清理动作必须写在useEffect的返回函数里：

useEffect(() => { const timer = setInterval(() => { // 轮询任务 }, 5000); return () => clearInterval(timer); // 关键：卸载时清除 }, []);

Twenty 的 AI 对话模块里就有大量订阅式逻辑，例如 useAgentChatSubscription 在useEffect中建立订阅。你在这个 AI 前端模块里加自定义功能时，务必照抄"建立时保存句柄、卸载时清理"这个模式。

元凶三：事件监听器没成对出现

addEventListener和removeEventListener必须成对。组件卸载前没移除监听，DOM 节点和回调就一直活着。排查前端业务模块时，重点看全局事件（window、document上的监听）——它们不会随节点销毁自动消失。服务端同理：AI 服务端模块或工作流执行器里若注册了监听却不移除，内存会随任务量持续累积。