我发现如果使用得当,使用 jQuery 创建 HTML 客户端可以极大地提高性能。我使用 AJAX 返回 JSON 来检索动态内容,然后构建相关的 HTML 并使用 jQuery 插入它。当我第一次使用这种技术时,我发现 IE 的 JavaScript 中的字符串连接器执行得非常慢,因此构建一个超过 50 行左右的动态表执行得非常糟糕。
var shtml = '<table>';
for (var i = 0; i < 100; i++) {
shtml += '<tr><td>A bunch of content</td></tr>';
}
shtml += '</table>';
$('#myTable').append(shtml);
然后我发现了一种字符串连接技术,它改变了一切。不使用 sting+=
运算符,而是使用数组进行连接;
var shtml = ['<table>'];
for (var i = 0; i < 100; i++) {
shtml.push('<tr><td>A bunch of content</td></tr>');
}
shtml.push('</table>');
$('#myTable').append(shtml.join(''));
我发现性能显着提高。然而,现在,在我开始看到浏览器本身很难同时动态插入如此多的内容之前,有大约 100 行的上限。有没有人有任何指针或技术可用于帮助我实现大型动态 HTML 集的下一个性能提升?