frame-queue

Queue up events, triggering once at the beginning of the next frame to reduce over-updating visual elements.

Usage

queue = frameQueue()

Creates a new frame queue to listen to and trigger.

queue(event)

Queues up an event to be triggered in the next frame. You can do this multiple times in a single frame and know that the update will only fire the one time it needs to.

queue.on(event, callback)

Listen to events named event, calling callback when they're fired.

var createQueue = require('frame-queue')
 
var model = { _value: 'lorem' }
 
model.element = document.createElement('div')
model.queue = createQueue().on('value', function() {
  // only fired once, despite the update
  // logic being triggered 100 times in the same frame
  model.element.innerHTML = model.value
})
 
Object.defineProperty('value', {
    get: function() { return this._value }
  , set: function(value) {
    this._value = value
    this.queue('value')
  }
})
 
for (var i = 0; i < 100; i++) {
  model.value = 'ipsum'
}

License

MIT. See LICENSE.md for details.