Performance

When we refer to the performance of a mobile application, especially one that is not written in the native language, what we are most often talking about is framerate. It is generally accepted that the human eye can process up to 60 still frames per second (fps). When a series of images is displayed at or above this upper limit, we perceive it as motion instead of discreet images. With this in mind, our goal when optimizing the performance of an application is to ensure that the framerate never or rarely dips below 60 fps.

The practical implications of this requirement are that any blocking computation must complete within 16.67 milliseconds (1,000 milliseconds per 60 fps). Whenever we do something computationally expensive, for instance, rendering a new scene with many child components, there is a risk that the task will not complete in the allotted time. When this happens, we will drop a frame and the user will experience jitteriness or unresponsiveness as a result.

In React...