performance.timing object

This object stores the info about timing of the various events' that happen during the webpage loading. Its properties'* description can be found below.

NOTE: This is simplified version based on W3C Navigation Timing spec.

navigationStart
The time when load/unload action was triggered which could be also a prompt to unload current document (i.e. enter was hit on url bar, page was refreshed, submit button clicked etc.). If there is no previous document it has the same value as fetchStart
redirectStart
It can be either the start time of redirect (if such is present) or zero
redirectEnd
If redirect is present it stores the time when last byte of the response of last redirect was received. Zero otherwise.
fetchStart
The time just before browser starts doing anything with the request. It's when the actual request starts. Between fetchStart and domainLookupStart browser checks its cache.
domainLookupStart
The moment just before browser checks DNS to resolve domain name. If DNS is not checked for any reason (e.g. the browser cache is used) it has the same value as fetchStart
domainLookupEnd
The time after browser finishes domain lookup. If DNS wasn't checked it has the value of fetchStart
connectStart
Time when browser starts connecting to the server. If resource is fetched from cache (or server is not contacted for any other reason like e.g. persistent connection) it has the same value as domainLookupEnd
connectEnd
Time when browser finishes establishing connection with server. If no connection was made it has the domainLookupEnd value.
secureConnectionStart
Optional. If page is using HTTPS it's the time just before handshake for secure connection is initiated. undefined otherwise.
requestStart
The moment just before browser starts requesting the resource (from server or cache). It DOESN'T have matching end attribute.
unloadEventStart
If requested document comes from the same origin as the previous one, the property stores the moment just before browser starts unloading the previous document. Zero otherwise.
unloadEventEnd
The time just after unloading of the previous document of the same origin has finished, zero if no previous document or it has differen origin.
responseStart
Returns the time just after browser receives first byte of the response from server, cache or local resource.
responseEnd
The moment just after browser receives the last byte of the response.
domLoading
The moment just after the document object is created.
domInteractive
The moment just after the browser finished parsing the document including scripts inserted in "traditional" blocking way i.e. without defer or async attribute.
domContentLoadedEventStart
The time just before DOMContentLoaded event is fired, which is just after browser has finished downloading and parsing all the scripts that had defer set and no async attribute.
domContentLoadedEventEnd
Moment just after DOMContentLoaded event completes. This is when DOMready event in JS frameworks is fired.
domComplete
Returns the time when there's nothing more that can delay load event of the document i.e. all images are loaded.
loadEventStart
It returns the time just before load event is fired or zero if load hasn't been fired yet.
loadEventEnd
Returns the time just after load event has finished. Zero if load hasn't been fired yet.
*msFirstPaint*
IE specific event that stores the time when document began to be displayed. Zero if loading failed.

*Technically these aren't the properties of the object itself but its prototype (although they're incorrectly implemented in Chrome for now).

It means that though you can access the data with good old performance.timing.fetchStart, you can't get all the keys with Object.keys(performance.timing) or use performance.timing.hasOwnProperty(fetchStart) method on it. Use Object.keys(Object.getPrototypeOf(performance.timing) instead.

This won't however work on Chrome right now (bug is filed here – thanks @marcoos), so just to be safe you can use this method to extract the keys of any Performance object (e.g. performance.timing or performance.navigation):

function getPerfObjKeys(obj) {
  var keys = Object.keys(obj);
  return keys.length ? keys : Object.keys(Object.getPrototypeOf(obj));
}      

If you stumbled on this page by accident here the project that it's connected with.

Fork me on GitHub