Question

就像在标题中我有很不寻常的问题。我正在开发一个Web应用程序，它的视图在IE8中呈现得非常快，而在IE9中则慢得多。

Profiler说最耗时的功能是：

function handleTree(request, rootTagName) {
  var text = request.responseText;
  var startIndex = text.indexOf("<" + rootTagName + ">");
  var endIndex = text.indexOf("</" + rootTagName + ">");
  var newHtml = text.substring(startIndex + rootTagName.length + 2, endIndex);
  var treeContainer = getCachedElement("tree");
  treeContainer.innerHTML = newHtml;
  AjaxRequestEnd();

}

我在调试器中检查过，只在行

中

treeContainer.innerHTML = newHtml;

执行停止一段时间。 treeContainer 是一个空的 div 元素。插入的html非常大，所以我认为这是因为构造了dom树。

但是，在IE甚至调用此功能之前，它还会暂停几秒钟。正如我所提到的，在IE8上一切都运行得更快。有什么想法吗？

编辑：我知道我没有提供太详细的描述，但我没有任何想法在这种情况下还有什么重要的。

Answer 1

在分配innerHTML属性之前，可能是您正在进行的字符串操作。正则表达式可能会加快速度：

function handleTree(request, rootTagName) {
  var treeContainer = getCachedElement("tree");

  treeContainer.style.display = "none";
  treeContainer.innerHTML = request.responseText
    .replace(new RegExp("<" + rootTagName + ">(.+?)</" + rootTagName + ">"), "$1");
  treeContainer.style.display = "";

  AjaxRequestEnd();
}

如果这没有帮助，那么在解析HTML时，您可能会在IE9中遇到性能问题。

这个其他Stack Overflow问题也值得一读：

Bad performance IE using documentFragment

treeContainer如果可见并附在文档上，则可能会有不同的处理方式。尝试将其显示样式设置为“none”，然后设置innerHTML，然后将显示设置回空字符串以查看是否有所不同。

为什么IE8在这个javascript执行上比IE9更快？

1 个答案: