jQuery.remove（），分离DOM元素，但我仍然可以从代码中访问元素。如何避免泄漏？ [英] jQuery.remove(), detach DOM elements, but I still can access the elements from code. How to avoid leaks?

问题描述

我知道在具有大量UI元素的应用程序中正确管理内存并且完全基于Ajax并不容易（在我的应用程序中，页面永远不会重新加载）。但我想了解以下行为：

I'm aware that it's not easy to correctly manage memory inside an application with lot of UI elements and completely based on Ajax (in my app the pages are never reloaded). But I would like to understand the following behaviour:

我有一个根元素，一次只能连接一个子元素（认为它是根元素是app容器和childs单页）。
每当我在子内容之间切换时，我都会使用jQuery.remove（）删除以前的内容，但我发现内容实际上是从DOM中分离出来的，但它仍保留在内存中。

I have a root element to which a single child element at a time must be attached (think it as the root element being the app container and the childs the single pages). Whenever I switch between child contents, I remove the previous content with jQuery.remove(), but I see that the content is actually detached from the DOM but it remains in memory.

1. root和两个子内容（child1和child2）


2. 来自child1我切换到child2，在连接child2之前要求我的应用管理器删除child1


3. 正在附加child2（我可以看到它）但我仍然可以使用管理child1的代码中的child1元素

child1代码（包含对child1 DOM的引用）：

child1 code (which holds references to child1 DOM):

function testaccess(){
   load_and_remove(child2);
   var child1DOM = get_this_dom();
}

---

child1DOM仍然存在，我可以操纵它，好像它仍然附加到DOM。

---

child1DOM is still there, and I can manipulate it as if it was still attached to the DOM.

好的，我想jQuery.remove（）和GC将无法发布内存，直到我有代码可以访问它，但即使我没有调用get_this_dom（），即使退出testaccess（），我看到FF内存不会减少......

Ok, I suppose that jQuery.remove() and the GC won't be able to release memory until I have code that will access it, but even if I don't call get_this_dom(), even after exiting testaccess(), I see that FF memory doesn't decrease...

当我退出child1时，我想知道如何让GC释放所有内存。

I wonder how to make GC release all the memory, when I exit child1.

推荐答案

它不会从DOM中删除所有对它的引用都被释放。

It will not be removed from the DOM until all references to it are released.

你应该尝试删除JS DOM和渲染DOM之间的所有循环引用 - 它们都有单独的垃圾收集器并分开工作。因此，为什么标记和扫描JS垃圾收集器不会捕获它们。

You should attempt to remove all circular references between the JS DOM and render DOM - they both have separate garbage collectors and work separately. Hence why the mark and sweep JS garbage collector does not catch those.

您可以尝试重写代码以打破循环引用：

You could try to rework your code to break the circular reference:

var mything = something();
mything = null;

以下是一些可能有用的文章：

Here are a couple of articles that might help:

http://msdn.microsoft.com/en-us/library/ Bb250448

http://www.javascriptkit.com/javatutors/closuresleak/index.shtml

http://javascript.info/tutorial/memory-leaks

我很确定你能做到关于此，我们可以更快地找到一些。

I am pretty sure you could find some more quite quickly regarding this.

此外，您可以尝试 .empty（）来释放所有子节点，但它调用.remove（）做一些工作。

Also, you could try the .empty() to release all the child nodes but it calls .remove() to do a bit of work.

请注意，其中一些问题已在较新版本的jQuery中修复，即1.5优于1.4例如。

Note that some of these issues were fixed in newer versions of jQuery i.e. 1.5 is better than 1.4 for instance.

SO上的另一篇帖子：删除DOM消除内存泄漏

Another post on SO on this: jQuery memory leak with DOM removal

这篇关于jQuery.remove（），分离DOM元素，但我仍然可以从代码中访问元素。如何避免泄漏？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！