Sprite Testing for Rich Internet Applications

The follow page contains public source code and demos for the paper “Graphics Performance in Rich Internet Applications”, published in IEEE Computer Graphics & Applications (CG&A), September 2012.

A series of sprite tests was developed for testing raw graphics performance in Rich Internet Application Frameworks. By writing the same test in four different rich internet application frameworks and languages, 1) Flex/Flash, 2) HTML5/Javascript, 3) WebGL/Javascript, and 4) OpenGL/C++, it is possible to get a realistic picture of online graphics performance across browsers and languages.

The test consists of N transparent 2D sprites of 32×32 pixels each, rendered and initially placed at random locations on a 1280 x 900 pixel canvas. The sprites are animated according to a simple physics system with a point gravity at the center of the canvas. The test suite displays frame times in milliseconds, and allows for measurement of simulation and rendering separately. User input permits scaling the number of sprites (N) up to one million.

Raw Data can be downloaded here:

Raw Data (MS Excel spreadsheet)

All tests were conducted on a Sager NP8690 Core i7 640M laptop, with 4 GB ram, and a GeForce GTX 460M graphics card.
Original source code and demos are provided here for reference and validation.
To run these tests in different browsers, simply click on the links below in your browser of choice.

A future goal of this work, which readers are invited to participate in, is to perform these tests in other operating systems and on mobile devices.

Comments welcome below. NOTE: I recently fixed the comment entry below. If you have any problems posting comments, please email me at [email protected] and let me know.

Keyboard control is identical for all demos below:

Z, X – Decrease/increase number of sprites by 100
Q,W – Decrease/increase number of sprites by 10,000
P – Pause simulation. Continue rendering. (Measures rendering only)
D – Pause rendering. Continue simulation. (Measures simulation only)
S – Switch to BitmapData sprites (Flex/Flash version only)

Flex/Flash/ActionScript

Click for online demo. https://rchoetzlein.com/sprite_tests/flex/

Download source here: sprites_flex.zip

Use the ‘S’ key to switch between Sprite and BitmapData rendering.

HTML5/Javascript

Click for online demo. https://rchoetzlein.com/sprite_tests/jscript/

Download source here: sprites_jscript.zip

WebGL/Javascript

Click for online demo. https://rchoetzlein.com/sprite_tests/webgl

Download source here: sprites_webgl.zip

OpenGL/C++

Download source here (Windows): sprites_opengl.zip

One Response to “Sprite Testing for Rich Internet Applications”

  1. admin says:

    Recently fixed comment posting. If you have any questions comments should work now, or you are welcome to email me at [email protected]

Leave a Reply


Reload Image
*