計時器是一個應(yīng)用程序的重要的一個組成部分,React Native 實(shí)現(xiàn)了Browser timers。
requestAnimationFrame(fn) 相當(dāng)于 setTimeout(fn, 0),他們是在刷新屏幕之后被正確觸發(fā)。
setImmediate 是在向本地發(fā)送批處理相應(yīng)之前,當(dāng)前 JavaScript 執(zhí)行塊結(jié)束時執(zhí)行的。注意,如果你在一個回調(diào)函數(shù) setImmediate 之內(nèi)調(diào)用 setImmediate,它將立即被執(zhí)行,而且不會返回到本地之間。
這個 Promise 的實(shí)現(xiàn)是將 setImmediate 作為異步性的開端。
良好的原生應(yīng)用可以用起來感覺很順利的一個原因是在交互和動畫方面避免了復(fù)雜的操作。在 React Native,目前我們有一個限制,只有一個JS執(zhí)行線程,但是你可以使用 InteractionManager 來確保在任一交互或者動畫完成之后,長期的運(yùn)行工作的開始是被規(guī)劃好的。
在下面的交互完成之后,應(yīng)用程序可以安排任務(wù)來運(yùn)行:
InteractionManager.runAfterInteractions(() => {
// ...long-running synchronous task...
});
與其他調(diào)度方案相比:
觸發(fā)處理系統(tǒng)將一個或多個觸發(fā)看作是一個“交互”,并且將runAfterInteractions() 延遲回調(diào),直到所有的觸發(fā)都已結(jié)束或者被取消。
交互管理器還允許應(yīng)用程序通過對動畫的開始創(chuàng)建一個交互“處理”來注冊動畫,并且完成之后進(jìn)行清理:
var handle = InteractionManager.createInteractionHandle();
// run animation... (`runAfterInteractions` tasks are queued)
// later, on animation completion:
InteractionManager.clearInteractionHandle(handle);
// queued tasks run if all handles were cleared
我們發(fā)現(xiàn)在 React Native 上的應(yīng)用程序出現(xiàn)致命性問題的主要原因是由于一個組件被卸載后計時器就會被觸發(fā)。為了解決這個反復(fù)出現(xiàn)的問題,我們引入了 TimerMixin。如果你有 TimerMixin,那么你可以用 this.setTimeout(fn, 500)(只是加上 this.)來替換 setTimeout(fn, 500) 函數(shù)的調(diào)用,并且當(dāng)組件被卸載時,一切都會被清理干凈。
var TimerMixin = require('react-timer-mixin');
var Component = React.createClass({
mixins: [TimerMixin],
componentDidMount: function() {
this.setTimeout(
() => { console.log('I do not leak!'); },
500
);
}
});
我們強(qiáng)烈建議不用只單獨(dú)使用 Timers,而是一直使用 mixin,這樣將會為你節(jié)省很多很難追蹤的bugs。