快用上PerformanceObserver，別再手動計算首屏?xí)r間了
點擊上方?前端陽光，關(guān)注公眾號
回復(fù)加群，加入技術(shù)交流群交流群
大家好，我是陽光，今天給大家介紹一個非常好用的瀏覽器api：PerformanceObserver?， 我們可以用它來獲取首屏、白屏的時間，就不用再麻煩地手動去計算了。
1介紹
PerformanceObserver?可用于獲取性能相關(guān)的數(shù)據(jù)，例如首幀fp、首屏fcp、首次有意義的繪制 fmp等等。
構(gòu)造函數(shù)
PerformanceObserver()創(chuàng)建并返回一個新的 PerformanceObserver 對象。
提供的方法
PerformanceObserver.observe()
當(dāng)記錄的性能指標(biāo)在指定的 entryTypes 之中時，將調(diào)用性能觀察器的回調(diào)函數(shù)。
PerformanceObserver.disconnect()
停止性能觀察者回調(diào)接收到性能指標(biāo)。
PerformanceObserver.takeRecords()
返回存儲在性能觀察器中的性能指標(biāo)的列表，并將其清空。
重點我們看看observer.observe(options);
options
一個只裝了單個鍵值對的對象，該鍵值對的鍵名規(guī)定為?entryTypes。entryTypes?的取值要求如下:
entryTypes 的值：一個放字符串的數(shù)組，字符串的有效值取值在性能條目類型 中有詳細列出。如果其中的某個字符串取的值無效，瀏覽器會自動忽略它。
另：若未傳入 options 實參，或傳入的 options 實參為空數(shù)組，會拋出 TypeError。
2實例