1

I am making a react native application which has many screens.So what i am doing is that in app.js file i returned a file named AppNavigator.js in return method.In AppNavigator file i have imported more than 25 screens and all are used in some navigators.I mean that my application includes 6 naviagtor and they are stacknavigator and drawer navigator.I have one stack navigator as primary because it is starting point for my application.That stack has initial Screen as splash screen.But when i start application then splash screen loads after taking too much time.So my question is does including too many imports in same file slows the application? If yes then how can i keep all the navigators in the project structure.I am new to react native development so make my concepts clear.

Abhi Singh
  • 207
  • 6
  • 15

2 Answers2

2

Well, importing those screens are necessary for navigator to work.

but I must tell you that you have used only 25 screen. There are RN apps having over 100 screens.

Personally, I have worked in a project that had 30+ screens into single stack navigator, so this can't be your issue.

because at final they are going to bundle into one single file i.e. index.android.bundle. so it doesn't matter where you have written your file and where you are importing it is going to bundle into index.android.bundle.

Yes, it will have effect on performance but not much that you can see with your bare eyes.

So, here problem can be

  1. debug mode.

    try running it in production mode(open dev menu -> dev settings -> disable JS Dev mode)

    or

    generate released signed app

  2. white screen before splash for a second

    this can be solution

Jaydeep Galani
  • 4,842
  • 3
  • 27
  • 47
0

You can try following: - If you're currently on testing mode and if you're debugging js remotely try stopping that first and check the performance.

  • Uninstall the app and run following command

    cd (path to project/android folder) && gradlew clean && cd (path to project root folder) && react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-android

the above command will clean all the last builds & clean and clear all the cache and the give new build.

You're good to go!

Akshay Mulgavkar
  • 1,727
  • 9
  • 22