脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-console.time 简单分析javascript动态添加Dom节点的性能,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。
本来想每天都更新下博客的,但是最近要考试,还有就是自己还是停留在暗自窃喜中吧(这种想法要改变)。其实最近总在想,自己要怎么去管理自己的数据,每天的生活都是对自己的数据的增删查改。昨天把自己的电脑重装了,确实很多软件的存放要改地方了,之前不知道怎么去管理软件安装,所以放得乱七八糟的。说好一大堆废话之后,我最后再说一遍,管好自己的时间、数据真的比你学习东西重要。
本文代码约定
123
";
for{ arr.push("
123
"); }
el.innerHTML = arr.join("");console.timeEnd("time2");3 .使用DOM API console.time("time3");var str = "";for{ var p = document.createElement("p"); p.textContent = "123"; el.apPEndChild(p); }console.timeEnd("time3");在这里有必要知道console.time命令的作用,请看链接console.time(label)。我简单介绍下吧,就是在console.time函数中传入一个参数,这个参数就是一个标记,当chrome运行到这里就开始计时,那什么时候结束计时呢,这个就有关另外一个函数console.timeEnd,参数就是刚才那个标记。这样子我们就知道中间那段javascript代码究竟跑了多久了,记住它是以毫秒为单位的。
那好我们现在猜测下究竟哪段代码跑的时间最短呢?
好了,不卖关子了,时间长短逐渐上升分别是:time2
为什么会出现上面的情况呢?
首先我们要知道我们用的chrome是webkit内核,他们对操作DOM节点已经优化得很好了,所以DOM API与innerHTML两着在性能上是没多大区别的(引用于《高性能javascript》)第二就是既然DOM API与innerHTML性能上没多大区别的话,为什么time3觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!
以上是脚本宝典为你收集整理的javascript代码实例教程-console.time 简单分析javascript动态添加Dom节点的性能全部内容,希望文章能够帮你解决javascript代码实例教程-console.time 简单分析javascript动态添加Dom节点的性能所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。