White screen appears after splash screen before app loads

Ionic Framework Ionic Angular
1

I am migrating my Ionic 5/Angular 12 project from Cordova from Capacitor and I am running into an issue with a few of my plugins when the app is starting up.

In my app.component.ts file, I initialize my app in the constructor:

constructor(
    private platform: Platform,
    private ga: GoogleAnalytics,
    private oneSignal: OneSignal,
  ) {
    this.initializeApp();
  }

initializeApp() {
    this.platform.ready().then(async () => {

      this.initializeOneSignal();
      this.initializeGoogleAnalytics();

      setTimeout(() => {
        StatusBar.setStyle({ 
          style: Style.Light 
        });
        SplashScreen.hide();
      }, 2000);

    });
  }

initializeGoogleAnalytics() {
    this.ga.startTrackerWithId(environment.googleAnalyticsId).then(() => {
      this.ga.debugMode();
      this.ga.setAllowIDFACollection(false);
    }).catch(e => console.log("Error starting GoogleAnayltics", e));
  }

  initializeOneSignal() {
    this.oneSignal.startInit(environment.oneSignalAppId);
    this.oneSignal.inFocusDisplaying(this.oneSignal.OSInFocusDisplayOption.Notification);
    this.oneSignal.endInit();
  }

I am unable to figure out what is causing the white screen to appear for a few seconds before the app loads.

I am using the SplashScreen and StatusBar from Capacitor 3 and OneSignal and GoogleAnalytics from the ionic-native wrapper for cordova plugins.

Any thoughts as to what from my logic may be causing the delay?

2

Hey @yellowkicks

build your app with PROD. if you make production build then white screen is not appear after splash screen.