Kaizoumark: a browser animation benchmark

17 Jun 2011 by David Corvoysier

After years of Flash dominance, HTML5 and CSS3 are now bringing many eye-candy features allowing the development of pure-web rich user interfaces (Canvas, CSS animations & transitions, WebGL).

At the same time, the development of native applications on smartphones & tablets have raised the users level of expectations towards GUI to a point that "plain old web" user interfaces are not an option anymore.

But do current implementations live up to the expectations ? This has yet to be demonstrated ...

The sad truth is that even on desktop, the CPU alone cannot cope with the level of complexity that is today required to develop a fancy user interface, and browser vendors are struggling to take advantage of hardware accelerations provided by blitters or GPUs. Due to the huge diversity of hardware configurations available, this leads to a very fragmented landscape for the poor web developer.

That said, how can we users help things getting better ? By providing feedback on how well their implementation behave to the browser developers ...

For that purpose, I have designed a small browser animation benchmark test that calculates the number of frames the browser is displaying per seconds while an animation plays.

Note: If you want to know how the framerate is evaluated, see this post.

It currently only tests CSS 2D features, but I will add more tests later.

At some point in the future I will also try to add some mechanism to have results gathered in a database, but in the meantime, you can post your result as a comment, specifying your hardware configuration, operating system and browser version.

Click on the link below to benchmark your browser.

kaizoumark

Update (2012/11/26): Now now working with all major browsers.

comments powered by Disqus