javascript - jquery大数据插入DOM

Question

在 js 中，我通过 ajax 调用服务器，服务器返回我应该插入到 dom 中的已处理数据。

$.fn.loadChildren = function() {
  var $li = $(this);

  ajaxQueue.add({
    url:     "myUrl.to",
    data:    "mydata",
    success: function(data) {

      $li.find("ul").html(data);
      ....

问题是数据可能是相当大的字符串，在这种情况下，在 FF 中我收到错误消息“此页面上的脚本可能正忙，或者可能已停止响应...”

我尝试使用replaceWith而不是html，但仍然遇到同样的问题。

我知道每个浏览器中的 DOM 插入都有限制，但我想知道 jQuery 优化中是否还有其他我可以尝试的东西。

谢谢

Answer 1

是否可以缩小选择器的范围？

$("#myul").html(data);

尝试对数据进行分块。像这样的事情应该有助于提高性能。

var chunks = [];
var counter = 0;

chunks = breakApartDataIntoChunks(data);

setTimeout(function() { processChunk(chunks, counter); }, 0);

function processChunk(chunks, counter) {
    if (counter < chunks.length) {
        // insert this chunk into dom here
        $li.find("ul").append(chunks[counter]);
        counter++;
        setTimeout(function() { processChunk(chunks, counter); }, 1);
    }
}