I don't know about performance, but there are various reasons why one might be chosen over another. Here's a page that gives you the run-down on the differences. This might explain their decision:

Of course, other factors come into play, such as data sources, etc... For instance, SVG seems tempting if you're getting a big chunk of data from the server, as you can format it as an XML and serve it up.

Also, the decision could be much more banal; it could simply be what they knew, had tools for, or the thing for which they could find documentation most quickly.

Sadly, not all software decisions are made on merit. Decisions are often much more opportunistic and rushed.


My personal experience basically adheres to the following:

Use SVG when there are shape elements (circles.rect,ellipse,paths, polygons) that rquire individual events attached(onclick,mouseover,etc.)

Use CANVAS when you can access pixels to present the graphic. The pixel control allows sophisticaed graphics not possible with SVG, and in many cases much more effvicient.

Just my input...


Yes, make it by <canvas>.

SVG vs canvas: how to choose:

  • SVG: High Fidelity Complex Vector Documents for Viewing and Printing, Static Images
  • <canvas>: Complex scenes and real time animations, High performance (filter, ray tracers), video manipulation.

Visit SVG vs canvas: how to choose for more details.

More Query from same tag