Ionic TOO SLOW ! Should we move back to Ionic 1 or React?

Ionic Framework ionic-v3
1

I have created apps using both Ionic 1 and 2. While I never had any problem with speed using Ionic 1, It has become too slow with Ionic 2 !!
Is it normal ? I just tested using the tutorial startup app also, deployed it to my device and it hangs for at least 15 seconds after showing the splash screen and before showing the home screen!

I did not change anything to the config.xml file. I am using the ionic 2 super template.

1 Like
2

Make sure you’re building for production (–prod flag) and that Angular is in production mode. My app startup is 3 seconds and I think I can get it down further. Implement lazy loading.

3

Agree with what @AaronSterling said, and to add onto it, the super template isn’t optimized at all as it’s simply a way to show off lots of stuff.

4

I am doing cordova build android --release . It builds for the production by default, right ?

5

It does not. You’ll need to do cordova build android --prod --release.

1 Like
6

Sure. I will do it and test it in the evening. Hope it speeds up.

7

I tested with --prod --release. It does reduces the loading time a bit, But the issue still persists. Even when I created a blank Ionic 2 app, installed it on the device and it takes 10 seconds to load !

8

my app open in 4 secs, run ionic cordova build android --prod

9

But my Ionic 1 app opens up in 2 seconds. Dont what went wrong with Ionic 2.

10

normally ionic 2 apps are slower than ionic 1, there are many js files and css extra with ionic2, you can lazy load all ur pages, it will open ur app faster

11

Thank you. Will try lazy loading. But will it be fixed in the next version of Ionic ? I hope so. Ionic is a beautiful framework, Don’t want to abandon it.

12

Just thinking out loud: could the problem maybe be with your own code.
Maybe you have too much stuff in the platform.ready method that is executed before the real UI is being shown.

2 Likes
13

I tested even with the blank starter app on my device

14

2 questions:

  1. What device do you use for testing (+ Android version)
  2. Have you tested this on other devices already with the same results?
15
  1. I use Motorola Moto G4 Plus(7.0 (Nougat)
  2. I have not tested the blank app on other devices, But have tested my app thats on google play, with the same result
16

I have been working with Android for a while and currently use the latest version. I don’t have any such problem.

17

#How to build your app for prod and things to do to get better performance
Like @AaronSterling says you have two thing to do principally:

  1. Active the production mode (unnecessary cause step 2 wiil do it automatically) thx to @SigmundFroyd
  2. build with the --prod flag
  3. (optional) Use the lazyLoading

How to do 1 (unnecessary cause step 2 wiil do it automatically) thx to @SigmundFroyd

Go to your src/app/main.ts
write these lines:

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

How to do 2

In the console/terminal/bash when you build your app, you’ll need to write that:

ionic cordova build android --prod --release

How to do 3

This is a bit complicated to explain in this forum so i recommended you to watch video or read about the subject.
In breif, it will load only the pages/module needed on the start of your app. (Not all the app)
It’s like a lazyload for image but this is for pages.

Have fun and good luck for your app :grin:

2 Likes
18

Building with the --prod argument will automatically enable production mode in Angular, so step 1 is unnecessary.

3 Likes
19

Not only unnecessary but potentially harmful. App-scripts does lots of magic futzing with main.ts, and therefore it should not be touched at all, lest needless confusion ensue.

1 Like
20

My advice is to build for production using the --prod and --release flags and to also defer the loading of scripts. The use of crosswalk cordova plugin would also allow for uniformity and speed up load time.