在javascript中滚动循环背景的快速方法？

Question

你知道在javascript中滚动循环背景的快速方法吗？

我使用带有模式的fillRect，例如：

x += 2 ; if( x >= pattern_width ){ x -= pattern_width ; }
y += 1.5 ; if( y >= pattern_height ){ y -= pattern_height ; }
ctx.fillStyle = background_pattern ;
ctx.fillRect( -pattern_width+x , -pattern_height+y , game_width , game_height );

问题是fillRect非常慢，虽然每帧只调用一次，但它在探测器中仅占24％，这是巨大的。
我尝试在for循环中调用drawImage（），但它的速度一样慢。

（更新）我尝试用图案填充一个不可见的画布，然后只绘制它，为该画布调用drawImage（）一次而不是多次调用tile，但这非常相似：22％。

（更新）我没有在画布上绘图，而是将图块设置为画布的css背景，我只是设置了动画.style.backgroundPosition。根据剖析器，它似乎更快：9％，但它滞后更多，这很奇怪。 （好吧，这台电脑很旧，可能没有css硬件加速。）

你知道一种快速方法吗？