Reading up on the Fiber architecture and Renderers in general - I'm not quite sure how to tell when reconciliation has completed. This is particularly important when rendering animation or targeting something other than the DOM
Let's consider, for example, a "ticker" root node that pushes changes on its children by setting state every requestAnimationFrame. If React has not finished reconciliation, this can quickly cascade into a mountain of pending updates. Therefore a reasonable strategy would be to "skip frames" (not set state) until reconciliation has definitively finished.
Naively, I tried doing this on a practical level by simply waiting for componentDidUpdate() on the root node and using that as a gate - assuming that it will not be called until all the children finished their render cycles (the children ultimately update canvas in componentWillReceiveProps() - and render null though I'm not sure if that's relevant)
I'm not sure if this is successful or not. Is there a simple way to measure?
More practically - and ideally even for a scenario where the children set there own state, is there a way to tell whether the tree as a whole has finished all reconciliation, or perhaps even from a particular node down?
Reading up on the Fiber architecture and Renderers in general - I'm not quite sure how to tell when reconciliation has completed. This is particularly important when rendering animation or targeting something other than the DOM
Let's consider, for example, a "ticker" root node that pushes changes on its children by setting state every requestAnimationFrame. If React has not finished reconciliation, this can quickly cascade into a mountain of pending updates. Therefore a reasonable strategy would be to "skip frames" (not set state) until reconciliation has definitively finished.
Naively, I tried doing this on a practical level by simply waiting for
componentDidUpdate()on the root node and using that as a gate - assuming that it will not be called until all the children finished their render cycles (the children ultimately update canvas incomponentWillReceiveProps()- and rendernullthough I'm not sure if that's relevant)I'm not sure if this is successful or not. Is there a simple way to measure?
More practically - and ideally even for a scenario where the children set there own state, is there a way to tell whether the tree as a whole has finished all reconciliation, or perhaps even from a particular node down?