使用console进行 性能测试 和 计算代码运行时间
原文:http://www.tuicool.com/articles/JrARVjv
对于前端开发人员,在开发过程中经常需要监控某些表达式或变量的值,如果使用用 debugger 会显得过于笨重,最常用的方法是会将值输出到控制台上方便调试。
最常用的语句就是console.log(expression)了。
从早前一道阿里实习生招聘笔试题目入手:
function f1() {
console.time('time span');
}
function f2() {
console.timeEnd('time span');
}
setTimeout(f1, 100);
setTimeout(f2, 200); function waitForMs(n) {
var now = Date.now();
while (Date.now() - now < n) {
}
}
waitForMs(500);//time span: 0ms
我们先说说关于console的高级操作,最后在一起分析这道题目。
trace
console.trace()用来追踪函数的调用过程。
在大型项目尤其是框架开发中,函数的调用轨迹可以十分复杂,console.trace()方法可以将函数的被调用过程清楚地输出到控制台上。
function tracer(a) {
console.trace();
return a;
} function foo(a) {
return bar(a);
} function bar(a) {
return tracer(a);
} var a = foo('tracer');
table
使用console将对象以表格呈现
可将传入的对象,或数组以表格形式输出,相比传统树形输出,这种输出方案更适合内部元素排列整齐的对象或数组,不然可能会出现很多的 undefined。
var people = {
flora: {
name: 'floraLam',
age: '12'
},
john: {
name: 'johnMa',
age: '45'
},
ray:{
name:'rayGuo',
age:'22'
}
}; console.table(people);
火狐的控制台:
time timeEnd
计算程序的执行时间
可以将成对的console.time()和console.timeEnd()之间代码的运行时间输出到控制台上
console.time('计时器');
for (var i = 0; i < 1000; i++) {
for (var j = 0; j < 1000; j++) {}
}
console.timeEnd('计时器');
以上代码计算console.time('计时器');和console.timeEnd('计时器');之间的代码块所需要的事件。
profile
使用console测试程序性能
开发中,我们常常要评估段代码或是某个函数的性能。在函数中手动打印时间固然可以,但显得不够灵活而且有误差。借助控制台以及console.profile()方法我们可以很方便地监控运行性能。
function parent() {
for (var i = 0; i < 10000; i++) {
childA()
}
} function childA(j) {
for (var i = 0; i < j; i++) {}
} console.profile('性能分析');
parent();
console.profileEnd();
上述代码计算 console.profile('性能分析' );和 console.profileEnd();之间,代码块中涉及的函数的运行效率。
现在说回笔试题目
题目考察应聘者对 console.time的了解和js单线程的理解。
c onsole.time()语句和console.timeEnd()语句是用来对程序的执行进行计时的。
setTimeout()接受两个参数,第一个是回调函数,第二个是推迟执行的毫秒数。setTimeout()只是将事件插入了"任务队列",必须等到当前代码(执行栈)执行完,主线程才会去执行它指定的回调函数。
因为f1和f2被都setTimeout事先设置的定时器装到一个事件队列里面。本来 f1应该在100ms后就要执行了,但是因为waitForMs占用了线程,而执行JavaScript是单线程的,所以就没办法在100ms后执行那个 f1,所以需要等500ms等waitForMs执行完,然后在执行f1和f2,这时候f1和f2就几乎同时执行了。
使用console进行 性能测试 和 计算代码运行时间的更多相关文章
- 使用console进行 性能测试 和 计算代码运行时间(转载)
本文转载自: 使用console进行 性能测试 和 计算代码运行时间
- 使用console进行性能测试和计算代码运行时间
对于前端开发人员,在开发过程中经常需要监控某些表达式或变量的值,如果使用用debugger会显得过于笨重,最常用的方法是会将值输出到控制台上方便调试.最常用的语句就是console.log(expre ...
- Objective-C 计算代码运行时间
今天看到一篇关于iOS应用性能优化的文章,其中提到计算代码的运行时间,觉得非常有用,值得收藏.不过在模拟器和真机上是有差异的,以此方法观察程序运行状态,提高效率. 第一种:(最简单的NSDate) N ...
- php计算代码运行时间与内存使用的一段代码
计算运行时间及内存使用,代码如下: <?php //开始计时 $HeaderTime = microtime(true);//参数true表示返回浮点数值 //代码 //... printf(& ...
- 使用Objective-C 计算代码运行时间
第一种:(最简单的NSDate) NSDate* tmpStartData = [NSDate date]; //You code here... double deltaTime = [[NSDat ...
- C# 计算代码运行时间
Stopwatch watch = new Stopwatch(); watch.Start(); int num = myhelper.MySQLExecuteNonQuery(comlist); ...
- python计算代码运行时间的装饰器
import time def cal_time(func): def wrapper(*args, **kwargs): t1 = time.time() result = func(*args, ...
- C语言--计算代码段运行时间
c语言中有专一包含计算时间函数的头文件,time.h.当我们需要计算某段程序运行的时间时就需要用到time.h包含的clock()函数,在这里介绍一下如何使用这个函数计算代码运行时间. clock函数 ...
- 计算Python代码运行时间长度方法
在代码中有时要计算某部分代码运行时间,便于分析. import time start = time.clock() run_function() end = time.clock() print st ...
随机推荐
- 字节流转字符流OutputStreamWriter、InputStreamReader,关闭流的方法
转换时可以指定编码格式:GBK.UTF-8 public class Demo { public static void main(String[] args) { File f = new File ...
- 自定制Centos7.3系统镜像(ISO)
本文主要介绍如何根据官方的Centos镜像文件,在保留原有默认安装的RPM包的基础下,添加自己所需要的RPM包的,最终生成一个自定制版的ISO,节省了宝贵的时间并确保了安装的定制性.对于其他没有介绍的 ...
- scrapy xpath、正则表达式、css选择器
scrapy xpath XPath即为XML路径语言,它是一种用来确定XML(标准通用标记语言的子集)文档中某部分位置的语言.XPath基于XML的树状结构,提供在数据结构树中找寻节点的能力. 学习 ...
- 20181114 Redis
Redis 下载 Windows版本 Windows版本 已经有很久没有更新了,建议还是使用Linux版本 Linux版本 官网下载即可 配置文件 Windows版本 redis.windows.co ...
- check nginx配置文件错误:[emerg]: getpwnam(“nginx”) failed
1.错误提示: [root@server include]# /application/nginx/sbin/nginx -t -c /applications/nginx/nginx/nginx.c ...
- HDU - 3980 Paint Chain(SG函数)
https://vjudge.net/problem/HDU-3980 题意 一串长度为n的柱子,每个人只能给连续的珠子涂色,涂过的不能再涂,不能涂的人就输了,问最后谁获胜. 分析 第一个人先涂m个, ...
- HDU1098---数学
Ignatius's puzzle Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others ...
- java中静态代码执行顺序
1.Java中静态变量只能在类主体中定义,不能在方法中定义. 静态变量属于类所有而不属于方法. 2. 静态块:用static申明,JVM加载类时执行,仅执行一次 构造块:类中直接用{}定义,每一次创建 ...
- 集大软件工程15级个人作业Week2
集大软件工程15级个人作业Week2 快速通读教材<构建之法>,并参照提问模板,提出5个问题. 在每个问题后面,请说明哪一章节的什么内容引起了你的提问,提供一些上下文 列出一些事例或资料, ...
- CF448C Painting Fence (贪心分治)
题面 \(solution:\) 一道蛮水的分治题,但思想很不错(虽然我还是非常天真的以为是积木大赛原题,并且居然还有30分) 看到这个题目,根据贪心的一贯风格,我们肯定能想到将整个栅栏的下面某部分直 ...