【问题标题】:jQuery - Internet Explorer memory leaksjQuery - Internet Explorer 内存泄漏
【发布时间】:2011-07-14 09:27:06
【问题描述】:

我正在开发一个内部 Web 应用程序,供我工作的帮助台使用,该应用程序设计为在房间周围的大型电视上始终全屏运行,为接听电话的人显示相关数据。我们在 Windows 7 上使用 Internet Explorer 8(公司安全政策不允许任何其他浏览器)和 jQuery 1.6.2。所有脚本和数据都存储在 LAN 上 - 没有任何东西来自互联网。

本质上,应用程序会查询几个 XML 文件(由服务器脚本生成)以显示当前信息,例如:

  • 每个呼叫队列的统计信息,例如等待呼叫的数量(每 5 秒重新加载一次)
  • 当前公告(使用jQuery cycle 以幻灯片格式显示,在到达当前公告列表的末尾时重新加载)

在我对 Firefox 和 Chrome 等的测试中,一切都很顺利。但是在 Internet Explorer 中,如果页面一次打开超过 10 分钟左右,整个浏览器就会开始冻结并崩溃。

我对 javascript/jQuery 内存泄漏进行了相当多的研究,虽然我发现了一些有趣的文章,但其中大多数都与在 jQuery 中创建或删除元素时发生的泄漏有关 - 我没做。

我的工作方式是:

  1. 从脚本加载 XML
  2. 遍历一组元素(例如,呼叫队列)中的每一个,然后将相关的子元素分配给变量。
  3. 使用这些变量来组合一个简单的 HTML 字符串(使用数组,我读到这种方式构建字符串比使用连接构建字符串更节省内存,例如 string = string + 'blarg';
  4. HTML 直接输出到等待容器 <div>,替换之前的内容。

整个东西看起来像

$.get('dashboard-queues.asp', function(data) {
    var allQueues = new Array();
    $(data).find('queue').each(function() {
        var thisQueue = new Array(); // array used to build HTML string for this queue

        var callsWaiting = parseFloat($(this).find('waiting').text());
        var activeCalls = parseFloat($(this).find('active').text());

        // (etc...)

        thisQueue.push("<div class='q-item'>"+callsWaiting+"</div>");
        thisQueue.push("<div class='q-item'>"+activeCalls+"</div>");

        // (etc...)

        allQueues.push(thisQueue.join(''));
    });

    $("#callboard").html(allQueues.join(''));
});

其中有一些额外的处理会在某些情况下更改为该数据块输出的 html 代码(例如,如果有太多的呼叫等待)。此外,我在输出 HTML 后进行了一些处理——计算总共有多少呼叫正在等待,当天的呼叫放弃率等——但这都是简单的计算。

每次循环时我都会非常小心地重置变量和数组,以确保它们没有保留数据。似乎没有多大帮助。

如果需要,我可以发布更多实际代码(不想让这篇文章太庞大而无法开始)。任何人都可以看到我可能会遇到任何问题吗?如果有人可以提出更有效或更好的方法来做我想做的事情,那也是非常受欢迎的。

干杯:)

【问题讨论】:

  • 如果将$("#callboard").html(allQueues.join('')); 替换为document.getElementById('callboard').innerHTML = allQueues.join(''); 会发生什么? jQuery.html 函数对传递给它的 HTML 进行了大量检查,不一定使用 innerHTML
  • 有趣的想法,谢谢!我试试看。
  • 嗨 roryf - 这似乎有帮助。我已经在后台选项卡中运行了几个小时的呼叫板,它仍然运行顺利!谢谢!
  • 我认为问题在 jQuery 2.0.0 中仍然存在,我离开了我的 IE(Win8 模式)一夜之间回到了一个 12GB RAM 被吃掉的挂起会话。正如@roryf 所说,我更改为innerHTML。希望现在效果更好。 :)

标签: jquery internet-explorer memory internet-explorer-8 memory-leaks


【解决方案1】:

如果您可以访问 IE9,您可以尝试按 F12,然后选择分析器选项卡。我意识到您的要求是针对 IE8 而不是 9,但这至少可以帮助您了解问题可能在于性能不佳的大型匿名块的位置。

查看您的代码,我不确定主 $.get 是否会充当闭包。我相当确定 JQuery 可以正确处理闭包并正确收集垃圾,但在这种情况下,IE8 可能无法按预期工作..?

为间接未回答道歉......祝你好运!

这个 comment 看起来可能有些相关,因为您正在处理 DOM 操作和事件处理。

【讨论】:

  • 嗨,感谢您的评论!是的 IE9 会很棒,但恐怕没有机会。 IE8 实际上也有分析器,我已经看过了,但它并没有告诉我太多 - 它识别的函数不是我写的任何东西,当我双击它们时,我收到一条错误消息,指出无法从该位置获得源代码 - 这让我认为这些函数是 IE Javascript 引擎内部的东西。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-01-26
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多