javascript - 如何加快html元素的更新？

Question

我目前使用以下代码 -

jQuery(window).on('load', function() {
  // read list of items from the table
  ...
  // getting data the DB
  var connectionstring="Data Source=datasource;Initial Catalog=catalog;User 
  ID=userid;Password=pass;Provider=SQLOLEDB";

  connection.Open(connectionstring);
  var rs = new ActiveXObject("ADODB.Recordset");

  rs.Open("select top 10 from db where id in myitems_list")

... 
// display the result
for (currentRow = 1; currentRow < myitems_list.length + 1; currentRow++) { 
    rs.MoveFirst;
    while(!rs.eof)
        if (jQuery(jQuery(".mytable")[1].rows[currentRow].cells[0]).text().trim()==rs.fields(0)) {
jQuery(jQuery(".mytable")[1].rows[currentRow].cells[1]).html(rs.fields(1));
        ...
    }
});

这里我做了以下事情:

1. 从表的第一列读取项目列表(有 id)
2. 对于在表中找到的每个项目，从数据库中获取数据
3. 用从数据库接收到的数据更新表格(项目的初始顺序应该不变)

更新表格需要几分钟时间。 我可以做些什么来加快表更新过程？ 或者，也许，我应该将它移动到单独的线程？

Answer 1

我不确定这个模式叫什么，但你有两个排序数据集，你想有效地从另一个更新一个。您可以使用循环遍历每个列表一次的算法。

以相同的方式对两个列表进行排序，并为每个列表创建一个计数器变量。 将 a1 的第 第 元素与 a2 的第 jth 元素进行比较。如果相等，则从 a2 更新 a1 并递增 i 和 j。如果小于，递增 i。否则递增 j。

var a1 = [sorted array];
var a2 = [similarly sorted array];

var i=0, j=0;

while (i < a1.length && j < a2.length) {
  if (a1[i] == a2[j]) {
    // update a1[i]
    i++;
    j++;
  } else if (a1[i] < a2[j]) {
    i++;
  } else {
    j++;
  }
}