如何观察JS代码的执行时长

在开发当中,我们有时候需要知道JS代码从这个函数执行到下一个函数大概花费多久时长,进而对我们的代码进行优化。通常的做法是在计时开始处new一个时间对象,记录下来:

var timeStart = (new Data).getTime()

然后到了计时结束的地方再new一个时间对象,减去前者得到时长:

var timeEnd = (new Data).getTime()
var timeDiff =  timeEnd - timeStart 

但是现在有更便捷的方法,不需要new时间对象就可以获取经历时长了,直接利用Date.now()的方法获取自1970年1月1日 00:00:00 UTC到当前时间的毫秒数

var timeStart = Date.now()

计时结束点:

var timeEnd = Date.now()
var timeDiff =  timeEnd - timeStart 

另外,这个方法对于浏览器的兼容性还是不错的
PC
手机

如果你觉得毫秒级别的计算不满足你的需求,这里还有JS提供的微妙级别的时间获取。

window.performance.now()

该时间戳的值是从window.performance.timing接口的navigationStart属性中的时间戳值为起始点开始计时的

如果你单纯只是想在控制台观察执行的时长,这里有更简便的方式(console.time / console.timeEnd)

// 计时开始点
console.time('label')    // label代表计时器名字
/*** code ***/
// 计时结束点
console.timeEnd('label')

执行console.timeEnd的时候会在控制台输出

label: 19.502ms
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值