7

I'm making a small game using the HTML5 canvas element. It works great, except that it has a scrolling background with obvious tearing happening in Firefox and Chromium browsers in Ubuntu. I'm pretty sure it's buffered because there isn't any of the flickering I'd expect; just tearing. Is there any way to work around this or time rendering to right after the last screen refresh?

Sydius
  • 13,567
  • 17
  • 59
  • 76
  • See: http://stackoverflow.com/questions/6025661/how-can-i-get-vsync-callback-on-html5-canvas – Kos Aug 01 '11 at 08:44

1 Answers1

2

Currently there is no way to control the actual repainting of a canvas element(which if there was, could actually help in increasing performance I guess). So one can only hope that the browser actually does something intelligent, rather than screwing up like in your case.

I myself have quite some experience with the canvas element and know of its quirks. I ran into some kind of "repaint lag" several times by now, where obviously the actual numbers behind the scenes are correct and "smooth", but the graphics still have a somewhat "jumpy" behavior, which in fact is really annoying.

Only thing I can imagine that could have an effect in your case, is activating VSync in the driver settings of your Graphics Card.

If you'd like to provide a link to your game that might be helpful too, since I'm also running Ubuntu here.

Ivo Wetzel
  • 46,459
  • 16
  • 98
  • 112
  • Thanks for the suggestion. Unfortunately, I'm currently using placeholder art stolen from another game, so I cannot distribute it until the art is all replaced. I'm also seeing the lag issue you mentioned. – Sydius Sep 08 '10 at 03:58