Hands-On Design Patterns with React Native

Measuring FPS

Websites and mobile applications use animations pretty rarely. Most of the time, it's in response to user actions that tend to be slow. If you've ever played a dynamic computer game, you probably remember what a different world it is. Yes, as we dive into animations, there is one thing from computer games that you should remember: FPS.

Frames per second – everything on the screen appears in motion thanks to the optical illusion created by quickly changing frames at a consistent speed. 60 FPS means 60 frames per second, which means you see a new frame every 16.67ms. JavaScript needs to deliver that frame in this short period, otherwise the frame will be dropped. If so, your FPS metric will drop below 60.

React Native is known ...