Why is putImageData so slow?

Question

I am working with a relatively large Canvas where various (complex) stuff is drawn to. I then want to save the Canvas\' state, so I can quickly reset it to the state it now

Answer 1

Firstly you say you are measuring with Firebug. I actually find that Firebug slows down JS execution considerably, so you may not be getting good numbers for performance.

As for putImageData, I suspect it's because the functions takes a large JS array containing many Number objects, all of which have to be checked for range (0..255) and copied into a native canvas buffer.

Maybe once the WebGL ByteArray types are available, this sort of thing can be made quicker.

It does seem odd that base64 decoding and uncompressing the data (with the PNG data URL) is quicker, but that only calls one JS function with one JS string, so it is using mostly native code and types.