javascript - 如何加速 javascript 表格渲染？

Question

我正在使用 javascript 在页面加载时构建一个大表，目前我能够在大约 2 秒内加载表部分(当然是在我的机器上)。但是，我希望它会更快。有什么改进建议吗？

var fragment = document.createDocumentFragment();
var table=document.createElement('table')
table.className="table-bordered"
fragment.appendChild(table)
var body=document.createElement('tbody')
table.appendChild(body)
for (var i = 0; i < 200; i++) {
    var row = document.createElement('tr');
    body.appendChild(row);

    for (var j = 0; j < 100; j++) {
        var cell = document.createElement('td');

       if(j!==0)
       {cell.id="row"+i.toString()+"col"+(j-1).toString()
       cell.className="myclass"
        }
        row.appendChild(cell);
    }
 }

Answer 1

尝试将此行:fragment.appendChild(table) 移到代码的最后。

否则，您正在更新附加到 DOM 的表格，并且它可能会在您每次添加新元素时尝试重新呈现内容。