你听说过performance.now()吗?
它是一个性能API方法,返回一个DOMHighResTimeStamp(代表 "高分辨率时间戳"),简单地说,这是一个以毫秒为单位的时间值,在两个时间点之间的小数部分。
performance.now()最常见的用例是监控一段代码的执行时间。现实生活中的用例可以包括视频、音频、游戏和其他媒体的基准测试和监控性能。
那么它是如何工作的呢?比方说,我们想监测一个特定函数的运行时间。
在开始运行我们的函数之前,我们调用一次该方法,然后运行函数本身,再调用performance.now()。由于performance.now()的两个实例都返回了从页面加载开始所经过的时间,而且我们有相同的起点,所以我们只需要得到两个函数调用之间的差异,就可以看到我们的代码运行了多长时间。
const startTime = performance.now();
for (let i = 0; i < 100; i++) {
console.log("Hi!");
}
const finishTime = performance.now();
console.log(`It took me ${finishTime - startTime} milliseconds to say "hi" a 1000 times!`
);
你可能已经看到Date.now()也被用于这个目的。这是一种有效的、常见的性能监控方法,但有一点需要注意。
Performance.now()和Date.now()之间最大的区别是,Date.now()返回一个与Unix时间有关的时间戳(从00:00:00 UTC,1970年1月1日开始的时间)。这就是我们可能面临的一个问题。JavaScript如何知道从这个日期开始已经过了多少时间?它从系统时钟中获取。但是,由于系统时钟存在于我们的机器中,它可以手动或通过程序进行调整,因此,时间精度无法保证。
在这种情况下,performance.now()就比较可靠。它既不依赖于历史上的某个特定时间点,也不依赖于我们的系统,因为它返回的是自文档生命期开始以来所经过的毫秒数量。
简单说明一下:出于安全考虑,从performance.now()返回的时间是四舍五入的,所以它的可预测性会比较差。不过,如果我们把它用于个人测试,这种不精确性并不重要。
performance.now()在所有现代浏览器中都有全面支持,从Chrome 24、Firefox 15和IE10开始。