top of page

Moving Beyond Animations to User Interactions at 60 FPS in React Native

Updated: Jun 17, 2018

What makes a good mobile app become a great app? What are the magical nuances that can set your app apart?

Mobile is all about transitions and smooth animations. We’ve grown to expect that objects no longer just pop up on screen. Views are expected to move around. Fluid animations at 60 FPS used to be a big issue in React Native. The async nature of the React Native bridge incurs an inherent performance penalty, preventing JavaScript code from running at high framerates.

This issue was ultimately resolved using Animated, the excellent animation library that is now part of the core. Now, it’s time to look beyond animations at the next step – dynamic user interactions that mimic reality. Here are some real-life examples from some of our favorite apps in the App Store:

What do these UX examples have in common? They are all physical in nature. The views have velocities that are changing as they’re being dragged and tossed. Notice the nuances, like how the notification panel in iOS bounces from the ground when thrown with enough force.

Can similar UX be implemented at 60 FPS in React Native?

Join Tal Kol for an in-depth discussion of this interesting challenge. Exploring various implementation attempts in React Native and analyzing their performance. See how specific solutions can be generalized as a declarative library – aimed at driving complex physical interactions with just a couple lines of code.


bottom of page