javascript - 使用 Javascript 呈现 HTML 的策略

Question

我通过 AJAX 调用从服务器获取一个胖 JSON 数组，然后处理它并使用 Javascript 呈现 HTML。我想要的是让它尽可能快。

在我的测试中，Chrome 领先于 FF，但浏览器仍需要 5-8 秒来呈现约 300 条记录。

我考虑过延迟加载，例如在 Google Reader 中实现的延迟加载，但这与我的其他用例背道而驰，例如能够获得即时搜索结果(在客户端对我们在JSON 数组)和多个过滤器。

我注意到的一件事是，FF 和 Chrome 在遍历 JSON 数组中的所有项目之前不会呈现任何内容，即使我在每次循环后明确地将新创建的元素插入到 DOM 中(只要我有HTML)。我想要实现的只是:强制浏览器尽快呈现。

我尝试延迟调用(数组中的每一项都将由延迟函数处理)但遇到了其他问题，因为似乎不再保证执行顺序(数组下方的一些项将是在它之前的其他项目之前处理)。

我正在寻找任何提示和技巧。

Answer 1

尝试:

• 将行插入一个数组，然后简单地

   el.innerHTML = array.join("");
  

• 使用 document fragments

  var frag = document.createDocumentFragment();
  for ( loop ) {
      frag.appendChild( el );
  }
  parent.appendChild( frag );