D3.js - Performance Test

written 09/08/13 by Tommy Krüger

D3.js rendering is based on SVG objects. As SVG is not hardware accelerated there could be performance issues if an application uses too many SVG objects.
This little test should give you the ability to test how many circle objects your machine supports until the animations aren't smooth anymore or even your browser stops ?! Use the button below to add circles.

This example uses Stats.js ( https://github.com/mrdoob/stats.js) to measure the performance.

Start Animation 100 Circles 200 Circles 400 Circles 800 Circles 1600 Circles 3200 Circles 6400 Circles 12800 Circles Clear

Source Code