Ionic App takes too long to start

Ionic Framework ionic-v3
1

How to reduce app load time in ionic2 ios app?
It takes 16 sec. to initialize the app.

2

Have you build your app with --prod?

Like:

ionic cordova build ios --prod

– prod = plz ionic optimize and shrink my code to allow my app to be loaded faster

3

Do you have any logs to indicate what’s taking time? Have you looked at component lazy loading?

4

After using --prod my app takes 16sec to load.

5

Yes i have Log from my xcode when i’m running my app in device after building it from terminal.

2017-07-10 12:50:55.195 BenzineKostern[202:8142] DiskCookieStorage changing policy from 2 to 0, cookie file: file:///private/var/mobile/Containers/Data/Application/451168A2-645B-4F9B-96C5-E81A20886CD7/Library/Cookies/Cookies.binarycookies
2017-07-10 12:50:57.962 BenzineKostern[202:8142] Apache Cordova native platform version 4.4.0 is starting.
2017-07-10 12:50:57.965 BenzineKostern[202:8142] Multi-tasking -> Device: YES, App: YES
2017-07-10 12:50:58.250 BenzineKostern[202:8142] Using UIWebView
2017-07-10 12:50:58.258 BenzineKostern[202:8142] [CDVTimer][handleopenurl] 0.675976ms
2017-07-10 12:50:58.273 BenzineKostern[202:8142] Unlimited access to network resources
2017-07-10 12:50:58.274 BenzineKostern[202:8142] [CDVTimer][intentandnavigationfilter] 15.762985ms
2017-07-10 12:50:58.275 BenzineKostern[202:8142] [CDVTimer][gesturehandler] 0.419021ms
2017-07-10 12:50:58.278 BenzineKostern[202:8142] [CDVTimer][admob] 2.825975ms
2017-07-10 12:50:58.377 BenzineKostern[202:8142] [CDVTimer][splashscreen] 98.049998ms
2017-07-10 12:50:58.412 BenzineKostern[202:8142] [CDVTimer][statusbar] 34.932971ms
2017-07-10 12:50:58.428 BenzineKostern[202:8142] [CDVTimer][keyboard] 14.663994ms
2017-07-10 12:50:58.428 BenzineKostern[202:8142] [CDVTimer][TotalPluginStartup] 171.472967ms
2017-07-10 12:50:59.563 BenzineKostern[202:8142] Resetting plugins due to page load.
2017-07-10 12:51:00.582 BenzineKostern[202:8142] THREAD WARNING: [‘Device’] took ‘12.613037’ ms. Plugin should use a background thread.
2017-07-10 12:51:16.051 BenzineKostern[202:8267] CFNetwork SSLHandshake failed (-9806)
2017-07-10 12:51:17.474 BenzineKostern[202:8142] deviceready has not fired after 5 seconds.
2017-07-10 12:51:17.475 BenzineKostern[202:8142] Channel not fired: onDOMContentLoaded
2017-07-10 12:51:17.476 BenzineKostern[202:8142] WARN: Ionic Native: deviceready did not fire within 5000ms. This can happen when plugins are in an inconsistent state. Try removing plugins from plugins/ and reinstalling them.
2017-07-10 12:51:17.476 BenzineKostern[202:8142] Ionic Native: deviceready event fired after 13684 ms
2017-07-10 12:51:19.834 BenzineKostern[202:8142] Finished load of: file:///var/containers/Bundle/Application/32C51F6B-643C-440E-84FE-73A952E22DFB/BenzineKostern.app/www/index.html
2017-07-10 12:51:19.867 BenzineKostern[202:8142] THREAD WARNING: [‘Keyboard’] took ‘18.012939’ ms. Plugin should use a background thread.
2017-07-10 12:51:20.008 BenzineKostern[202:8142] THREAD WARNING: [‘StatusBar’] took ‘137.495850’ ms. Plugin should use a background thread.
2017-07-10 12:51:20.019 BenzineKostern[202:8142] createBanner
2017-07-10 12:51:22.757 BenzineKostern[202:8276] To get test ads on this device, call: request.testDevices = @[ @“18eb32d77e925f20209d35acc9149639” ];
2017-07-10 12:51:23.233 BenzineKostern[202:8142] showBanner
2017-07-10 12:51:23.238 BenzineKostern[202:8142] statusbar offset:20.000000, overlap:0, ad position:8, x:0, y:0
2017-07-10 12:51:23.271 BenzineKostern[202:8142] window, resize,
2017-07-10 12:51:23.277 BenzineKostern[202:8142] THREAD WARNING: [‘AdMob’] took ‘44.109619’ ms. Plugin should use a background thread.

7

Which native plugins are you using in this app ? Which ones are you loading in the app.module ?

1 Like
8

I’m using AdMob to load the banner ads in my app.
other then that i’m using default plugins.
My plugins are listed below:
“cordova-plugin-admobpro” spec="^2.29.21"
“cordova-plugin-console” spec="^1.0.5"
“cordova-plugin-device” spec="^1.1.4"
“cordova-plugin-splashscreen” spec="^4.0.3"
“cordova-plugin-statusbar” spec="^2.2.2"
“cordova-plugin-whitelist” spec="^1.3.1"
“cordova-plugin-x-toast” spec="^2.6.0"
“ionic-plugin-keyboard” spec="^2.2.1"

9

This doesn’t look too good and sounds like it could block stuff.

10

Can you suggest me sollution for it?

11

Try a different device, see if it has the same problem.
Try on an emulator, see if same problem.
Try to debug the problem, google for the error message etc.

12

I have already done that, when i build it again the problem of CFNetwork SSLHandshake failed was resolved.

13

slow startup also resolved?

14

nopp it’s still take too long to load.

15

Try
ionic build android --prod --release

16

Following command solved my problem:

ionic cordova build ios --prod --aot --minifyjs --minifycss --optimizejs

now it takes only 3-4 sec to start.

4 Likes
17

is not needed as it is alread included in --prod.

4 Likes
18

You should additionally change your main.ts to the following

import {platformBrowserDynamic} from “@angular/platform-browser-dynamic”;
import {enableProdMode} from “@angular/core”;
import {AppModule} from “./app.module”;
enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule);

To enable prod mode. Will give you a nice boost :slight_smile:

19

No, this is done automatically with --prod as well. No need for manual code changes.

3 Likes
20

u mean we need not use this in main.ts enableProdMode(); ?? is this included when build with --prod ?, pls clear

21

Yes, this is done automatically. You can check yourself: When it isn’t called you get a console.log on app startup. Build with --prod and you won’t get that.

1 Like