HTML5 Media and Canvas

Abstract

While the SVG environment is a declarative graphics environment dealing with vector-based shapes, the HTML Canvas provides a script-based graphics environment revolving around pixels or bitmaps. In comparison with SVG, it is faster to manipulate data entities in Canvas, since it is easier to get directly to individual pixels. On the other hand, SVG provides a DOM and has an event model not available to Canvas. Thus, applications that need graphics with interactivity will typically choose SVG, while applications that do a lot of image manipulation will more typically reach for Canvas. The available transforms and effects in both are similar, and the same visual results can be achieved with both, but with different programming effort and potentially different performance.