在深层的函数链中，随着call stack的增加，DOM的操作效率越来越低

[Gaubee]

关于javascript的效率。

一个处理函数，特点是有着多层次的forEach（增加了函数链）来调用动态绑定的处理函数集合，然而在处理函数的末尾，我放上一个setAttribute属性操作（其实中间还有一些DOM操作），但是就单单最后这个setAttribute，把这个处理函数的效率直线下拉。

10000次的循环，需要700~800ms，

但是将这个setAttribute注释掉后，只需要70~80ms，

但是我把这个setAttribute操作单独抽取出来进行10000次的循环，只需要20~30ms。

难道栈越深DOM操作的效率越低？

[Gaubee]

问题已经给 教主@Franky 理清楚了，关键就在题目中括号那句：其实中间还有一些DOM操作

这些DOM（不在body中，被抽离的）操作在没有setAttribute的情况下，70ms（相对时间，看CPU和浏览器）左右。

而当触发了setAttribute 

的更新，需要

D = document.createElement("div");

T = document.createTextNode("?");

D.appendChild(T);

setTimeout(function(){

var i = 10001;

console.time("DOM")

do{

// div.innerText = i;

T.data = i;

div.innerText = D.innerText;

}while(i--);

console.timeEnd("DOM")

},200);

renderTree的更新出现了很大的问题……

更新textNode后，再取innerText，性能非常低下

也就是说，强制innerText，是强请浏览器把渲染队列进行渲染，

上面的代码有点复杂，下面这两句才是核心：

div.innerText = i;

div.innerText = div.innerText;

可以自己测试一下效率，很可怕！！

[Mark Zhou]

赞

学习到了

2013/8/19 Gaubee <gaubee...@gmail.com>

--
您收到此邮件是因为您订阅了 Google 网上论坛的“鬼懿IT”论坛。
要退订此论坛并停止接收此论坛的电子邮件，请发送电子邮件到 f2er+uns...@googlegroups.com。
通过以下网址访问此论坛：http://groups.google.com/group/f2er。

要在网络上查看此讨论，请访问 https://groups.google.com/d/msgid/f2er/673cba56-8193-49d1-b93b-f4c4bf114285%40googlegroups.com。
要查看更多选项，请访问 https://groups.google.com/groups/opt_out。

[Jieqing Song]

问一下，　“强制innerText，是强请浏览器把渲染队列进行渲染”　这话是指强行浏览器将当前的渲染列表的所有都要渲染么