為什么在此javascript執行中IE8比IE9快？

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();
}

如果這樣做沒有幫助，則可能是IE9在解析HTML時遇到性能問題。

這個其他堆棧溢出問題可能也值得一讀：

使用documentFragment的IE性能不佳

如果treeContainer可見並附加到文檔中，則可能會有所不同。 嘗試將其顯示樣式設置為“ none”，然后設置innerHTML，然后將顯示設置回空字符串以查看是否有區別。