4 ms·
OffscreenCanvas isn't supported by Firefox yet. Also, if a canvas is just not attached to display it can act like offscreen canvas. Drawing on it will be much f
by smusamashah 5y ago
OffscreenCanvas isn't supported by Firefox yet. Also, if a canvas is just not attached to display it can act like offscreen canvas. Drawing on it will be much faster than on screen canvas. When you are done drawing, take the image data from offscreen canvas and draw on the live canvas.
- rikroots 5y agoThis. The one major stumbling block not mentioned in the article is accessibility. OffscreenCanvas offers nothing to solving that problem. Also, I don't understand people who complain that 2d canvas is slow; it isn't. What slows things down is poor planning and execution of the animation. For instance - does the entire Mandlebrot Set need to be calculated on every RequestAnimationFrame iteration? If I was tackling the problem I'd only calculate the data when one of the significant parameters changed - in a worker farm, wasm, whatever - and only update the display canvas when the results emerged. My canvas library[1] relies heavily in normal canvases not attached to the DOM. Not only does it speed things up massively, it also allows the library to do things like make the canvas responsive[2]. [1] - Scrawl-canvas - https://scrawl-v8.rikweb.org.uk/ https://scrawl-v8.rikweb.org.uk/ [2] - CodePen demo of a responsive canvas - https://codepen.io/kaliedarik/pen/jOmWwWy https://codepen.io/kaliedarik/pen/jOmWwWy