[whatwg] Canvas pixel manipulation and performance

Boris Zbarsky bzbarsky at MIT.EDU
Sun Nov 29 12:03:53 PST 2009

On 11/29/09 1:20 PM, Jason Oster wrote:
>>> Changeset 2b56c4771d5c reduced the number of pixel array elements
>>> accessed by caching the 256px x 256px "rooms" within the stage map, and
>>> passing the cached rooms to putImageData().
>> As opposed to doing what before the change?
> The previous code used a "non-cached" approach.  Where every pixel in the canvas was explicitly drawn into the ImageData array.  Keep in mind, the largest of these was 4864px × 3072px.  If anything, the change took time away from JavaScript and placed it in native code: putImageData().

I'm not sure I follow.  Looking at the diff, it looks like you used to 
do a single putImageData call, passing it this.fgmap.render(), right?

Now you do a bunch of putImageData calls, passing 
this.fgmap[rooms[i++]].img, where right before that you called 
this.fgmap[i].render() for a bunch if "i".

I really don't see how this would have made things faster, unless 
render() is just not being called on all rooms now.


More information about the whatwg mailing list