Ember.run.throttle not working as expected?


#1

I’m trying to throttle calls to a function that needs to run whenever a mousemove action occurs. Problem is that the function gets called with no throttling at all, i.e. as fast as possible; I’ve tried 1500ms with no evidence of throttling showing. The Ember docs give an example of how it’s supposed to work, but the example is different than the context I’m working within, which is that the function gets called by an action helper on a template.

What am I doing wrong?

template code: <div id="grid" {{action 'handleMove' on="mouseMove"}}></div>

component code:

actions: {
  handleMove: function() {
    Ember.run.throttle({name: 'test'}, this.processMove, 300);
  }
}

processMove() {
  console.log(this.name + ' ran.');
}

#2

Are you sure throttle is what you’re looking for? Not debounce?

Throttle does runs the function as soon as possible, but it wait for the window to pass before allowing next event to fire.


#3

I want throttle. I’m using it to render a dragbox as the user moves their mouse and don’t want the browser to redraw everything at maximum speed.

Regardless of what I’m using it for, I’m confused as to why the command just doesn’t work, i.e. it calls the function at maximum speed. Is there something wrong in the syntax?


#4

Maybe try something more like:

actions: {
  handleMove: function() {
    Ember.run.throttle(this, "processMove", 300);
  }
}

processMove() {
  // ...
}