原文作者:文蔺
原文地点: http://www.wemlion.com/2016/f…
转载请保存此声明。
W3C Draft
题目叫 “Efficient Script Yielding”,一份 2011 年的 “Editor’s Draft”,从题目就能够看出用处。发起有时候读一遍,超等短。摘要就一句话:
This specification defines an interface for web applications to flush the browser event queue and receive an immediate callback.
本申明文档定义了一个用于革新浏览器事宜行列、吸收立即回调的 Web 运用接口。
MDN
MDN 的文档没得说。遇到题目去查查一定不会害你,有时候命运运限好,还能读到翻译过来的中文版:
This method is used to break up long running operations and run a callback function immediately after the browser has completed other operations such as events and display updates.
该要领用来把一些须要长时候运转的操纵放在一个回调函数里,在浏览器完成后面的其他语句后,就马上实行这个回调函数。
但同时,文档提到, 只要 IE 10+ 和 Node.js 0.10+ 完成了该要领。setImmediate 受到了 Gecko 和 Webkit 的 “resistance”(抵抗)。发起随着去看看热闹。
MDN 文档中提到了三种模仿 setImmediate 的体式格局:postMessage
、MessageChannel
、setTimeout(fn, 0)
。
setImmediate polyfill
关于 Node 0.9 之前的,运用 process.nextTick
模仿;关于非 IE 10 的当代浏览器,运用 postMessage
;对 Web Worker,运用 MessageChannel
(这个以后须要关注下);对 IE 6–8,向 html 中插进去新的 script 标签,在 onreadystatechange
事宜中实行回调;其他浏览器,一致运用 setTimeout(fn, 0)
的情势。
// Don't get fooled by e.g. browserify environments.
if ({}.toString.call(global.process) === "[object process]") {
// For Node.js before 0.9
installNextTickImplementation();
} else if (canUsePostMessage()) {
// For non-IE10 modern browsers
installPostMessageImplementation();
} else if (global.MessageChannel) {
// For web workers, where supported
installMessageChannelImplementation();
} else if (doc && "onreadystatechange" in doc.createElement("script")) {
// For IE 6–8
installReadyStateChangeImplementation();
} else {
// For older browsers
installSetTimeoutImplementation();
}
Nicholas C. Zakas 的文章
文章很短,但讲得还挺细致的。作者提到了两点优点:
能够直接在 UI 行列清空后直接插进去 JS 使命;
耽误更短,没必要守候下一次 timer tick
Edge Demo
经由过程 250 个数的排序,来对照处置惩罚效力。基本原理是,排序时将每一步的交流操纵放在回调中,对照排序完成的效力。一共有四种:
setTimeout(fn, 15)
setTimeout(fn, 4)
PostMessage
setImmediate
关于前两种的时候距离题目,发起直接取读 demo 底部的申明。已很详细了。