Rendering performance in Canvas compared to SVG and VML
Date : 2008 06 24 Category : Tech & DevelopmentJust after I posted about Ernest’s canvas experiment with photos he put something else up that tests the performance of rendering polygons with Canvas compared to other techniques.
The demo lets you run a live test, and view saved tests, comparing the Google Maps interface, which “currently draws polygons using VML for Internet Explorer, SVG for Firefox and image retrieval for Safari and Firefox linux.”
At first the results were surprising. The canvas version was magnitudes faster. However, then they worked out that the live Google Maps version is actually doing a lot more than just drawing the polygons, that being said, a commenter had a valid point:
If we analyze the rendering time of the markup alone, both SVG and VML are not necessarily slower than canvas and canvas+excanvas.js. So the difference in performance is due to the implementation of polygons before the markup is output which the canvas implementation is skipping.
That doesn’t make the experiment invalid. You didn’t show that Canvas is faster than SVG or VML.
But you did show that it’s possible to get much better polygon performance than the current API using a more direct to the metal approach - with whatever rendering engine. And people are crying out for faster polygons.
