html5 - canvas drawing slow in firefox -

i working on plugin can see in fiddle, problem when draw in firefox slows down fine in google chrome. help??

btw using 2 canvas, 1 drawing area save image later. check fiddle

context.beginpath(); newcontext.beginpath(); // if dragging draw line between 2 points if (clickdrag[i] && i) {     context.moveto(clickx[i - 1], clicky[i - 1]);     newcontext.moveto(clickx[i - 1], clicky[i - 1]); } else {     // x position moved on 1 pixel circle if not dragging     context.moveto(clickx[i] - 1, clicky[i]);     newcontext.moveto(clickx[i] - 1, clicky[i]); } context.lineto(clickx[i], clicky[i]); newcontext.lineto(clickx[i], clicky[i]); // set drawing color if (clicktool[i] === "eraser") {     //context.globalcompositeoperation = "destination-out"; // erase instead of draw on white     context.strokestyle = 'white';     newcontext.strokestyle = 'white'; } else {     //context.globalcompositeoperation = "source-over"; // erase instead of draw on white     context.strokestyle = clickcolor[i];     newcontext.strokestyle = clickcolor[i]; }  context.linecap = "round"; context.linejoin = "round"; context.linewidth = radius; context.stroke(); 

http://jsfiddle.net/av6bg/

i think you're doing lot of computations , drawing obtained in simpler way.

in other words it's not firefox slow... it's chrome blazing fast :-d

an alternative approach example having partially transparent image displayed browser on top of canvas , drawing operations performed on canvas directly without special masking.

what allow seeing painting through mask without having complex clipping manipulations.

those operations done real on single canvas when user asks export picture png if need provide.

to see example of approach in action check out

the source code in lisp shouldn't hard read (the full program 116 lines)