Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there a practical limit to the number of canvas elements you can have on one page?

Is there a practical limit to the number of HTML5 canvas elements you can have on one page?

For example, is 500 individual canvases feasible for a modern browser on the average computer?

like image 346
UpTheCreek Avatar asked Sep 03 '11 21:09

UpTheCreek


1 Answers

Each canvas consumes memory at least, not less than an image of the same size.

How big are those canvas, anyway?

Having 500 different images on the same page could slow down the PC, and if those images are scaled down via CSS (so you have additional CPU usage), the slowness is overwhelming (I already tested it).

quick test done:

Ive created 500 512x512 canvases, and the Windows memory usage was about 40MB. Not so much, really.

Now I should draw in each one via JS, maybe using them allocates much more memory.

-edit-

500 canvases, 512x512, in each one is drawn a triangle: http://jsfiddle.net/3U4hG/1/

Consumes about 0.5GB, about 1MB for each canvas, and considering that 512x512x4 (4 bytes per pixel) is 1MB, the memory usage can be easily determined.

like image 128
Omiod Avatar answered Sep 24 '22 23:09

Omiod