Html5 canvas 如何为html5画布缓冲图形

我正在做一个游戏，它开始变得非常图形化。需要绘制很多点、圆弧和渐变。问题是绘制所有这些图形的速度开始变慢。RGBA径向渐变在其他渐变（即背景）之上绘制时似乎需要非常长的时间

如果有某种方法来缓冲图形，那可以在每一帧中为我节省大量计算。根据问题，可以通过在html文档上创建隐藏的html5画布来实现图形缓冲。不幸的是，这将不起作用，因为我需要能够为游戏缓冲未定义数量的图形

有没有办法为html5画布缓冲图形？

来自

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