相关疑难解决方法(0)

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

我有一个根元素,一次只能附加一个子元素(将其视为根元素是app容器,子元素是单个页面).每当我在子内容之间切换时,我都会使用jQuery.remove()删除以前的内容,但我发现内容实际上是从DOM中分离出来的,但它仍保留在内存中.

1. root和两个子内容(child1和child2)
2. 从child1我切换到child2,要求我的应用程序管理员在附加child2之前删除child1
3. child2正在附加(我可以看到它)但我仍然可以使用管理child1的代码中的child1元素

child1代码(包含对child1 DOM的引用):

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

child1DOM仍然存在,我可以操作它,好像它仍然附加到DOM.

好吧,我想jQuery.remove()和GC将无法释放内存,直到我有代码可以访问它,但即使我没有调用get_this_dom(),即使退出testaccess(),我看到FF内存不会减少......

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

问题

添加节点,同时从DOM中删除旧节点,不会丢弃内存中的旧节点.(至少不是所有人,没有明显的理由).

如何看待这种情况

(你已经知道了,但无论如何..)
右键单击输出区域并使用Chrome 开发人员工具进行检查.单击时间轴选项卡,然后单击左上角的圆圈(点)开始录制.

现在点击body元素,它将每隔300ms 开始添加和删除项目
(删除的节点应该被垃圾收集).

停止录制,将数据采样区域扩展到最大,您将在屏幕的下半部分看到绿色的节点.预期的图形将上下移动(其中下降意味着GC已正确丢弃节点).

测试页面

这2个测试页面非常原始.当然,在现实生活中,开发人员使用生成大量文本的模板,这些模板应转换为DOM并注入页面,因此内存中的实时DOM节点数应保持较低,并且必须丢弃已删除的节点.

与jQuery - http://jsbin.com/lamigucuqogi/2/edit - 大约40秒后,GC变得疯狂并停止收集被删除的节点,这会导致通货膨胀.

朴素的方式 - http://jsbin.com/riref/2/edit - 似乎节点没有以令人满意的速度被移除,并且数量不断增长和增长...

题

为什么会发生这种情况,如何正确地删除NODES以便不会发生通货膨胀？

我有一个GreaseMonkey脚本,适用于使用框架作为其界面不可分割的一部分的网站.这个脚本像筛子一样泄漏内存,我相信这是因为我在其中一个框架中使用了addEventListener.很简单,我附加了各种事件监听器,然后框架重新加载并附加事件监听器,然后当您与此框架中的各种元素或其他元素交互时,框架会重新加载数周或数千次迭代.到最后,Firefox已经从大约300M的内存增加到2G(或者在它到达之前崩溃).

我在某地读到,执行整页重新加载将允许FireFox的垃圾收集例程启动并从孤立的事件处理程序中恢复所有内存,当我在脚本运行一段时间后,在内存大约10秒内按F5时就足够了回到300M.不幸的是,这打破了网站中的一个不同的框架(一个非常流行的聊天窗口),所以虽然它确实似乎证实我怀疑addEventListener是责备,但它并不是一个真正的解决方案.

我还能做些什么来在不强制刷新整页的情况下正确释放内存吗？

(目前使用GM 1.5和FF 17,但问题是自GM 0.8/FF 4以后就存在这个问题.)