javascript - 如何防止Chrome和Firefox长时间消耗大量内存？

Question

我有一个用 JS 编写的长轮询应用程序，用于获取 XML 文件来更新网页。它每 5 秒获取一次，数据量约为 8KB。我已连续打开此网页约 1 周(尽管计算机在晚上会进入休眠状态)。

首次打开 Chrome 时，我的电脑内存大约为 33K。我将其打开一周后，在 PC 处于唤醒状态时不断更新，仅一个选项卡就消耗了 384K 的内存。这是我的应用程序运行的常用方法(使网页保持打开很长一段时间)。

我觉得我阻碍了 Chrome 的 GC 或者没有进行一些特定的内存管理(甚至可能是内存泄漏)。我真的不知道 JS 中如何实现内存泄漏。

我的应用程序范例非常典型，遵循这个无尽的序列:

function getXml(file){
  return $.get(file);
}

function parseXml(Xml){
   return {
      someTag : $(Xml).find('someTag').attr('val'),
      someOtherTag: $(Xml).find('someOtherTag').attr('val')
   }
}

function polling(modules){
    var defer = $.Deferred();

    function module1(){
        var xmlData = getXml('myFile.xml').done(function(xmlData){
           var data = parseXml(xmlData);
           modules.module1.update(data);
        }).fail(function(){
             alert('error getting XML');
        }).always(function(){
            module2();
        });
    });

    function module2(){
        var xmlData = getXml('myFile.xml').done(function(xmlData){
           var data = parseXml(xmlData);
           modules.module2.update(data);
        }).fail(function(){
             alert('error getting XML');
        }).always(function(){
            defer.resolve(modules);
        });
    });

    return defer.promise(modules);
}

$(document).on('ready', function(){

var myModules = {
 module1 : new Module(),
 module2 : new ModuleOtherModule()
}

// Begin polling
var update = null;
polling(myModules).done(function(modules){
   update = setInterval(polling.bind(this, modules), 5000);
});

这就是它的要点...我应该为这样构建的应用程序进行一些手动内存管理吗？我需要更好地管理我的变量或内存吗？或者这只是 Web 浏览器 (crome/ff) 打开 1-2 周的典型症状？

谢谢

Answer 1

您的代码看起来不错，但您没有发布“模块”内的方法“udpate”上发生的情况。我为什么这么说？因为可能是那个方法泄露了你的应用程序。我向您推荐两件事:

• 深入研究 update 方法，看看如何更新 DOM(如果有很多节点，请小心)。检查您正在更新的内容是否可能具有关联的事件，因为如果您将事件监听器分配给节点，然后删除 dom 节点，您的监听器仍保留在内存中(直到 javascript 垃圾收集器将其丢弃)
• 阅读这篇文章。这是查找内存泄漏的最佳方法:https://developer.chrome.com/devtools/docs/javascript-memory-profiling