Question

我有一个页面，我们使用Kendo UI模板生成一堆HTML以插入DOM。我们说的是200多万字节。所有其他浏览器将在大约2到3秒左右的时间内显示它。我已经避免了jQuery并通过document.getByElementId调用设置了innerHTML。似乎最慢的部分是IE制作的regexp.test调用。 IE是否认为所有开始/结束标签都匹配？如果是这样，有没有办法告诉IE跳过此检查以加快速度（即“信任我”）？我已经将所需的HTML减少到尽可能小，所以这不再是一个选项。此外，我显示的数据甚至还不是最大的数据集，所以我知道它会变得更大。有没有人有任何想法？

更新

这是我正在使用的当前代码：

 var resultHtml = kendo.template(templateHtml, { useWithBlock: false })(currentPage.ViewModel);
 resultHtml = resultHtml.replace(new RegExp("\>[\n\t ]+\<", "g"), "><"); // Get rid of whitespace
 document.getElementById("tblData").innerHTML = resultHtml;

在IE中，这最终花费大约10秒来显示生成250万个字符。在Chrome / FireFox / Opera中，大约需要2到3秒。

Answer 1

实施类似“双缓冲”的内容。

创建一个不属于DOM的节点。

var offlineNode = $('<div />');

将内容渲染到离线节点。

offline.html(kendoTemplate(billionData));

完成后，将整个节点移动到DOM。

offlineNode.appendTo($('#a-place-in-dom'));

IE在猜测何时重新渲染页面时遇到问题，因此DOM操作是明智的。每次进行大量DOM更改时，IE都会很慢。

Answer 2

问题似乎不是现在添加到DOM的HTML。它与我必须与Kendo MVVM双向绑定的所有对象有关。对不起！

通过Javascript向DOM添加大量HTML时，IE太慢了

2 个答案: