Home > Back-end >  How to use the `PerformanceNavigationTiming` API to get page load time?
How to use the `PerformanceNavigationTiming` API to get page load time?

Time:07-11

I am trying to to use the picture of data

Does anyone know why I am getting this value?

CodePudding user response:

I was finally able to get this to work using a different method than the event listener. It certainly is logical that the data should be ready when the load event fires, but the only way I was able to get the data was to use another feature of the Performance API: the PerformanceObserver, which fires a callback when a new piece of data has become available.

Here is the code that worked for me:

export const useReportPageLoadMetrics = () => {
  useEffect(() => {
    const perfObserver = new PerformanceObserver((observedEntries) => {
      const entry: PerformanceEntry =
        observedEntries.getEntriesByType('navigation')[0]
      console.log('pageload time: ', entry.duration)
    })

    perfObserver.observe({
      entryTypes: ['navigation'],
      buffered: true
    })
  }, [])
}
  • Related