Ionic 2 prod apk 8 secs start up time


#1

Hi All, My prod build apk is taking 8secs (on google nexus 6p) to load on initial start up. can any body please tell me is there any thing i can do boot up faster. Below is my package.json , i am running ionic package with --prod --release flags

“dependencies”: {
"@angular/common": “2.4.8”,
"@angular/compiler": “2.4.8”,
"@angular/compiler-cli": “2.4.8”,
"@angular/core": “2.4.8”,
"@angular/forms": “2.4.8”,
"@angular/http": “2.4.8”,
"@angular/platform-browser": “2.4.8”,
"@angular/platform-browser-dynamic": “2.4.8”,
"@angular/platform-server": “2.4.8”,
"@ionic-native/onesignal": “^3.2.3”,
"@ionic/cloud-angular": “^0.11.0”,
"@ionic/storage": “1.1.6”,
“ionic-angular”: “2.2.0”,
“ionic-native”: “^2.4.1”,
“ionicons”: “3.0.0”,
“jquery”: “3.1.1”,
“rxjs”: “5.0.1”,
“sw-toolbox”: “3.4.0”,
“zone.js”: “0.7.2”
},
“devDependencies”: {
"@ionic/app-scripts": “1.1.4”,
“typescript”: “2.0.9”
},
“description”: “myApp: An Ionic project”,
“cordovaPlugins”: [
“cordova-plugin-device”,
“cordova-plugin-splashscreen”,
“cordova-plugin-statusbar”,
“ionic-plugin-keyboard”,
“cordova-plugin-whitelist”,
“cordova-plugin-inappbrowser”,
{
“id”: “cordova-plugin-facebook4”,
“locator”: “cordova-plugin-facebook4”,
“variables”: {
“APP_ID”: “xxxxxxxxxxxxxxxxxx”,
“APP_NAME”: “xxxxxxxxxxxxxx”
}
},
“cordova-plugin-nativestorage”,
“cordova-plugin-googleplus”,
“cordova-plugin-geolocation”,
“onesignal-cordova-plugin”,
“cordova-plugin-compat”,
{
“locator”: “https://github.com/tomloprod/cordova-plugin-appminimize.git”,
“id”: “cordova-plugin-appminimize”
}
],
“cordovaPlatforms”: [
“android”,
{
“platform”: “android”,
“version”: “”,
“locator”: “android”
},
{
“platform”: “windows”,
“version”: “”,
“locator”: “windows”
}
]


#2

Can you show us your app.compinent.ts?
Maybe you are loading to much things in it


#3

yeah its probably that


#4

below is my app component page

import { Component } from ‘@angular/core’;
import { Platform } from ‘ionic-angular’;
import { ViewChild } from ‘@angular/core’;
import { StatusBar } from ‘ionic-native’;
import { HomePage } from ‘…/pages/home/home’;
import { MyOrdersPage } from ‘…/pages/my-orders/my-orders’;
import { CartPage } from ‘…/pages/cart/cart’;
import { UserPage } from ‘…/pages/user/user’;
import { AboutPage } from ‘…/pages/about/about’;
import { LoginPage } from ‘…/pages/login/login’;
import { CartService } from ‘…/services/cart-service’;
import { OneSignal } from ‘ionic-native’;
import { UserInfo } from ‘./app.module’;
import { SharedDataService } from ‘…/services/sharedDataService’;
declare var window;
@Component({
templateUrl: ‘app.html’,
queries: {
nav: new ViewChild(‘content’)
}
})
export class MyApp {

public userInfo: UserInfo = null;
public url: string = ‘’;
public name: string = ‘xxxxxx’;
public rootPage: any;
public cartItemCount: any = 0;
public nav: any;
public pages = [];
public loggedInPages = [
{
title: ‘Home’,
icon: ‘ios-home-outline’,
count: 0,
component: HomePage
}, {
title: ‘My Cart’,
icon: ‘ios-cart-outline’,
count: this.cartItemCount,
component: CartPage
},
{
title: ‘Profile’,
icon: ‘ios-person-outline’,
count: 0,
component: UserPage
}, {
title: ‘Orders’,
icon: ‘ios-basket-outline’,
count: 0,
component: MyOrdersPage
},
{
title: ‘About us’,
icon: ‘ios-information-circle-outline’,
count: 0,
component: AboutPage
},
{
title: ‘Logout/Login’,
icon: ‘ios-log-out-outline’,
count: 0,
component: LoginPage
} ];

public loggedOutPages = [
{
title: ‘Home’,
icon: ‘ios-home-outline’,
count: 0,
component: HomePage
}, {
title: ‘My Cart’,
icon: ‘ios-cart-outline’,
count: this.cartItemCount,
component: CartPage
},
{
title: ‘About us’,
icon: ‘ios-information-circle-outline’,
count: 0,
component: AboutPage
},
{
title: ‘Logout/Login’,
icon: ‘ios-log-out-outline’,
count: 0,
component: LoginPage
} ];

constructor(public platform: Platform, private cartService: CartService, public _SharedDataService: SharedDataService) {
this.rootPage = HomePage;
this.showPages();

this.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();
  this.initializeApp();
});

}

openPage(page) {
// Reset the content nav to have just this page
// we wouldn’t want the back button to show in this scenario
this.nav.setRoot(page.component);
}
initializeApp() {

this._SharedDataService.UserInfo.subscribe((data) => {
  
  this.userInfo = data;
  this.showPages();
});

OneSignal.startInit('xxxxxxxxxxxx', 'xxxxxxxxxx');
OneSignal.inFocusDisplaying(OneSignal.OSInFocusDisplayOption.Notification);
OneSignal.setSubscription(true);
OneSignal.handleNotificationReceived().subscribe(() => {
  // do something when the notification is received.
});
OneSignal.handleNotificationOpened().subscribe(() => {
  // do something when the notification is opened.
});
OneSignal.endInit();

this.platform.registerBackButtonAction(() => {

  if (!this.nav.canGoBack()) {
    window.plugins.appMinimize.minimize();
  }
  else {
    return this.nav.pop();
  }

});

this.cartService
  .statusChanged.subscribe(data => {
    this.pages[1].count = data.totalCount;


  });

}
showPages() {
if (this.userInfo == null) {
this.pages = this.loggedOutPages;
}
else {
this.pages = this.loggedInPages;
}

}
// view my profile
viewMyProfile() {
this.nav.setRoot(UserPage);
}
}


#5

Solved it,

  1. removed unwanted/ unused plugins
  2. deleted existing android platform and node modules .
  3. updated ionic to latest version.
  4. built locally with --prod and --release flag instead of ionic cloud (this sucks btw).

now my app opens up in 3 secs , but device ready fires in 890ms though ??


#6

I’ve tried this, it did not work in my case. I’m still getting slow load times (20 - 30 seconds) on my iPhone 5. I build it with --prod flag.

Cordova CLI: 6.3.1
Ionic Framework Version: 3.0.1
Ionic CLI Version: 2.2.2
Ionic App Lib Version: 2.2.1
Ionic App Scripts Version: 1.3.0
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: macOS Sierra
Node Version: v6.9.4
Xcode version: Xcode 8.3.1 Build version 8E1000a

What’s odd is that I have an older version of basically the same app and it boots up in 2-3 seconds on the same device. I didn’t have this problem until I upgraded to Ionic v3 and a newer version of the cli.

Update:
For whatever reason - passing the --prod flag in the cli does not work. ex: ionic build ios --prod

But making an edit in the package.json helped: