Web/API/Navigation timing API

The Navigation Timing API provides data that can be used to measure the performance of a web site. Unlike JavaScript-based libraries that have historically been used to collect similar information, the Navigation Timing API can be much more accurate and reliable.

This article currently describes Navigation Timing Level 1. There is a specification for Level 2, but it is not yet covered here.

Concepts and usage

You can use the Navigation Timing API to gather performance data on the client side, which you can then transmit to a server using XMLHttpRequest or other techniques.

This API lets you measure data that was previously difficult to obtain, such as the amount of time needed to unload the previous page, how long domain lookups take, the total time spent executing the window's load handler, and so forth.

Interfaces

Performance

The window.performance property returns a Performance object. While this interface is defined by the High Resolution Time API, the Navigation Timing API adds two properties: timing and navigation, of the types below.

PerformanceNavigationTiming

Provides methods and properties to store and retrieve metrics regarding the browser's document navigation events. For example, this interface can be used to determine how much time it takes to load or unload a document.

' PerformanceTiming

Used as the type for the value of timing, objects of this type contain timing information that can provide insight into web page performance.

'   PerformanceNavigation

The type used to return the value of navigation, which contains information explaining the context of the load operation described by this Performance instance.

The Navigation Timing API can be used to gather performance data on the client side to be sent to a server via XHR as well as measure data that was very difficult to measure by other means such as time to unload a previous page, domain look up time, window.onload total time, etc.

Examples

Calculate the total page load time

To compute the total amount of time it took to load the page, you can use the following code:

const perfData = window.performance.timing; 
const pageLoadTime = perfData.loadEventEnd - perfData.navigationStart;

This subtracts the time at which navigation began (navigationStart) from the time at which the load event handler returns (loadEventEnd). This gives you the perceived page load time.

Calculate request response time

You can calculate the time elapsed between the beginning of a request and the completion of getting the response using code like this:

const connectTime = perfData.responseEnd - perfData.requestStart;

Here, the time at which the request was initiated (requestStart). from the time at which the response was finished being received (responseEnd).

Calculate page render time

As another example of an interesting piece of data you can obtain using the Navigation Timing API that you can't otherwise easily get, you can get the amount of time it took to render the page:

const renderTime = perfData.domComplete - perfData.domLoading;

This is obtained by starting with the time at which loading of the DOM and its dependencies is complete (domComplete) and subtracting from it the time at which parsing of the DOM began (domLoading).

Specifications

Specification	Status	Comment
Navigation Timing Level 2	Working Draft	Adds PerformanceNavigationTiming
Navigation Timing	Recommendation	Initial definition.

Browser compatibility

Window.performance.timing

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
PerformanceTiming Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 8	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 8	Samsung Internet Android Full support 1.0
connectEnd Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
connectStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
domainLookupEnd Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
domainLookupStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
domComplete Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
domContentLoadedEventEnd Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 8	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 8	Samsung Internet Android Full support 1.0
domContentLoadedEventStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
domInteractive Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
domLoading Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
fetchStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
loadEventEnd Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
loadEventStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
navigationStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support Yes	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support Yes	Samsung Internet Android Full support 1.0
redirectEnd Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
redirectStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
requestStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
responseEnd Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
responseStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
secureConnectionStart Deprecated'	Chrome Full support 6	Edge Full support 18	Firefox Full support 56	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 56	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
toJSON Deprecated'	Chrome Full support 44	Edge Full support 12	Firefox Full support 25	IE Full support 9	Opera Full support 32	Safari Full support Yes	WebView Android Full support 44	Chrome Android Full support 44	Firefox Android Full support 25	Opera Android Full support 32	Safari iOS Full support Yes	Samsung Internet Android Full support 4.0
unloadEventEnd Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0
unloadEventStart Deprecated'	Chrome Full support 6	Edge Full support 12	Firefox Full support 7	IE Full support 9	Opera Full support 15	Safari Full support 11	WebView Android Full support Yes	Chrome Android Full support 18	Firefox Android Full support 7	Opera Android Full support 14	Safari iOS Full support 11	Samsung Internet Android Full support 1.0

Legend

Full support  

Full support

Deprecated. Not for use in new websites.'

Deprecated. Not for use in new websites.

Navigation Timing API by Mozilla Contributors is licensed under CC-BY-SA 2.5.