計(jì)時(shí)器

計(jì)時(shí)器是一個(gè)應(yīng)用程序的重要的一個(gè)組成部分，React Native 實(shí)現(xiàn)了Browser timers。

計(jì)時(shí)器

• setTimeout,clearTimeout

• setInterval, clearInterval

• setImmediate, clearImmediate

• requestAnimationFrame, cancelAnimationFrame

requestAnimationFrame(fn) 相當(dāng)于 setTimeout(fn, 0)，他們是在刷新屏幕之后被正確觸發(fā)。

setImmediate 是在向本地發(fā)送批處理相應(yīng)之前，當(dāng)前 JavaScript 執(zhí)行塊結(jié)束時(shí)執(zhí)行的。注意，如果你在一個(gè)回調(diào)函數(shù)setImmediate 之內(nèi)調(diào)用 setImmediate，它將立即被執(zhí)行，而且不會(huì)返回到本地之間。

這個(gè) Promise 的實(shí)現(xiàn)是將 setImmediate 作為異步性的開端。

交互管理器

良好的原生應(yīng)用可以用起來感覺很順利的一個(gè)原因是在交互和動(dòng)畫方面避免了復(fù)雜的操作。在 React Native，目前我們有一個(gè)限制，只有一個(gè)JS執(zhí)行線程，但是你可以使用 InteractionManager 來確保在任一交互或者動(dòng)畫完成之后，長(zhǎng)期的運(yùn)行工作的開始是被規(guī)劃好的。

在下面的交互完成之后，應(yīng)用程序可以安排任務(wù)來運(yùn)行：

    InteractionManager.runAfterInteractions(() => {        // ...long-running synchronous task...
    });

與其他調(diào)度方案相比：

• requestAnimationFrame():代碼是在時(shí)間上的一個(gè)動(dòng)畫視圖

• setImmediate/setTimeout/setInterval():運(yùn)行代碼之后，請(qǐng)注意這可能會(huì)延遲動(dòng)畫

• runAfterInteractions():運(yùn)行代碼之后，沒有延遲的動(dòng)態(tài)動(dòng)畫

觸發(fā)處理系統(tǒng)將一個(gè)或多個(gè)觸發(fā)看作是一個(gè)“交互”，并且將runAfterInteractions() 延遲回調(diào)，直到所有的觸發(fā)都已結(jié)束或者被取消。

交互管理器還允許應(yīng)用程序通過對(duì)動(dòng)畫的開始創(chuàng)建一個(gè)交互“處理”來注冊(cè)動(dò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

TimerMixin

我們發(fā)現(xiàn)在 React Native 上的應(yīng)用程序出現(xiàn)致命性問題的主要原因是由于一個(gè)組件被卸載后計(jì)時(shí)器就會(huì)被觸發(fā)。為了解決這個(gè)反復(fù)出現(xiàn)的問題，我們引入了 TimerMixin。如果你有 TimerMixin，那么你可以用 this.setTimeout(fn, 500)（只是加上 this.）來替換 setTimeout(fn, 500) 函數(shù)的調(diào)用，并且當(dāng)組件被卸載時(shí)，一切都會(huì)被清理干凈。

    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，這樣將會(huì)為你節(jié)省很多很難追蹤的bugs。