Constantly trigger mousemove event

Question

I have a script that triggers when the cursor is being moved:

window.addEventListener('mousemove', function(e){
        mouse.x = e.x;
        mouse.y = e.y;

        // This script changes the position of an object in relation to the mouse-position.
});

The Problem: The following thing might happen: The cursor is not being moved, but the object that moves in relation to the cursor changes its size, in order for the object to stay in the right position, the script has to be run constantly. (…while the object changes size.)

I want the function inside of the EventListener to constantly be called, even when the cursor is not being moved, how can I do this?

---

I know that this works, because on mobile the object moves in relation to the device-orientation and everything behaves exactly like I want it to, because the gyroscope-sensor inside of a mobile device, normally, constantly spits out new values, even when the device is, basically, completely still. – Then the values only change very slightly, but it works. – This constant refreshment of values is what also I need on desktop, even when the cursor doesn't move.

Answer 1

If you use requestAnimationFrame the brower will know that you want to perform an animation (move the cursor's object related) and will execute the callback function (parameter of requestAnimationFrame) before the next repaint.

Don't forget to call requestAnimationFrame in your callback function.