在瀏覽器和 Node.js 中更精確地測量執行時間

這是我參與8月更文挑戰的第4天，活動詳情查看：8月更文挑戰

測量應用程序中的某個片斷須要多長時間是很重要的。

在前端中，咱們有 Navigation TimingAPI，Resource Timing API 以及 User Timing API 收集精確的指標。

此外，咱們最經常使用的應該是使用 Date 對象來評估某件事情須要多長時間。例如：

const before = Date.now()
console.log(before) // 1505722233092
​
// some code here
// ...  
​
console.log(Date.now() - before) // 81736ms
複製代碼

我能夠用 Date.now 來計算時間。它返回一個 UNIX 時間戳。

注意：Date.now() 方法返回自1970年1月1日UTC 00:00:00以來通過的毫秒數。

console.time 和 console.timeEnd 也是一種很經常使用的簡便方法。在你不須要高分辨率計時的狀況下，該測量時間的方式也是一種不錯的選擇。

console.time('testStart')
​
// some code here
// ...
​
console.timeEnd('testEnd') // testTime: 48.5732421875 ms
複製代碼

但若是咱們想更精確一點呢？

瀏覽器中更精確的時間戳

在瀏覽器中，咱們可使用 window.performance.now() 方法，其返回一個精確到毫秒的 DOMHighResTimeStamp。

window.performance.now 也可用於 Web 或 Services Workers。在 Window 上下文中，返回的值是自 navigationStart 以來通過的時間。

const before = window.performance.now()
console.log(before) // 1381822.74
​
// some code here
// ...
​
console.log(window.performance.now() - before) // 7335.410000000149ms
複製代碼

既然，咱們說到了瀏覽器，那咱們也應該來講一說 Node.js，其有什麼方法能夠用來測量時間？

Node.js 中更精確的時間戳

Node.js process 模塊中有一個名爲 hrtime.bigint() 的方法以毫微秒爲單位返回當前高分辨率實時值做爲 bigint。

與 process.hrtime() 方法不一樣，它不支持額外的時間參數，由於差能夠經過兩個 bigint 的減法直接計算。

注意：之前是直接使用的 hrtime，詳細描述可查看 Node.js 文檔。

如下是文檔給出的一個代碼示例：

import { hrtime } from 'process'
​
const start = hrtime.bigint() // 191051479007711n
​
setTimeout(() => {
  const end = hrtime.bigint() // 191052633396993n
​
  console.log(`Benchmark took ${end - start} nanoseconds`) // 基準測試耗時 1154389282 毫微秒
}, 1000)
複製代碼

儘量精確地測量

爲了方便起見，咱們可使用一些庫來更加精準的測量咱們的程序花費的多少時間：

hrtime 是通用時間度量 API（Node 和瀏覽器）的簡便封裝器。在 Node 上使用 process.hrtime()，瀏覽器中的 performance API，若是二者都不可用，則返回到 Date。

默認狀況下，時間以毫秒爲單位：

import hirestime from 'hirestime'
 
// 時間測量的起始點
const getElapsed = hirestime()
 
setTimeout(_ => {
    // 返回通過的毫秒數
    console.log(getElapsed())
}, 1000)
複製代碼

指定單位：

import hirestime from 'hirestime'
 
// 時間測量的起始點
const getElapsed = hirestime()
 
setTimeout(_ => {
   // 返回通過的秒數
   console.log(getElapsed.s())
   console.log(getElapsed.seconds())
 
   // 返回通過的毫秒數
   console.log(getElapsed.ms())
   console.log(getElapsed.milliseconds())
 
   // 返回通過的納秒數
   console.log(getElapsed.ns())
   console.log(getElapsed.nanoseconds())
}, 1000)
複製代碼