CODEWITHSUNDEEP
angularionic-framework
Torben G
Torben G

Reputation: 790

Ionic App has bad performance and is slow

I have an Ionic3 App with Angular and i know it is not a native App like pure Android or Swift. But the performance is very poor. I have only a blank projekt but if i start it, I got a black screen for 1-2 seconds and a splash/white screen for 5-8 seconds.

I tried to add lazy loading to the pages and components but it is bad too. If you click on a Tab it will freeze for 1 seconds until the lazy loaded page will be open.

Is this normal? Can I reduce the loading time?

Upvotes: 1

Views: 11633

Answers (2)

Karthik
Karthik

Reputation: 1131

There may be a problem with your preferences as well. Please try change them in your config as follows.

<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />

In app.component.ts

platform.ready().then(() => {
  // Okay, so the platform is ready and our plugins are available.
  // Here you can do any higher level native things you might need.

  // statusBar.styleDefault();
  statusBar.styleLightContent();
  statusBar.backgroundColorByHexString('B27F16');

  setTimeout(() => {
    splashScreen.hide();
  }, 100);
});

Upvotes: 0

David Dal Busco
David Dal Busco

Reputation: 8652

First of all the boot time will/should be better with Ionic v4 because their will use web components

Secondly, about your build time, if you want to improve it the first out of box thing to do is to perform your build with --prod in order to tells ionic-app-scripts to apply methods (like minification) to your code in order to reduce the bundle size (smaller bundle size = faster boot)

ionic cordova build ios/android --prod

also you should check your config.xml to see what are the parameters of your Cordova splashscreen. ensure that you didn't set a long delay which gave you the feeling that the app takes time to boot where actually the app is loaded behind the splash screen

finally there is also work to do on your side because like I said above, the bundle size matter. but it's also about fonts, images etc. less the better. for example you could check your code to find out what you really use and also go thru your libs to be sure that you only include what you need (for example, if you use rxjs, only import lettable operators and not the all lib). If interested I compiled some inputs in that post on the Ionic forum regarding this subject https://forum.ionicframework.com/t/app-boot-time-current-state-and-best-practices

p.s.: Ionic v3 performance are good and boot time could be acceptable/good. My app is approx. 40 pages, 60 components, too much plugins etc. boots in 2.5 seconds on an iPhone 6s

Upvotes: 3

Related Questions