jsPerf.com Introduces Graphs

If you haven’t seen jsPerf.com, you’ve been missing out. You can benchmark pieces of JavaScript against each other. The site was created by Mathias Bynens (blog) and the benchmarking engine, Benchmark.js, was created by John-David Dalton (blog).

JavaScript is by nature only acurate to 1 millisecond, and some browsers are acurate to only 15 milliseconds in practice. Benchmark.js uses higher resolution timers where available. For browsers it utilizes a Java Applet to access a high-precision timer. When Chrome or NodeJS are run with a --enable-benchmarking flag, it makes use of a native microsecond timer.

Benchmark.js takes benchmarking to the next level by using statistical analysis. For example, long-running tests run for more time than short-running tests and the statistical significance displays right next to the result. John-David Dalton criticizes Sunspider and other benchmark engines for lack of attention to solid statistics principles.

Let me illustrate. If your jsPerf.com results show script A is 500 Operations Per Second ±8%, and script B is 540 Operations Per Second ±8% you can tell that the speeds are about the same. But given the same number of Operations Per Second and a margin of error of under 1%, you can tell that script B is a bit faster.

Performance data really becomes powerful when tests are run across many browsers. Just make a jsPerf.com entry, copy the short link, and share it via email or Twitter to get some friends to test with their browsers. jsPerf.com will track and report the progress of all tested browsers.

screenshot

So the news with jsPerf.com is that results are now displayed in graphical form using the Google Visualization Library. Particularly helpful is the column-style bar graphs that show one set of bars per browser. Click on the screenshot at right for a live example.

For more information, read John-David Dalton’s write-up on benchmarking or listen to his JSConf2011 presentation.