Comments on: NavigationTiming in Practice

By: Performance Calendar » Getting started with web performance: 2019 beginner’s guide

Mon, 24 Dec 2018 23:24:00 +0000

[…] that Navigation Timing and Resource Timing APIs have been buggy in some early implementations; watch out for outliers […]

By: Nic

Nic — Wed, 17 Oct 2018 13:35:54 +0000

@Samar You can use the Page Visibility API (https://w3c.github.io/page-visibility/) to get the current visibility state, so if your script is on the page, you can log these transitions.

Unfortunately, we don’t currently have a way of knowing if the page was _ever_ visible. Here’s an issue discussing that: https://github.com/w3c/page-visibility/issues/29

By: Samar

Samar — Wed, 10 Oct 2018 06:27:57 +0000

How to detect if a visibility of the document has changed from `prerender` to `visible` for each navigation / soft SPA event?

By: Nic

Nic — Tue, 09 Oct 2018 22:42:39 +0000

In reply to Samar.

@Samar: Unfortunately it is not. domInteractive is when the DOM (Document Object Model) is interactive: https://developer.mozilla.org/en-US/docs/Web/API/PerformanceTiming/domInteractive. In otherwords, it’s when your JavaScript can interact with the document object.

Time to Interactive measures when the page is responsive. It is not yet a web standard. However, Boomerang (the open-source RUM tool) measures TTI in its Continuity plugin: https://github.com/akamai/boomerang

By: Samar

Samar — Tue, 09 Oct 2018 10:57:39 +0000

Thanks, Nic for this article. It is really helpful. Is time to interactive (TTI) = performance.timing.domInteractive – performance.timing.navigationStart?

By: Nic

Nic — Fri, 01 Jun 2018 17:54:37 +0000

True! Good idea to check the interface.

By: Fred Short

Fred Short — Fri, 01 Jun 2018 13:27:01 +0000

Thanks Nic. Also, would a better check in the NavigationTiming2 above be:

if (‘PerformanceNavigationTiming’ in window) {
var ntData = window.performance.getEntriesByType(“navigation”)[0];
}

if (‘performance’ in window &&
window.performance &&
typeof window.performance.getEntriesByType === ‘function’) {
var ntData = window.performance.getEntriesByType(“navigation”)[0];
}

the check you have passes in FF(52) but then the getEntriesByType call yields undefined.

By: Nic

Nic — Fri, 01 Jun 2018 01:44:04 +0000

@Fred – At this point, all browsers still maintain performance.timing.navigationStart, even though it’s marked as obsolete.

They’re supposed to provide performance.timeOrigin instead, though in some cases I’ve seen the two numbers differ, and it’s not clear to me why that would be.

By: Fred Short

Fred Short — Thu, 31 May 2018 12:00:02 +0000

Hi Nic,
Can I still rely on performance.timing.navigationStart to provide the timestamp as to when the page navigation began or is that being deprecated? The docs here state its obsolete now: https://www.w3.org/TR/navigation-timing-2/#sec-PerformanceNavigationTiming. If it is obsolete, what can I use in its place to provide an equivalent timestamp?

Thanks,
Fred

By: Nic

Nic — Thu, 19 Apr 2018 02:02:06 +0000

Updated 2018-04 with more NavigationTiming2 information!