exponentially increasing number of mouseup callbacks

[donhatch]

If I put this in the first mouseup callback:
console.log(" in mouseup 1");
and this in the second mouseup callback:
console.log(" in mouseup 2");
and this in the third mouseup callback:
console.log("in mouseup 3");
and I manipulate the slider a few times, the console shows this:

     in mouseup 3
75           in mouseup 1
3        in mouseup 2
     in mouseup 3
195          in mouseup 1
6        in mouseup 2
     in mouseup 3
375          in mouseup 1
9        in mouseup 2
     in mouseup 3
615          in mouseup 1
12       in mouseup 2
     in mouseup 3
990          in mouseup 1
15       in mouseup 2
     in mouseup 3
1170         in mouseup 1
18       in mouseup 2

The numbers in the left column are the number of times the message was printed consecutively.

[donhatch]

Or maybe it's just quadradically increasing :-/ Would be good to make it constant though.
I think the mousemove callbacks also suffer from the same problem.

[tatarjr]

hey @donhatch, I had initially run into a problem about not being able register mouseup, touchstop, touchcancel events properly, so that part ended up being a bit overkill. I'll try to optimize it this weekend.

Not really sure about the mousemove. It could be called with a throttle, but I'm guessing it would make the sliding action look a bit laggy. I'll experiment with this as well but I'd love to hear if you have any other ideas.

Cheers!

[tatarjr]

@donhatch I've just fixed the issue.

As you suspected, all binded events just kept piling on each other every time you interacted with the slider. Fixed it by namespacing the events and removing them on mouseup.

I've also experimented with throttling the mousemove events. While it works, there's no substantial benefit other than reducing the number of total mousemove events fired. Throttling it above ~30 ms makes the animation look janky.

Cheers!