Hacker News Reader

Comment by exogen | Hacker News Reader

The situation caused by promises gaining popularity and non-IE browsers refusing to implement setImmediate is really quite ugly. setTimeout's minimum value is defined to be 4ms by the HTML5 spec, so if the browser conforms to that and your app makes heavy use of promises (using setTimeout), now you're waiting multiple screen refreshes for updates – so you don't actually want to use setTimeout. Even though the asynchronous requirement is good for developers using the promise API, it really screwed over implementors.

The setImmediate polyfills attempt a bunch of ugly fallbacks, including (depending on which one you use): yield/generators, MutationObserver, postMessage/MessageChannel, onreadystatechange, and finally setTimeout (the slowest).

IMO the browser vendors should just give in and add setImmediate – if ever there was a need for it, this is it. But maybe they consider ES6 features a good enough substitute, I don't know.

View on HN

Whilst the concept of setImmediate is nice, the current implementation in IE isn't properly integrated with the rest of the event loop — resulting in broken behaviour when you use it in combination with setTimeout [1], DOM events, etc.

In contrast, using MutationObserver results in correct behaviour on all modern browsers and relatively minimal delays — between 0.002ms and 0.007ms according to an OS X only micro-benchmark I did last month [2].

And, yes, it would be great if we could call a builtin instead of hacking on top of MutationObserver, but it isn't that ugly:

  if MutationObserver
    $div = root.document.createElement 'div'
    observer = new MutationObserver tick
    observer.observe $div, attributes: true
    scheduleTick = ->
      $div.setAttribute 'class', 'tick'
      return
  else
    scheduleTick = ->
      setTimeout tick, 0
      return

In conclusion, I agree that a feature like setImmediate would be great. But given IE's broken implementation and a viable workaround in modern browsers, I see no need to rush it. I'd rather they focused on: new features like Object.observe; improving the performance of old features like Object.seal; and finalising some of the ES7 ideas like exposing the event loop!

[1] http://codeforhire.com/2013/09/21/setimmediate-and-messagech...

[2] https://gist.github.com/tav/9719011

This. Ran into this very issue when I was implementing promises in Mithril ( http://lhorie.github.io/mithril ). This really makes promise performance a much uglier beast than it needs to be.

I took a less conventional road there: I deliberately violate the A+ spec and let surprises like the ones in the article example happen, in order to get good performance without hacks/bloat. Typically, promise resolution is usually done asynchronously anyways (otherwise, why bother using promises?), so this caveat would only be a problem in some serious case of misuse.

In any case, surprises are fixable in application space (i.e. just move lines of code around), but performance degradation due to some deep implementation detail in the promise API / browsers not playing ball is nearly impossible to fix unless you switch to a non-conformant promise library (in which case, you'd have to fix the surprises anyways - assuming you had any cases of misuse to begin with).

A+ doesn't require that you use the browser's asynchronous scheduling mechanism, it only requires that the promise callback is always executed after the current function. There is a really neat hack to achieve this without completely relying on the browser's scheduler by implementing your own callback queue.

  asap(callback);

which will push to an array of callbacks that you need to execute and then call a loop if one isn't currently active:

  function asap(cb) {
    callbacks.push(cb);
    setTimeout(flushQueue, 5);
  }

Flushqueue will run all the callbacks from the queue in a loop, then empty it

  function flushqueue() {  
    if (flushing) return;
    flushing = true;
    for (var k = 0; k < callbacks.length; ++k) {
      callbacks[k]();
    }
    flushing = false;
  }

Now if some of the callbacks schedules a new function to execute using asap

promise.then(function first(x) { return alreadyResolvedPromise.then(function second(y) { return y.some.property; }); });

then when "promise" resolves, first()'s execution will push a new function to the queue, changing queue.length, causing that loop above to cause one more iteration - but only after first is complete.

(If you don't nest the callbacks, then the push will happen before flushqueue even starts executing)

The code above is overly simplified but I think its enough to demonstrate the idea. (Huge thanks Stefan Penner for explaining it to me :D)

Unfortunately there's no way to remove the need for flushQueue being called with the browser's asynchronous scheduling mechanism (using setTimeout in your example) in the case where it isn't already flushing – that's the issue. Flushing the callback queue to completion is an optimization, not really a fix.

Yes, truly asynchronous things which took less than 5ms will now take at least 5ms to execute. But its a stretch to say that for Promises/A+ implementations

"... always require at least one more iteration of the event loop to resolve. This is not necessarily true of the standard callback approach."

as the article states. A fully synchronous chain of 20 operations wont take 100ms - it will only take 5ms

I'm not really disputing the time anything will take, rather that "A+ doesn't require that you use the browser's asynchronous scheduling mechanism" – it very much does, even though that scheduling mechanism might be to occasionally flush your own managed event queue instead of handing every callback to the browser.

>> it will only take 5ms

This is true in the scenario of a linear chain, e.g. `.then(foo).then(bar)`, but the spec also requires that the following should work (for interop purposes, among a few other scenarios):

    .then(function() {return someOtherpromise.then(doSomething)})

So you might incur other harder-to-track-down penalties if you're doing interop between libraries somewhere, or if the promise chain has dependencies on the data provided by upstream resolvers.

If someOtherpromise is an already resolved promise from your own library, then it will still take just 5ms - the neat hack here is that asap will simply push another callback at the end of the queue (which is still being processed by the for loop) and the loop will simply get one more iteration straight in the middle of its execution.

If its from another library, then that other library may be using its own scheduler and you will loose those 5ms either way...

Yep. I believe the bigger promise libraries (bluebird et al) implement mechanisms similar to asap internally iirc.

My point was that violating the A+ spec instead of getting into the whole rabbit hole of timer clamps is not as unreasonable as one might think, and that doing so doesn't incur delays in any of those scenarios.

Maybe it isn't that unreasonable. But personally I do like guarantees, and in a stateful language I especially like guarantees about execution order.

If these guarantees can be offloaded to a library then thats really great, as I don't have to keep them in mind anymore, freeing my brain to think about the specific problem I'm trying to solve. One less thing to check for when debugging too.

There is also the bonus feature that stack overflows wont happen, which enables liberal use of recursive promise functions. (On the other hand, memory usage might still explode, so its not quite that easy... :D)

Those are good points. So far this approach hasn't been a problem w/ Mithril. If it turns out to be a bad idea down the road though, it can always be changed to conform w/ A+

> IMO the browser vendors should just give in and add setImmediate

Firefox has just shipped native promises, and you can use them to polyfill setImmediate instead ;)

http://kangax.github.io/es5-compat-table/es6/#Promise

Promises are being moved to native implementations, so the lack of setImmediate isn't really a problem anymore.

Here's the Firefox bug about implementing (or not) setImmediate:

https://bugzilla.mozilla.org/show_bug.cgi?id=686201

setImmediate works with macrotasks; promises work with microtasks. These are very different. See e.g. https://github.com/YuzuJS/setImmediate#macrotasks-and-microt...

Also, note that yield/generators are entirely synchronous, and cannot be used as a scheduling mechanism of any sort.

Reply on news.ycombinator.com