Canvas Tag drawImage performance
Today I was tracking down a strange performance bottleneck in a html5 canvas based application I'm writing. In some occasions calling drawImage on a canvas was very slow. It took me a little while to figure out the reason. drawImage was always getting very slow when floats were used as coordinates. Let me give you a little example:
// slow ctx.drawImage(img, 10.1, 3.4); // fast ctx.drawImage(img, 10, 3);
I guess the browsers are doing some kind of expensive resampling when float coordinates are used. After changing all the drawImage calls to pass integers the rendering was a lot faster.
Jonas Wagner
Thanks, this speeds things up a bit... My project's performance is still not perfect, but this did help :)
Comment by Anonymous — 7/9/11 3:08 PM | # - re