javascript - Move image in <canvas> without redrawing entire canvas? -

i've made game board , want drag , drop pieces (.gif's) can't find way without having redraw entire board endlessly since have clear piece every time moves 1 pixel , clears whatever under (the board , other pieces). possible?

yes, need redraw entire board each time.

one technique can use offscreen canvas:

var board = document.createelement("canvas"); board.width = width; board.height = height;  var boardcontext = board.getcontext("2d");  // rendering code board // ...  // draw board onto main canvas var context = maincanvas.getcontext("2d");  context.drawimage(board, ...); 

the board canvas not visible on screen, stored in memory each time need re-render, renders quickly.