StackNavigator has performance issues and renders too many screens

[zhaoyi0113]

I am using below version of react-native and react-navigation on Android.

$ react-native --version
react-native-cli: 2.0.1
react-native: 0.39.2

"react-navigation": "^1.0.0-beta.6"

When call navigate(...) method, it usually take 1 second to navigate to the next screen. It has no problem on simulator only happens on Android device. Is there any way to configure it?

[blizzardzheng]

i have the same issue ,is there any solution?

[laalaguer]

We have the same issue here

[zhaoyi0113]

Not sure whether this can be resolved or not? I don't know what the root cause is. The Tab Navigator works perfect only problem is on Stack Navigator.

[laalaguer]

It is because of the "recursive" calling thing. Deeply nested stack navigators are slow in this case. Not sure why it is so obvious on Android.

[zhaoyi0113]

My case is not deeply nested stack. It is slow for the first stack navigator.

[adogor]

Same for me, to reproduce this, just init a new project and make a StackNavigator with 1 screen and a button to navigate to itself. After stacking more than 5 screens it's noticeable (on my Nexus 5 at least), and more you navigate slower it is.

If i enable debugging in chrome I don't have this problem (or at least not before 90 screens ...).

I was unable to find the problem, unfortunately we might have to "use ex-navigation" or another navigator because or app is too slow on Android.

[zhaoyi0113]

Does ex-navigation give better performance on Android? If yes, I am going to have a try on it. Otherwise my app performance can't be accepted by users.

[geekvijay]

i am also facing same problem, its hurting the user experience.

[maurovisintin]

same problem, on android any screen besides the first of the stack has poor performance :(

[nico1510]

I also noticed this so I did some tests in the layout inspector and noticed that the StackNavigator still paints all elements from previous routes. The DrawerNavigator doesn't do this. Following are 2 example screens. The first one is a screen in a DrawerNavigator:

and here the same screen in a StackNavigator:

As you can see there are multiple Views from previous routes present. Is this intentional @satya164 ? If yes, would it be possible to add an option to disable this ? Because it seems multiple people have performance problems. #672 and #608 may be related too.

[xilonxiao]

I'm the guy from the #672 . Although my problem isn't exactly with the transitions, it is probably related. Right now I'm working on other issues on my project, but as I am testing my application on both android device and ios simulator, maybe my experiments can bring some light here. I'll try to do some more tests and post the results here.

[andreialecu]

I'm seeing the same problem.

Additionally, suspending the app and resuming it takes over 5+ seconds to rerender on my Android device when on screen 2 and below (main screen is instant). If I enable the JS perf monitor, I can see that the JS thread drops to 0 fps (sometimes even minus 2, which I'm not sure if is a reporting bug of some sort, or an indication of a more serious problem)

The 0 fps drop usually takes several seconds to correct itself.

In the simulator it seems fine, just the physical device has problems (Android 5.0.1).

Possibly related: The main screen is image heavy, and if I navigate to a secondary screen then suspend the app and resume it while on the secondary screen, then close it - all the images on the main screen are set to blank/white. This might indicate some sort of memory problem possibly caused by #706 (comment)