Cómo amortiguar los gráficos para un canvas de HTML5

Question

Estoy trabajando en un juego que empieza a ser bastante intensivo de gráficos. Hay muchos puntos, arcos y degradados que deben dibujarse. El problema es que dibujar todos estos gráficos está empezando a ser lento. RGBA gradientes radiales parecen tomar un tiempo excepcionalmente largo tiempo para dibujar si se dibujan sobre la parte superior de otros gradientes (es decir, para el fondo).

Si había alguna manera de amortiguar los gráficos, que me podría ahorrar mucho cálculos cada cuadro. De acuerdo con this gráficos de interrogación de amortiguación se puede lograr mediante la creación de un lienzo HTML5 oculto en el documento html. Desafortunadamente, esto no funcionará porque necesito poder almacenar una cantidad indefinida de gráficos para el juego.

¿Hay alguna manera de amortiguar un gráfico para un canvas de HTML5?

Answer 1

De http://kaioa.com/node/103

var renderToCanvas = function (width, height, renderFunction) { 
    var buffer = document.createElement('canvas'); 
    buffer.width = width; 
    buffer.height = height; 
    renderFunction(buffer.getContext('2d')); 
    return buffer; 
};