Question

Can a JavaScript canvas be manipuled like a standard bitmap (accessing/modifying a pixel and getting it’s size)? Is this use optimized, or would it be faster to manipulate normal 2d arrays of pixels and draw over canvas when you need it?

Answer 1

Absolutely yes! Please have a look here:
https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Pixel_manipulation_with_canvas

As for your second question, as per the pixels documentation, pixels is a one dimensional array. You’ll need to do your own 2 x 2 hoopla for a 2d way.

Taken from a previous SO answer by I82Much (works dandy for me):

int row = i;
int col = j;
int offset = row * width + col;
color p = pixels[offset];

More here: how to loop over the pixels using 2D array?

and here: http://www.processing.org/reference/pixels.html