Canvas y 'animaciones'

[jp91]

En algunos de mis comentarios coloque un link donde explican el cache,te para que te guies aqui una parte del codigo :

Código Javascript:

function aCanvas(width, height, render) {
    canvas = document.createElement('canvas');
    canvas.width  = width;
    canvas.height = height;
//aqui le pasas el contexto a la funcion que dibuja tus objetos
    render(canvas.getContext('2d'));
    return canvas;
  };
 

Código Javascript:

function dibujar(ctx) {
//se actualizo algo ?? ps pintamos    
if (this.pintar) {
//canvas a pintar
      this.canvas = aCanvas(this.game.width, this.game.height, this.pintaCasa.bind(this));
      this.pintar = false;
    }
//this.canvas tiene el retorno de la funcion aCanvas
// y el truco dibujar una imagen del canvas recuerda se pinta en cache y cuando hay algo
// nuevo se actualiza la imagen con el contenido del otro canvas. 
//el canvas puede ser pasado como parametro a este metodo.
    ctx.drawImage(this.canvas, 0, 0);