iframe内存泄漏需三步清理：先设src='javascript:false'重置环境，再置空contentwindow引用，最后remove()；跨域需解绑window.message监听器；旧sdk要手动清定时器、监听器和observer。
iframe 未正确卸载是前端内存泄漏的高发场景，尤其在地图、图表、富文本编辑器等嵌入式模块中。核心问题不是 iframe 元素本身没删，而是它的内部文档、JS 执行环境、定时器、事件监听器和 Observer 等资源仍驻留在内存中，GC 无法回收。
必须按顺序执行三步清理
仅调用 iframe.remove() 或设 iframe.src = '' 是无效的——DOM 节点虽消失，子页面 JS 上下文仍在运行。可靠做法是：
- 先设置
iframe.src = 'javascript:false'：这是触发多数 SDK（如百度地图 v1.x、ECharts v2.2.7、AMap）内部destroy()流程的最小代价方式，能安全重置文档和 JS 环境； - 再显式置空
contentWindow引用：例如this.iframeWin = null或iframe.contentWindow = null，否则即使 iframe 已移除，只要父页面还持有该引用，整个子文档就会变成 Detached HTMLDocument，永远不被 GC 回收； - 最后调用
iframe.remove()：确保 DOM 节点真正脱离文档树。
跨域 iframe 的监听器要单独解绑
如果使用 postMessage 与跨域 iframe 通信，监听器通常绑定在 window 上，而非 contentWindow。这类监听器不会随 iframe 移除自动清除：
- 确认是否用了
window.addEventListener('message', handler)； - 在清理 iframe 前，必须同步调用
window.removeEventListener('message', handler)； - 若 handler 是匿名函数，需提前保存引用或改用具名函数/箭头函数并缓存。
老 SDK 需手动清理“三件套”
部分旧版第三方库（如 Highcharts v3、BMap v1.x）不提供 dispose() 或 destroy() 接口，仅靠 src = 'javascript:false' 不足以释放全部资源。应在文档重置后主动干预：
- 在
setTimeout(() => { }, 0)或requestAnimationFrame回调中操作（确保子文档已关闭）； - 清除所有定时器：
iframe.contentWindow.clearInterval(id)、clearTimeout(id)（需提前缓存 ID）； - 解绑监听器：
iframe.contentWindow.removeEventListener('resize', fn)、iframe.contentWindow.document.removeEventListener('scroll', fn)； - 断开观察者：
iframe.contentWindow.IntersectionObserver?.disconnect()、MutationObserver?.disconnect()。
验证是否清理干净
打开 Chrome DevTools → Memory 面板 → 拍摄堆快照 → 切换到 Comparison 视图 → 筛选 Detached HTMLDocument：
- 若仍有残留，点开看 Retainers 路径；
- 若指向
Closure → function → iframeWin，说明contentWindow引用未清空； - 若指向
Window → messageListeners，说明跨域message监听器漏解绑。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
