Cordova dev build - slow boot (15s)

This Ionic 3 app (see package.json below) has been building properly so far. After having trouble with the IonicPro not redeploying my app, I decided to remove all Cordova integration and set it up from scratch (config.xml, package.json, node_modules, code references, folders, etc.)

What didn’t change:

  • building still works
  • The prod package is still starting very quickly - which is good (<3 seconds of splash screen, 20 page app, apk ~15MB).

What changed:

  • the dev .apk used to boot immediately after the splash screen displayed for ~3 seconds (which was good)
  • The dev .apk now shows a white screen for 10-15s after the spash screen is gone (splash screen lasts the same 3 seconds as before).

It’s dev, so it’s not a big deal - BUT that means I’m missing something that might be an issue later. Posting here with the hopes that anyone has faced this before…

What I’ve attempted so far with no improvement:

  • remove cordova fro project and start over, again.
  • followed some indications from the topic: Help with Ionic app Slow startup :
  • uninstall node.js, delete ~\AppData\Roaming\npm & npm-cache
  • reinstall node.js, ionic, cordova, native-run, etc.
  • remove node_modules & cordova again
  • re-try, no improvement.
  • create a new template project from scratch using CLI, dev build for android, adb deploy and it boots immediately after splash screen - no delay. It seems linked to my project and I’m 130% sure that a dev build used to boot immediately after the splash screen.

Connecting the debugger (chrome://inspect):

  • notice the long delay between keyboard.js was loaded and the next step. That’s where the “white screen” appears.
  • I notice now a warning about “inconsistent states” as being a potential issue. I’ve disregarded this since the prod build doesn’t have the issue.

image

What else should I try? Thanks in advance for your ideas :slight_smile:

config.xml


<?xml version='1.0' encoding='utf-8'?>
<widget id="..." version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>Mood Companion</name>
    <description>...</description>
    <content src="index.html" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <preference name="phonegap-version" value="cli-8.0.0" />
    <preference name="orientation" value="portrait" />
    <preference name="ScrollEnabled" value="false" />
    <preference name="android-minSdkVersion" value="19" />
    <preference name="BackupWebStorage" value="none" />
    <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" />
    <platform name="android">
        <allow-intent href="market:*" />
        ... icons & splash...
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
               ... icons & splash...
    </platform>
    <allow-navigation href="http://172.26.194.76:8100" />
    <plugin name="cordova-plugin-whitelist" spec="^1.3.3" />
    <plugin name="cordova-plugin-device" spec="^2.0.2" />
    <plugin name="cordova-plugin-splashscreen" spec="^5.0.2" />
    <plugin name="cordova-plugin-ionic-webview" spec="^2.0.3" />
    <plugin name="cordova-plugin-ionic-keyboard" spec="^2.1.2" />
    <plugin name="cordova-plugin-statusbar" spec="^2.4.2" />
    <engine name="browser" spec="5.0.4" />
    <engine name="android" spec="7.0.0" />
    <engine name="ios" spec="4.5.5" />
</widget>

Package.json contents

  "dependencies": {
    "@angular/animations": "5.2.11",
    "@angular/cdk": "^5.1.0",
    "@angular/common": "5.2.11",
    "@angular/compiler": "5.2.11",
    "@angular/compiler-cli": "5.2.11",
    "@angular/core": "5.2.11",
    "@angular/fire": "^5.2.1",
    "@angular/flex-layout": "^5.0.0-beta.15",
    "@angular/forms": "5.2.11",
    "@angular/http": "5.2.11",
    "@angular/platform-browser": "5.2.11",
    "@angular/platform-browser-dynamic": "5.2.11",
    "@ionic-native/core": "~4.11.0",
    "@ionic-native/splash-screen": "~4.11.0",
    "@ionic-native/status-bar": "~4.11.0",
    "@ionic/pro": "^2.0.3",
    "@ionic/storage": "^2.2.0",
    "@ngrx/effects": "^5.2.0",
    "@ngrx/store": "^5.2.0",
    "@ngrx/store-devtools": "^5.2.0",
    "@types/cordova": "0.0.34",
    "cordova-android": "^8.0.0",
    "cordova-browser": "^6.0.0",
    "cordova-ios": "^5.0.1",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-file": "^6.0.2",
    "cordova-plugin-file-transfer": "^1.7.1",
    "cordova-plugin-ionic": "^5.3.1",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^2.5.1",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "firebase": "^6.2.4",
    "firebase-admin": "^8.2.0",
    "firebase-functions": "^3.1.0",
    "ionic-angular": "3.9.2",
    "ionic2-auto-complete": "^1.6.2-alpha",
    "ionicons": "3.0.0",
    "ng2-nvd3": "^2.0.0",
    "ngx-perfect-scrollbar": "^5.3.5",
    "rxjs": "6.2.0",
    "rxjs-compat": "6.2.0",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.26"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.1.11",
    "chalk": "^2.4.1",
    "gulp": "^3.9.1",
    "gulp-watch": "^5.0.0",
    "node-firestore-import-export": "^0.9.0",
    "redux-devtools-extension": "^2.13.2",
    "through2": "^2.0.3",
    "tslint": "^5.11.0",
    "typescript": "2.8.4"
  },
  "cordova": {
    "plugins": {
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {
        "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
      },
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-ionic": {},
      "cordova-plugin-whitelist": {}
    },
    "platforms": [
      "browser",
      "android",
      "ios"
    ]
  }

** ionic info **

Ionic:

   Ionic CLI          : 5.2.3 (C:\Users\jem\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.1.11

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.0.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.1, (and 4 other plugins)

Utility:

   cordova-res : 0.6.0
   native-run  : 0.2.8

System:

   Android SDK Tools : 26.1.1 (C:\NVPACK\android-sdk-windows)
   NodeJS            : v10.16.0 (C:\Program Files\nodejs\node.exe)
   npm               : 6.9.0
   OS                : Windows 10

Given this project is complete and ready to be shipped after its (hopefully) last update, I won’t spend more time investigating. It’s an Ionic V3 project and its most up-to-date compatible dependencies are already showing warnings.

Having started a new Ionic V4 project this week, I’ll monitor the boot time in dev. Cheers - long live Ionic :wink: