Ionic 2 speed up boot time?


#1

Boot time is something i see hasn’t improved even with webpack, Angular 2 and ionic 2 versions, i have tested ionic 1 and 2 sidemenu starters and the difference is of 2 secs in favor of Ionic 1, ionic 1 boot time is 3 sec while ionic 2 boot time is 5 secs, not so big of a deal, but when it comes to a more complex app, that time doubles for ionic 2.

My app has some complicated stuff, SplashScreen plugin, SqlStorage database usage, Charts with ng2-charts and a few other small things, i think all those add up to the boot time, and that is probably the reason why my Ionic 2 app that is supposed to be faster than Ionic 1 takes up to 9-10 secs to boot, that’s too long, it shouldn’t be that slow, is there a way to speed up boot time?, maybe using webpack feature to make chunks of the code instead of 1 bundle file with all JS code inside it?


Ionic 2 RC - Any update on startup time?
Ionic 2 - App opening really slow
#2

So things like boot time, overall performance are all things that are being worked on between ionic2 and angular2. It’s something that Angular 2 is focusing a lot on now, so expect to see this improve as NG2 get’s closer to a final release form. The price we pay for using beta software :smile:


Blank screen for 7-8 sec before home page
Blank screen for 7-8 sec before home page
#3

That’s what i wanted to know. I was just measuring boot time on Cordova apps and figured that Ionic 1 is really slowing down boot of Cordova apps. Was hoping Ionic and Angular 2 would make this better, but as mike says that’s not realistic for beta versions.
But i think you are doing something wrong, 9-10 seconds is unrealistic. I have much more complex apps with bunch of plugins and its taking half of that.


#4

Hi @luchillo17,

I know it is not related to your problem but I have a question for you about the SplashScreen plugin. Do you use ionic-native to use it or you use it directly with window.something?

I saw that plugin is in the ionic-native source code, but when I try to import it, it does not show up and don’t know how to add it manually (same thing for globalization)

If you can help me, it would be great! :slight_smile:
Thanks


#5

@mladen5 How’s that? what’s your ionic info output? are you using webpack?

PD: My app starts very fast, but it stucks at the splash screen for like 9 secs, the splash screen shows up almost instantly.


#6

@icarus_31 I’m using it directly from the window namespace, sorry i can’t help.


#7

No i am not using webpack, not even minimizing files.
There is a chance you have set splashscreen delay.
There is option in config.xml check that you don’t have it set to 9 sec or something like that.
<preference name="SplashScreenDelay" value="3000"/>


#8

I have splash screen delay to 10000 which means 10 sec, however that it’s not the issue, without it the splash last 3 secs, half a sec to dissapear but then it just shows 6.5 secs of white screen.

Also the plugin itself cares about hiding the splash screen when needed by default, so the issue is still about the loading time:


#9

The first thing i would try is to remove all plugins and then add one by one and test load times.


#10

I don’t want to touch that thing about plugins again but i guess i have no option, however i will do it when i have more time.


#11

@mladen5 Can you post details of your testing environment? I’m also worried about boot time; is 9 seconds really unrealistic?

right now vanilla sidemenu (ionic start sidemenu --ts --v2) is taking around 7 seconds to boot up in a clean CM13 Nexus 4 (both debug and release builds)

@mhartington any chance you could share some benchmarks regarding boot time so we can adjust our expectations and check if there’s some problems in our env?


#12

Nexus 4 is a little old but vanilla Ionic v1 app is starting in max 4 seconds on some Huawei budget phone. As for Ionic v2 i don’t know.


#13

yeah, I get around 4 secs in v1 too.


#14

So this is something I have already stated.

This still holds true. Both Angular and Us are working on fine tuning that start-up time and performance. 7 seconds though does sound like a lot, though I don’t know how much of that is related to the device or the OS.


Blank screen for 7-8 sec before home page
#15

About loading time, I did some optimizations and got 417ms loading time.
Look at report https://tools.pingdom.com/#!/DW6Td/http://m.sherpadesk.com/
Good recomendations: http://blog.angular-university.io/how-to-run-angular-2-in-production-today/
Our site is completely on Ionic2 beta.8
http://m.sherpadesk.com/


#16

so you have the same app for web and mobile? how did you manage the templating?


#17

Hey @eugenet i can get an NG2 app under 800ms for first render but my current ionic app takes 2.13 to render properly, how did you applied such optimizations? did you trow ionic’s build system out the window? i’m using Webpack to bundle but still there’s some things i would like to remove, like the fact that the gulpfile of ionic copies the es6-shim, reflect and zone.js libs by itself.

Also my app takes 2.13s in web but in mobile takes almost 10s, i think it’s because mobile cpu speed and all plugins needed, as well as the time the crosswalk webview takes to boot.


#18

By default ionic 2 ships with gulp right? Can anyone share their webpack configuration?


#19

yea, sure, same site.
To prevent mobile be jerky, I use gulp-angular-embed-templates npm to embed all templates in .ts files
so after app loaded, no extra server request made.


#20

can you please paste me your gulpfile.js i want to see where you added .pipe(embedTemplates({sourceType:'ts'}))

thanks