From 394ddd5d69a9a5090653dd1fd42e004dd58e8269 Mon Sep 17 00:00:00 2001 From: Christopher Chedeau Date: Mon, 23 Feb 2015 19:58:09 -0800 Subject: [PATCH] Update Timers.md --- docs/Timers.md | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/docs/Timers.md b/docs/Timers.md index 81f4222136..d0a1ac2299 100644 --- a/docs/Timers.md +++ b/docs/Timers.md @@ -32,3 +32,33 @@ var Component = React.createClass({ ``` We highly recommend never using bare timers and always using this mixin, it will save you from a lot of hard to track down bugs. + +## InteractionManager + +One reason why native apps feel so good performance wise is that barely any work is being done during an interaction/animation. In React Native, you can use `InteractionManager` that allows long-running work to be scheduled after any interactions/animations have completed. + +Applications can schedule tasks to run after interactions with the following: + +```javascript +InteractionManager.runAfterInteractions(() => { + // ...long-running synchronous task... +}); +``` + +Compare this to other scheduling alternatives: + +- requestAnimationFrame(): for code that animates a view over time. +- setImmediate/setTimeout/setInterval(): run code later, note this may delay animations. +- runAfterInteractions(): run code later, without delaying active animations. + +The touch handling system considers one or more active touches to be an 'interaction' and will delay `runAfterInteractions()` callbacks until all touches have ended or been cancelled. + +InteractionManager also allows applications to register animations by creating an interaction 'handle' on animation start, and clearing it upon completion: + +```javascript +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 +```