Reduce boot time in ionic-2 app

Question

I am new to ionic-2 project.I just want to know how to reduce boot time of app.Because after 3 sec of splash screen , it shows white screen and takes 9 sec to start.

Answer 1

I had a very similar issue with the white screen, check out the progress here. Cordova, Android, incredibly slow loading

Short version is; it's loading slow due to a plethora of reasons, mentioned by Fernando above. You can work to resolve those yes, but for the white screen... Android will hide the splash screen while the app is still loading. To fix that problem you can add the below to your config;

<preference name="AutoHideSplashScreen" value="false" />
<preference name="SplashScreenDelay" value="10000"/>

This will ensure the splash screen remains up for at least 10 seconds while the app is loading, and not auto-hide. Then in your startup module's main component just make sure you have the below to hide the splash screen once your app actually starts up and you'll be all set. obviously requires cordova-splash-screen plugin which ships default with ionic2.

platform.ready().then(() => {
  Splashscreen.hide();
});

Answer 2

Please enable production mode in the main.ts file, like this

import {enableProdMode} from '@angular/core';
enableProdMode();

Answer 3

Please follow below steps to reduce splash screen time:-

First, delete your node_modules folder Delete any Temp Folder Delete Plugins Folder remove platform android using ionic platform rm android. Now Reinstall Everything : -

(i) npm install (ii) ionic serve (iii) ionic platform add android

Now run this Command FINALLY ionic build android --prod

THIS WORKS 100% PERFECTLY.

If this doesn't work please don't give up. Try above steps 2 to 3 times, I'm SURE this will work.

Answer 4

Even I had the same problem. After revering ionic-team forum, I understand that ionic-team has not yet come up with any solution to this.

I made the following code which minimizes the app instead of closing it, so that when next time the app is opened it opens instantly.

Put the below code in app.component.ts file

this.platform.registerBackButtonAction(() => {
        if(this.menuCtrl.isOpen()){
           this.menuCtrl.close();
        } 
        else if(this.nav.canGoBack()){
          this.nav.pop();
        }else{
          this.appMinimize.minimize();
        }
      });

You may need to install @ionic-native/app-minimize

links to refer:

https://ionicframework.com/docs/api/platform/Platform/#registerBackButtonAction https://ionicframework.com/docs/native/app-minimize/

Answer 5

Try to put this on the second line of your main.ts file

import { enableProdMode } from '@angular/core';

then before the bootstrap line put

enableProdMode();

also when building use --prod so ionic build android --prod