Fixing common performance problems in React Navigation

If you’re using React Navigation in your app(s) you might have noticed these two issues the folks over at November Five have written about:

On a few screens – specifically those with lots of components – we started noticing a few things…

Right off the bat, there is a substantial delay between the user pressing a button and the swipe-in animation of a new screen. When a new screen is pushed, React Navigation will initially render it off-screen and animate it into place afterwards. This means that when a complex screen with lots of components that easily takes a few hundred milliseconds to render is pushed, it feels less snappy than a natively written application. It also causes some nasty side effects: for instance, if you tap a button quickly, you can trigger the same route from being pushed multiple times.

Another problem is that business logic can be executed while the swipe-in animation is doing its thing. This can make for a janky animation.

Of course the post also contains fixes for these problems 😉

Fixing common performance problems in React Navigation →

Elsewhere , ,

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.