Pros and cons of replacing images with canvas drawings in template?

Question

I am going to redevelop a beautiful but heavy theme. I try to make it as light-weight and performant as possible but still eye-catching. In order to minimize the http requests needed to get images and hence save rendering time and bandwidth, I am going to replacing as many images as possible with html5 canvas.

So I am wondering what are the pitfalls as well as advantages of this approach.

Answer 1

One pitfall is that not all browsers support canvas. You can see the support in this article:

http://en.wikipedia.org/wiki/Comparison_of_layout_engines_(HTML5_Canvas)

(Update: from a link on the Facebook blog I came across this site which shows browser support for various features: http://caniuse.com/#feat=canvas)

For IE8 and earlier there are workarounds.

You are going to need to use new tools, or code the canvas by hand, so that means a learning curve.

You'd identified the advantage already - saving bandwidth.