timing.js

timing.js

Timing.js is a small set of helpers for working with the Navigation Timing API to identify where your application is spending its time. Useful as a standalone script, DevTools Snippet or bookmarklet.

Features

• Normalizes firstPaint across Chrome, Opera and IE11 to timing.getTimes().firstPaint. Firefox may be able to do similar with MozAfterPaint
• Adds firstPaintTime (firstPaint - load/nav start)
• Adds:domReadyTime, initDomTreeTime, loadEventTime, loadTime, redirectTime, requestTime, unloadEventTime connectTime

Installation

Clone

Download the latest version or just git clone https://github.com/addyosmani/timing.js.git.

Bower:

$ bower install timing-js

npm:

$ npm install timing.js

Usage

By default, running the script will print out a summary table of measurements. The API for the script is as follows:

Get measurements:

timing.getTimes();

Print a summary table of measurements (uses console.table()):

timing.printSimpleTable();

Also works in Firefox DevTools (Firefox Nightly only for now):

Print a complete table of measurements (including rest of window.performance):

timing.printTable();

Sample output of timing.getTimes()

Chrome:

…

Firefox:

IE 11:

Build

Run npm install to install necessary dependencies for building the library. Check that npm run jshint doesn't throw any exceptions and then run npm run minify to minify.

License

Released under an MIT license.