How to Benchmark Your Browser for HTML 5

How to Benchmark Your Browser for HTML 5
Contemporary browsers are much more than just a window into the World Wide Web: Browser developers have turned the software into sophisticated application platforms in their own right. But browsers are not the same as hardware platforms--rather, they function as virtual environments accessible from a variety of platforms. For example, you can have Google’s Chrome browser on Windows, Mac OS, Linux, and Android devices.

The current set of Web browsers--Chrome, Firefox, Opera, Internet Explorer, and Safari--support assorted standards, including HTML 5, the latest version of HyperText Markup Language. HTML 5 is an ambitious extension of HTML, incorporating an array of features. The standard is still in flux, however, and the World Wide Web Consortium hasn’t finalized it yet. Some of the important new features in HTML 5 include canvas rendering, tighter integration of SVG (scalable vector graphics), and video and audio tags. These new elements are specifically designed to make it easier for Web developers to present and manage multimedia content. What HTML 5 currently doesn’t have is a built-in standard way to handle 3D graphics.

Whenever new, competing platforms emerge, it’s natural to try to compare their performance. After all, users want the most robust and most responsive environment for running their applications, whether those apps are for productivity, entertainment, or education. The problem is that Web applications themselves are in a state of flux, as is the state of benchmarking Web browsers.

What I’m going to cover in this article won't tell you what the fastest browser is, nor what the best hardware might be for those browsers--that will come later. Today, I'll dive into the complexities of benchmarking browsers, look at a few examples of benchmarks, and help you understand where performance testing currently stands when it comes to these new virtual platforms. By the end of this article, you will know how to benchmark and optimize your browser for HTML 5 applications.

What Are We Benchmarking?

Performance testing can sometimes be a bit of a black art, and with Web browsers the situation is even worse. Part of the problem is the relative immaturity of the platform--HTML 5 is still an emerging standard, after all. As a result, applications use only some pieces of the standard, if any. The other main problem is how existing benchmarks work: For the most part, they test somewhat different things, so you need to run several to get a clear idea of how well your browser will perform. For example, Futuremark’s Peacekeeper browser benchmark bills itself as mainly a JavaScript benchmark, but it makes use of HTML 5 canvas and video in its test.

In addition, the same browser may behave differently on different operating systems. The Mac OS incarnation of Apple’s Safari, for instance, runs better than its Windows kin does (not a big surprise).

As you begin to consider benchmarking, you need to ask yourself a few key questions. Which platform? Is your intent to benchmark browser performance, or hardware? Are you running on a desktop system, a laptop, a tablet, or a phone? All of these questions will help to determine the type of benchmarks you’ll want to run. I’ll be focusing on desktop browser performance here, but bear in mind that performance in, say, Chrome running on an Android tablet with a power-efficient GPU and ARM processor will be different than on a desktop system with a discrete GPU.

What is cool is that we now have a way of benchmarking across multiple hardware platforms, albeit with some caution. Since Chrome and Firefox run across many different operating systems, you can use them to test performance across those platforms. Of course, the way code is compiled and built will differ, and some custom code is necessary for a browser to run on a particular OS or hardware platform, which can affect performance. But it’s a good first step.

I’ll be taking a look at several scenarios, all using desktop browsers. First, I’ll examine performance across three browsers running under the Windows 8 Consumer Preview. I chose Windows 8 mostly because I was curious about the claimed performance increases of Internet Explorer 10 over IE 9.

Access HTML 5 test pages such as Asteroids to benchmark how well your browser can handle HTML 5.

In addition to checking out browsers, I also swapped graphics cards. For the first run, I used an AMD Radeon HD 6970; for the second, an Nvidia GTX 570. Both were reference boards, so they ran at default clock speeds.

Finally, just for comparison, I tried the same benchmarks on a fairly typical Windows 7 laptop.

Next Page: A Look at the Benchmarks

Subscribe to the Daily Downloads Newsletter

Comments