0

有一个包含 2000 多行的表，我需要在每行上定期更新一个 div。我希望每 10 秒更新一次，但页面变得非常缓慢。

服务器有 32gb 内存，我的笔记本电脑有 8gb 内存，两者都至少有两个四核。

这是 div & update 调用：

<div id='div_$id' name='div_$id'></div>

<script language='javascript'>
    new Ajax.PeriodicalUpdater('div_$id', 'upd.php',{ 
       method: 'post', 
       frequency: 10, 
       decay: 1, 
       parameters: {id:'$id'}}
    );
</script>

我正在使用最新版本的 Prototype (1.7.0.0)。有没有更快、更好的方法来做到这一点，还是我会被迫将频率回滚到一分钟或更长时间？

4

1 回答 1

1

有两种可能的解决方案：

  1. 不要使用批量更新。检索更新的 HTML 内容，并比较两个 DOM 子树：当前的和更新的。只有在发现差异时才进行尽可能小的更改 - 文本节点更改，元素插入/删除。查看代码http://javascripts.svn.sourceforge.net/viewvc/javascripts/javascripts/js.prototype-extensions/js/extensions/element.js?view=markup - 文件末尾的函数 updateSmoothly。每个元素都会有新的方法Element#updateSmoothly(content)，然后您可以将附加insertion选项传递给更新程序：

    new Ajax.PeriodicalUpdater('div_$id', 'upd.php', { 
  method: 'post', 
  frequency: 10, 
  decay: 1, 
  parameters: {id:'$id'},
  insertion: function(receiver, responseText) {
    receiver.updateSmoothly(responseText);
  }
});

    此代码在 IE8 更新表中工作约 1300 行，并且 UI 或多或少响应（CPU Core 2 Duo，RAM 3Gb，OS Vista Home）。

  2. 使用类似于无限滚动技术的东西可以进行重大优化。UI 用户无论如何都无法在屏幕上同时看到所有 2000 多行 - 表格的最大部分不在屏幕上。为什么你需要下载和更新一些甚至不可见的东西？为什么你需要在 DOM 中有一些不可见的东西？只需跟踪表的哪个部分当前可见，并请求服务器更新这部分。当它们离开屏幕时删除行并在它们应该可见时加载新行。

于 2012-11-06T09:47:23.787 回答