[NTLUG:Discuss] Javascript and 'onMouseMove' events.

[Steve Baker]

I've been playing with writing a browser-based game in JavaScript (using
'canvas' graphics) recently. I want to use a full-color shape instead of
the mouse cursor - so I'm using 'onMouseMove' events and redrawing the
shape as needed. Everything works as programmed - but the timing is
terrible.

The cursor will alternately track smoothly for about a half second -
then freeze for another half second. Suspecting performance problems, I
started trimming the game code back and back until I had NOTHING but a
simple sprite redraw in the 'onMouseMove' event...and the result is the
same.

I know my sprite redraws are fast enough because during the half second
where everything works OK they track nicely. If I were to draw an 'X' in
the onMouseMove function and then move the mouse rapidly from left to
right, I'd get something like:

 XXXXXX       XXXXX       XXXXXX     XXXXXXX     XXXXXXX

I'm doing this in FireFox on OpenSuse 11.0 64bit on a really fast
computer - but I've seen the same behavior on other systems too.

Is there something inherent in the scheduling of browsers that makes
this inevitable - or is there some 'trick' to make this work OK?

Thanks...

  -- Steve.