手机版

JavaScript中console.profile()函数的详细介绍

时间:2021-10-15 来源:互联网 编辑:宝哥软件园 浏览:

编写JavaScript程序时,如果需要知道某段代码的执行时间,可以使用console.time()。但是在分析逻辑复杂的JavaScript程序,试图找出性能瓶颈时,console.time()并不适用。对逻辑复杂的JavaScript程序的操作进行透彻的分析,就意味着要插入大量的console.time()语句,这无疑是不可接受的。对于具有复杂逻辑的JavaScript程序调优,正确的方法是使用console.profile()。

浏览器支持

火狐、谷歌Chrome和安装了Firebug插件的Safari都支持该控制台。Profile()语句,最新版本的IE和Opera也提供了profile功能。在几种浏览器中,console.profile()的使用是相似的。本文只介绍了console.profile()在Firebug中的使用。值得注意的是,如果使用Firebug控制台直接编写JavaScript实验代码,console.profile()无效。

使用console.profile()。

console.profile()的使用非常简单:在需要启动概要文件的地方插入console.profile(),在需要结束概要文件的地方插入console.profileEnd()。以下面的代码为例:

复制的代码如下:函数do task(){ dosubtaska(1000);doSubTaskA(100000);doSubTaskB(10000);doSubTaskC(1000,10000);}函数DoSubTaskA(count){ for(var I=0;icountI){ } }函数DoSubTaskB(count){ for(var I=0;icountI){ } }函数DoSubTask(COuntx,COuntry){ for(var I=0;icountXI){ for(var j=0;jccounty;j ){} }}

console . profile();doTask();console . profile end();

在运行doTask()函数之前执行console.profile(),在运行doTask()函数之后执行console.profileEnd(),以便在doTask()函数运行过程中收集详细信息。您可以在Firebug的控制台中看到:

从结果可以看出,概要文件时间总共为101.901毫秒,涉及5个函数调用。结果的默认标题是“Profile”,可以通过将参数传递给console.profile()函数进行自定义。例如,使用console.profile(“测试配置文件”)可以在结果中将此配置文件的标题更改为“测试配置文件”,这在同时执行多个配置文件进程时特别有用。特定配置文件结果中每一列的含义是:

1.功能.函数名。2.电话.通话次数。例如,在上面的示例中,doSubTaskA()函数被执行了两次。3.百分比.此函数调用花费的时间占总时间的百分比。4.自己的时间.不包括调用其他函数所花费的时间,即函数本身所消耗的时间。比如上面的例子中,doTask()已经执行了很长时间,但是因为它的时间都花在了调用其他函数上,所以它自己的时间并不多,只有0.097 ms. 5。时间.与自己的时间相反,计算一个函数的总时间消耗时不考虑其他函数的调用因素。在上面的例子中,doTask()函数执行了101.901 ms,至于Time和Own Time,我们也可以得到一个结论:如果Time的值大于Own Time,那么这个函数涉及到调用其他函数。6.平均值.计算函数的平均总时间,其计算公式为Avg=Time/Calls。在上例中,doSubTaskA()函数执行了两次,其总时间为1.054ms,因此其平均总时间为0.527 ms. 7。分钟.花费在此函数调用上的最短时间。比如上面的例子中,doSubTaskA()函数执行了两次,它的最小耗时,也就是耗时较少的调用,用了0.016ms. 8。马克斯.花费在此函数调用上的最长时间。例如,在上面的例子中,doSubTaskA()函数被执行了两次,它的最大耗时,即耗时的调用花费了1.038 ms. 9。文件.函数所在的JS文件。

在Firebug中使用“配置文件”按钮。

除了插入控制台。Profile()语句转换成JavaScript代码,Firebug还提供了一个profile按钮,可以实时动态地对页面上的JavaScript代码进行概要分析。按钮位置为:

当你需要配置文件时,你可以按这个按钮。如果任何JavaScript代码被下一个页面操作触发,Firebug会记录下来。在配置文件过程结束时,只需再次按下按钮。最终结果与通过插入console.profile()语句获得的结果相同。

版权声明:JavaScript中console.profile()函数的详细介绍是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。