文档Dom树还是独立Dom树？

Question

Am使用chrome(newbie：)查找内存泄漏

如何识别内存泄漏的位置？

什么是文档DOM树和分离Dom树？

有人能解释我吗？

Answer 1

识别内存泄漏的步骤.

1. 从非认知模式Chrome开始。
2. 打开应用程序
3. 打开Chrome工具(我喜欢在自己的窗口中最大限度地打开它)
4. 点击配置文件

​

1. 使用“获取堆快照”选项并单击快照
2. 使用应用程序执行一些具体步骤
3. 单击左上角的黑色圆圈，再拍一张快照。
4. 重复步骤5至7，再重复2次
5. 检查保留的大小-如果它继续增加-您有一个内存问题。
6. 在Timeline选项卡下单击垃圾收集器按钮。
7. 再拍一张快照，看看内存是否降到了合理的水平。

识别独立DOM树的步骤

1. 要检测分离的DOM树，请单击其中一个快照上的Profile选项卡
2. 您将看到很多对象--尝试通过键入DOM来过滤它们，如下所示

​

1. 如果您看到任何独立的DOM树，那么您“可能”有一个问题。您所做的工作可能需要保留一些DOM用于克隆等，因此必须排除这种情况。如果你看到任何超过这一点你需要担心他们，特别是如果这是一个单一的网页应用程序，因为其他应用程序重新加载整个事情很快，这可能会清除内存。
2. 您可以检查分离的DOM树，如下所示。

​

1. 要检查DOM是什么，您可能希望悬停在Red元素上，如下所示。这有助于在找到DOM之后进行调试。

​

什么是“文档DOM树”?整个文档里面是一个大DOM树。文档是XML，标记是嵌套的，因此形成了一棵树。(DOM -文档对象模型。)

，那么什么是“独立DOM树”?

HTML元素是消耗内存的对象的实例。每个这样的元素都可以在上面存储事件侦听器和与其相关的数据。现在，“分离的DOM树”只不过是浏览器内存中的DOM，但没有连接到主DOM树，也就是"Document树“。

通过检查这些挂起的对象，我们可以检测问题并避免内存泄漏。

解决这个问题是一个很大的话题，因为你可能会看到一些不同的解决方案。下面是一些人为解决这一问题所做的工作。

Can't seem to cleanup detached DOM elements

Javascript Memory Leaks: Detached DOM tree