javascript setInvertal的使用增加了CPU的内存消耗

Using of javascript setInvertal increases memory consum of CPU

本文关键字：CPU 内存 增加 setInvertal javascript      更新时间：2023-09-26

我正在开发一个.NET web应用程序，在该应用程序中，我必须使用javascript函数setInterval（）进行ajax请求，以刷新某些页面的信息。

对于每个ajax请求，我都会收到大约68KB的xml响应，我可以通过jQuery对html进行可视化更改。我将间隔设置为2000毫秒，但我希望，或者更确切地说，我需要将其减少到1000毫秒。

不幸的是，随着每次请求，CPU的内存消耗都会增加，这会导致浏览器被阻止，除非用户重新加载页面，否则无法使用它。我已经在Firefox、Internet Explorer和Chrome中测试过了，但结果总是一样的。如果我不执行setInvertal（），问题就会消失。

此外，我一直在测试我所有javascript变量的范围，但我没有发现任何错误，我认为javascript有一个有效的垃圾收集器来清理它们。

我希望我已经把这个问题解释清楚了。有人有解决问题的想法吗？

修改：我使用的是jQuery框架。我的代码是：

var tim;
$(document).ready(function () {
  tim = window.setInterval("refresh()", 2000);
});
function refresh() {
   $.post("procedures.aspx", $("#formID").serializeArray(), function (data) {
     if (data != ""){
       var xml = $.parseXML(data);
       ... (read and process xml to do changes in the html)
     }
   }
}

您还没有发布任何代码片段供检查，所以我的答案是基于创建此类"轮询"函数时常见的错误。我还假设您是手动操作，而不使用jQuery或MooTools之类的框架。

您的问题很可能是由于在每次轮询调用中创建一个新的XMLHttpRequest对象而不是在setInterval之外创建一个这样的实例，并一次又一次地打开和使用这个实例。

基本上，你可能会这样写代码：

var pollInterval = setInterval(function() {
    var xhr = new XMLHttpRequest(); //ouch, this hurts!
    xhr.open('GET', 'url', true);
    xhr.send();
    //etc.
}, 2000);

如果是这种情况，只需将XMLHttpRequestObject创建移出轮询循环，以确保您一次又一次地使用相同的对象，从而防止某种内存泄漏（如果我可以这么称呼它的话）。

var xhr = new XMLHttpRequest(); //now we can re-use this!
var pollInterval = setInterval(function() {
    xhr.open('GET', 'url', true);
    xhr.send();
    //etc.
}, 2000);


同样，您还没有发布任何代码片段，也没有发布您可能正在使用的任何框架的详细信息。因此，我的建议是基于我在检查轮询ajax代码时经常遇到的一个错误。希望这能有所帮助。如果没有，请编辑问题并发布一些代码。

免责声明：为了简洁起见，我只使用了XMLHttpRequest对象，而不是讨厌（或喜欢）供应商。很明显，您将使用一个跨浏览器的请求对象实例化函数，或者更好的是使用一个抽象掉这些血腥细节的库。
nbsp；

更新

那么，您的代码需要每两秒钟更新一次dom吗？只要页面被加载？你从来没有停过吗？我以为我会在某个地方看到一个clearInterval，但无论如何。

这有点尴尬。我最接近这种情况的是，当我需要基于股票行情器API编码一条脉冲线，用于绘制实时（好吧，1秒的伪高度）图时。在我的案例中，好的部分是API非常快，具有超低的延迟，我接收到的数据只是一个浮动，我对它进行的dom操作的时空复杂度可以忽略不计。

我担心的是，如果服务器在两秒内没有响应，或者在接近两秒的时间内没有响应，那么你就会得到一段复杂的代码，它已经在这两秒的间隔中消耗了相当多的毫秒。dom可能不会每两秒钟更新一次！

  1. 卫生提示：去掉中的引号CCD_ 1。应该是window.setInterval(refresh, 2000)原因如下：javascript setInterval内存泄漏

  2. 因此，$.post肯定会每两秒钟创建一个新的XHR对象，根据代码。实际上，服务器的响应时间是多少喜欢setInterval循环了多少次？对于低计数，例如响应时间低于10秒，新XHR不应为"THE"问题

  3. 500行XML解析？每个间隔？听起来很痛苦。会吗您可以在服务器，并将此字符串返回到UI？它将节省客户端CPU周期当然

HTML，11000行。所以这需要大量的dom遍历和操作。这里有一个小清单：

  1. 你用的是最好的选择器吗？（xpath表达式的特殊性）。Shizzle已经帮你搞定了，但要尽你所能。像$（"p*"）这样的东西可能会造成大破坏

  2. 您是否已将文档回流最小化

  3. 循环：在数组上使用for或映射函数是最好的（最多高效）

  4. 属性访问：是否减少重复嵌套属性访问，并使用一次性参考资料以提高效率

  5. 追加/操作效率：例如：是否追加单个列表项？理想情况下，您应该附加整个列表一气呵成。删除等也是如此。基本上，大块的一次性操作而不是重复操作

如果不了解用例的低级意图和机制，就很难确定这一点。

最后，我解决了这个问题。总的来说，主要的修复方法是将响应服务器更改为JSON。我已将响应减少到4KB。

此外，我一直在更准确地操作html元素并将其附加到DOM中。

现在，网络应用程序可以运行数小时，一切都很好。

相关文章：