How does mousemove run in javascript?

Question

I have an object that prints mouse positions x and y on each mousemove.

Something like that:

$('#canvas').mousemove(function(e){ $('#output').prepend(e.pageX + ',' + e.pageY); }); 

I noticed that when you move around an object very quickly, it only displays a few positions.

I'm not completely unhappy that he is doing this (because it would be complete enough for him to do something for all the hundreds of pixels that you crossed), but I wonder how it works.

Is the mousemove event a limited number of triggers per second or what?

(Btw: this was tested on Chromium on Ubuntu Linux)

Answer 1

"The mice only report their position in the operating system n times per second, and I think that n is usually less than 100"

Answer 2

You can look at this, as it depends on the browser,

http://javascript.info/tutorial/mouse-events#mousemove-and-mouseover-frequency , but if you look at this question, there is a suggestion on how to respond better.

How to set mousemove update speed?

Answer 3

I think it is synchronous. It does not start for every pixel in which you move the mouse, which means that events are not queued.

Tell me if you have some code like this.

 $('#canvas').mousemove(function(e){ //Some code which takes seconds to execute //All subsequent events won't be dispatched while this event handler is executing. }); 

Tell me if you move the mouse when the mouse move event handlers are executed. The mousemove handler mousemove not mousemove .

Here is an example for a handler that takes seconds. → http://jsfiddle.net/78Hf3/1/

And the one that only takes a few times → http://jsfiddle.net/78Hf3/2/