Yesterday we took a brief look at Ember's run loop. Today we are going to look at some of the other functions available to us under the Ember.run namespace.
We will very briefly look at:
- run.later
- run.once
- run.next
- run.debounce
- run.throttle
Ember.run.later
The most common run method that you will likely use is
Ember.run.later()
.
You will use this method anytime you might normally want to use
setTimeout
.
Ember.run.later
works just about the same, but it respects Ember's run loop,
which will keep you as a developer happy.
The easiest way to use this method is to pass a callback and the wait in milliseconds. As part of an action on a component it might look like this:
actions: {
runLaterAction(){
Ember.run.later(() => console.log('running later!!!'), 5000);
}
}
Then you could invoke this action from the template like this:
<button {{action 'runLaterAction'}}>Run Later Button</button>
Ember.run.once
We looked at
Ember.run.scheduleOnce()
yesterday, this is the same as calling
that and passing in the actions queue. So,
Ember.run.scheduleOnce('actions',
func1);
and
Ember.run.once(func1)
should be functionally identical. This is
just a way to make sure that in a given run loop, in the
actions
queue a
function only gets called one time.
const func1 = () => console.log('func1 called.');
// ...
actions: {
runOnceAction(){
Ember.run.once(func1);
Ember.run.once(func1);
Ember.run.once(func1);
Ember.run.once(func1);
}
}
Invoking this action will only call
func1
a single time.
Ember.run.next
This method just runs the passed in code on the next run loop.
As is pointed
out in the guides, there are often better ways to
accomplish
what you
might be trying to accomplish with this method. It works just like calling
Ember.run.later
and passing in a wait of 1 millisecond.
const func1 = () => console.log('func1 called.');
...
actions: {
runNextAction(){
Ember.run.next(func1);
}
}
Ember.run.debounce
This method works exactly as you would expect a debounce method to work. It takes as params the optional context, the function being called, and the debounce wait time. There is also an optional final boolean param that, if set to true, tells the function to execute immediately then debounce additional calls. This last param defaults to false. Using this method might look like this:
import Ember from 'ember';
export default Ember.Controller.extend({
logit(){
console.log('debounced...');
},
actions: {
callDebounce(){
Ember.run.debounce(this, 'logit', 300);
}
}
<input onKeyPress={{action 'callDebounce'}}>
There is also a
throttle
method that works to make sure that calls aren't made
too often. I haven't ever needed this method. In practice, I find myself using
debounce, and I can't quite find the right use case for this. But it exists, so
if you find yourself needing it
have a look at the
api
.
That is it for today, tomorrow we will take a quick look at observers. See you then.
Comments for A little more about the Runloop.