My Meteor apps take around 7 seconds to load on mobile, but native apps take 2 or 3 seconds. Is that normal?

mobile
1

I’m currently trying to decide if I should choose Meteor to develop something for web + mobile, but no matter what I try, I can’t get apps to boot below 6 seconds.
I see that all the necessary files get downloaded, and then (probably) JS does some intensive setup to have minimongo or the Meteor stuff ready.

2

Is this using Cordova and which front-end view are you using?

3

It’s a vanilla app, using React.
Even if I create a new project with everything updated, it takes around 7 seconds to boot cold.
The same happens to a friend of mine.
I’m using a Galaxy S8, a mid-range Huawei, an iPhone 6 and a mid-range Blu.
I’ve also tested other people’s apps, loading them from Chrome/Firefox, and Meteor always takes long to boot.

4

I’m using React as well and it loads under a second, son something is off.

Have you run bundle visualizer?

1 Like
5

This site will give you some reasons why your app is slow:

Also check out your Chrome Dev Tools Tabs:

  • Network
  • Performance
  • Lighthouse

Run some tests on you site, and you’ll learn all the reasons quite quickly!

Use Meteor APM to learn about your app server performance.

A light app should load in milliseconds if you optimize.

1 Like
6

I found enabling gzip on my nginx reverse proxy made the biggest difference for load times.
Not sure if you’re using nginx?

This helps because the app bundle can sometimes be a few MB but gzip drops it down to a few hundred kB.

1 Like
7

Yeah, but I think first the bundle size needs to be checked and optimized. React apps can get easily bloated, 6 seconds load probably means a lot of JS code being loaded at startup, so I would like to see the bundle visualizer diagram.

2 Likes
8

@bluray what does your meteor bundle visualizer say about the package sizes?

1 Like
9

Are you sure the splashscreen isn’t just locked? There is a default automatic timeout of 6-7 seconds if you don’t unlock the splashscreen “manually”, eg. after Meteor.startup() and all your initialization-code (subscriptions etc) which you’d like to have ready have been loaded.

If you search for “cordova splashscreen unlock” or somesuch here or on google I’m sure you’ll find something.

10

I’m using the following over-paranoid line:

                if (Meteor.isCordova) {
                    navigator && navigator.splashscreen && navigator.splashscreen.hide && navigator.splashscreen.hide()
                }

(I think it’s a default plugin that allows for the splashscreen unlock).

11

That’s a great tool! For pixstoriplus.com I’m seeing long wait times on the dynamic import end point. That might indicate a need for optimization, or maybe cloud front.

1 Like
12

I’m not using Cordova. Just a new Meteor project testing on mobile (localhost), on several phones.

13

Is this in dev mode (or even locally just using the --production flag)? That’s not representative of deployed performance. Maybe deploy it to a free heroku instance to get a better idea?

Also, if your dev machine is Windows, it’s probably going to be slow…

1 Like
14

Yes, I’m in dev mode using --production, and running Windows. I’ll test in heroku now. Thanks!

15

If you are familiar with Docker, you could also try it to run it that way:

2 Likes
16

Hi, this app www.bemarke.com is a Meteor app.

https://apps.apple.com/br/app/bemarke/id1441947344

I’m doing a live this week about Native apps with Meteor, there I’ll explain how to boot your app faster, spoiler: nested imports and dynamic imports together.

2 Likes
17

Would this apply equally to getting web apps to load faster?