Your data. Anywhere you go.

New Relic for iOS or Android


Download on the App Store    Android App on Google play


New Relic Insights App for iOS


Download on the App Store


Learn more

Close icon

How to manually record page load time?


#1
  • Share what method you used to deploy Browser (copy/paste):

  • Which version are you using? (Pro + SPA):

Hi,
My frontend is a SPA. I have the following code in page A
pagea.js

  <article>
    <component-a />
  </article>
  load() {
    console.time('loading time')
    window.newrelic.interaction()
  }

ComponentA.js

  <div>Test page load</div>
  onLoad() {
    console.timeEnd('page load')  // This would output 2000 ms
    window.newrelic.interaction().save() // 100 ms in browser page
  }

In new relic page load screen. I see the page load is 0.1 sec, which is way less than what console.time tells me.
I am pretty sure I’m doing this measurement in the wrong way. How do you guys record the page load manually?


#2

Hi, @tenn_lh: May I ask why you want to record it manually? The browser agent already does it. :slight_smile:


#3

Hi @philweber,
By default, the browser agent indeed collects the page load and route change data.
However, the average route changing time is always between 0.018ms to 0.06 ms in my case, which is very different than what I measure by console.time. Even by eye, I see visually different in loading time. So I wonder maybe it would be more accurate to trigger the route change manually.


#4

Hi @tenn_lh,

I think what you’re looking for is here:

https://docs.newrelic.com/docs/browser/new-relic-browser/page-load-timing-resources/instrumentation-browser-monitoring#instrumentation

It might be helpful to review the Navigation Timing Specification as well, which is also linked in that document. It looks like you’re not collecting the data from the same objects as the script.

Also, can you define what you mean by “route change”? Are you talking about the navigation from one page to another? Or, possibly, a page action that changed the current page’s content?