Dots: 25 50 100 200 300 400 500 750 1000 1250 1500 2000 2500 3000

Duration: 0.5 seconds 0.75 seconds 1 second 5 seconds

Engine: jQuery TweenLite YUI 3 (Yahoo) MooTools Dojo TweenJS Zepto

START

Stress test the animation performance of various common Javascript tools and compare them with TweenLite. This test does not use a canvas element (although it certainly could) - it simply animates the left, top, width, and height css properties of standard image elements because those are supported in virtually all browsers. The goal was to be extremely fair and use the same code for everything except the actual animation. No tricks. Look at the source for yourself or run your own tests to confirm.

Choose the number of dots you'd like to animate and then choose the engine and click the "START" button below. Watch the fps in the lower right (you want that number high - it is the total average frames per second rendered). As more dots are animated, you'll see the performance gap widen. Try to push things until the fps drops below 30fps. When the CPU isn't breaking a sweat, fps should hover around 100fps in most modern browsers.