概念
performance.now():回傳值表示為從time origin之后到當前呼叫時經過的時間,
time origin: 時間源,
時間源是一個可以被認定為當前檔案生命周期的開始節點的標準時間,計算方法如下:
- 如果腳本的 global object 是
Window, 則時間源的確定方式如下:- 如果當前
Document是中加載的第一個Window, 則時間源是創建瀏覽器背景關系的時間, - 如果處于卸載視窗中已加載的先前檔案的程序中,?? 一個確認對話框會顯示出來,讓用戶確認是否離開前一頁,則時間源是用戶確認導航到新頁面的這個時間,這一點是被認同的,
- 如果以上方式都不能確定時間源, 那么時間源是創建視窗中當前
Document的導航發生的時機,
- 如果當前
- 如果腳本中的全域物件是
WorkerGlobalScope(意味著,該腳本以 web worker 的形式運行), 則時間源是這個 worker 被創建的時刻, - 在所有其他情況下,時間源的值是 undefined,
Date.now() 方法回傳自 1970 年 1 月 1 日 00:00:00 (UTC) 到當前時間的毫秒數,
對比
- performance.now() 和 JavaScript 中其他可用的時間類函式(比如
Date.now)不同的是,window.performance.now()回傳的時間戳沒有被限制在一毫秒的精確度內,相反,它們以浮點數的形式表示時間,精度最高可達微秒級, - 另外一個不同點是,
window.performance.now()是以一個恒定的速率慢慢增加的,它不會受到系統時間的影響(系統時鐘可能會被手動調整或被 NTP 等軟體篡改),另外,performance.timing.navigationStart + performance.now()約等于Date.now(), - performance.now是瀏覽器(Web API)提供的方法,不同瀏覽器獲取到的精度不同,Date.now是Javascript內置方法,差異主要在于瀏覽器遵循的ECMAScript規范
- Date.now() ≈ performance.timing.navigationStart + performance.now()
適用場景
耗時計算
performance.now() 方法
performance.now()-performance.now()
// 分別為兩個時刻的 performance.now()
優點:
- 精確度高,低于 1ms(實際情況視瀏覽器的不同,精度大約在
0.1ms ~ 0.005ms之間); - 記錄的時間可以被變數所保存,因此可以用于生產環境使用;
缺點:
- 回傳的值,跟打開網頁的時間有關(至少chrome如此),并不像
Date.now()那樣直接回傳現在距離 1970 年那個起始時間的毫秒數,
console.time方法
console.time("耗時") for(let i=0;i<1000;i++){ console.log(i) } console.timeEnd("耗時") // 耗時: 38.914794921875 ms
優點:
- 精度比較高(單位小于毫秒),連續兩行
console.time('耗時')和 ··console.timeEnd('耗時')··,他也能計算出時間差異;
缺點:
- 首先只能在控制臺顯示結果,他本身是沒有回傳值的;
- 不能提交到服務器日志;
Date.now() 方法
前后兩個時間相減即可,
優點:
- 可以獲取當前的時間,并且被變數保存;
缺點:
- 精度太低,小于 1ms 的測驗不出來結果;
參考檔案:
https://developer.mozilla.org/zh-CN/docs/Web/API/Performance/now
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date/now
https://developer.mozilla.org/zh-CN/docs/Web/API/DOMHighResTimeStamp#the_time_origin
https://zhuanlan.zhihu.com/p/570601679
https://blog.csdn.net/weixin_34240657/article/details/91422212
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/514124.html
標籤:JavaScript
