Do you know a fast method for scrolling looping backgrounds in javascript ?
I use fillRect with a pattern, like :
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 );
The problem is that fillRect is very slow, it alone takes 24% in the profiler though it is called only once per frame, that is huge.
I tried calling drawImage() in a for loop instead but it is about as slow.
I thought about prerendering each frame of the loop on invisible canvases, but it would take many 1024x600 canvases : bad idea.
Do you know a fast method ?
Aucun commentaire:
Enregistrer un commentaire