Initial Page Load


Hi Guys!

Is there a way to show a progress bar until meteor app has been fully loaded. It’s not good to have a white screen for 15 seconds. Instead of that the user should see a progress bar. Is there a clever way doing that?



I presume you mean after launch image has gone away.

Adding a <body>...</body> tag will to an html file in your /client folder:

  1. Make the launch image go away sooner
  2. Allow you to put js logic on the body before the full app has loaded by using Template.body.onCreated and Template.body.helpers in a .js file in your /client folder, which you can use to build a loading bar.

I’m playing with this right now in my app. I have some stutters towards the end, but a very helpful indicator still. I don’t know a way to get a real loaded percentage, I just use a time based guesstimate with parabolic easing.

Also it seems for me the initial loading time is about 18 seconds similar to what you say (Nexus 5). However after that it looks like some app data is cached / stored (~30MB) and the app then only takes about 6 seconds to load (ready pretty much soon as the launch image disappears). So really all this effort is for the first launch only (it’s important to me, your call if it’s important enough to you).


Are you using Meteor, Blaze and Cordova in your app?


@fcaldas - Yes I’m running Meteor, Blaze, and Cordova. Though the first and I think last are implicit.


I am using Blaze and Meteor version 1.2.1. In my case it’s a browser app. I tried running with meteor run --production.
And now the whole app renders within 4 seconds. Awesome!