Convert to Image or use canvas?

Question

Just wondering if its better to convert a canvas drawing to an image before adding it to the DOM or is it better to just add the canvas itself?

I am using canvas to create the image.

Answer 1

It depends on your scenario.

Canvas may or may not allocate an extra memory buffer but typically shares the back buffer with the display buffer. This may not be the case if the pixel ratio is different from 1:1 (ie. retina displays).

Also, with canvas, if created using html tags, may be cleared by the browser under certain conditions such as window resize. This seem to be a lesser problem now though then it used to be (Chrome could also clear canvas when showing some dialogs).

Converting it to image gives an performance and memory overhead though: first to create the compressed image, then converting it to base-64 with additional 33% memory overhead, then pass it in as image source which triggers converting of the base-64 string into image file and then for decompressing it to bitmap.

Answer 2

sure convert it to image and add it as DOM object

if you resize canvas will clear itself ,then you will have empty area.