Understanding Navigation Timing API

Question

I am trying to get my head around the Navigation Timing API. When I look at the following example:

function onLoad() { 
  var now = new Date().getTime();
  var page_load_time = now - performance.timing.navigationStart;
  console.log("User-perceived page loading time: " + page_load_time);
}

In the above case I am getting a non zero number if I just open a browser and run these 3 lines. I would expect it to be 0 if no navigation actually took place so it look like I don't understand how this works.

How would I use this API if I want to know how long did it take for DOM to load. If I navigate to a page and then execute:

performance.timing.navigationStart;

What is this number that I'm going to get? Is this the last loaded page?

Answer 1

Ok, found the answer here.

The PerformanceTiming.navigationStart read-only property returns an unsigned long long representing the moment, in miliseconds since the UNIX epoch, right after the prompt for unload terminates on the previous document in the same browsing context. If there is no previous document, this value will be the same as PerformanceTiming.fetchStart.

Where the PerformanceTiming.fetchStart read-only property returns an unsigned long long representing the moment, in miliseconds since the UNIX epoch, the browser is ready to fetch the document using an HTTP request. This moment is before the check to any application cache.