Frustration: Is there any resolution on slow build / live update for ionic serve?


#1

So I’ve been looking around the forum and see that others are having issues with slow live update / build while making even the smallest html or other changes during development.

For me, it’s getting to a very frustrating point.

  • I’ve changed my package.json scripts section to include the –dev parameter on build
  • I’ve upated my ionic app scripts with npm install @ionic/app-scripts@latest

Even a minimal starter project can take anywhere between 12s - 50s to build / live update with the smallest change, as shown below.

Does anyone have any other insights?

$ ionic serve
TestApp@ ionic:serve X:\MobileProjects\TestApp
ionic-app-scripts serve “–v2” “–address” “0.0.0.0” “–port” “8100” “–livereload-port” “35729”

[12:01:14] ionic-app-scripts 1.0.1
[12:01:14] watch started …
[12:01:14] build dev started …
[12:01:14] preprocess started …
[12:01:14] preprocess finished in 16 ms
[12:01:14] clean started …
[12:01:14] clean finished in 15 ms
[12:01:14] copy started …
[12:01:14] transpile started …
[12:01:23] transpile finished in 9.60 s
[12:01:23] webpack started …
[12:01:24] copy finished in 10.30 s
[12:01:47] webpack finished in 23.11 s
[12:01:47] sass started …
[12:01:53] sass finished in 6.25 s
[12:01:53] lint started …
[12:01:53] postprocess started …
[12:01:53] postprocess finished in less than 1 ms
[12:01:53] build dev finished in 39.09 s
[12:01:53] watch ready in 39.45 s
[12:01:53] dev server running: http://localhost:8100/

[12:02:03] lint finished in 10.44 s
[12:02:17] build started …
[12:02:17] transpile started …
[12:02:27] transpile finished in 9.62 s
[12:02:27] webpack update started …
[12:02:30] webpack update finished in 3.13 s
[12:02:30] build finished in 12.77 s

[12:02:53] build started …
[12:02:53] transpile started …
[12:03:03] transpile finished in 10.01 s
[12:03:03] webpack update started …
[12:03:16] webpack update finished in 12.52 s
[12:03:16] build finished in 22.57 s


#2

Hello Brad, I guess it’s probably related to your environment, packages or app?
I use ionic serve on Windows (which should be slower than linux or ios), and nothing goes so long.

As everything is packed with DevTools now, maybe checking the timeline in Chrome will help you debug?


#3

Salut Francois,

Merci pour la réponse. As you suggested, I took a look at the timeline but it hasn’t been too much help unfortunately. I’ve noticed that even without the browser window open (therefore no live preview required), and I change even 1 character of code and save it, the compile time is minumum 12+ seconds and can go up to 30+ seconds. I guess I’m going to have to look directly into the compile / watch scripts to see what’s happening.


#4

Hi Brad,

I’ve exacly the same issue and indeed it is very furstrating. Have any new insights?
Here are the infos from my CLI:
Cordova CLI: 6.5.0
Ionic Framework Version: 2.0.0
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 7
Node Version: v6.7.0
Xcode version: Not installed


#5

I investigated the build process in more detail and found that the webpack update (until the new main.js build) only takes 2-4 sec. But than it takes another 10 sec. until the build finishes

Even in debug mode only one further line of info is emitted. What happens after the webpack update has finished?

PS: Normally a worker thread for linting is also started inbetween, but i disabled this by setting the env-variable IONIC_ENABLE_LINT=false


#6

I did some further investigation which I put into this issue:


#7

Rudolf,

Thank you for all the time you took in investigating and responding to this issue, both here and on github. I started to investigate and ended up having to go out of town on business - and then I come back to see that you were on the case. Great job and thanks again for helping out.

If you ever need help with anything on a project let me know - I’ll be happy to return the favour.

~ Brad


#8

Hello Brad and Rudolf,

To give an update, I hope it will help.

I’ve done more tests with Ionic2 and Ionic Cloud, but the build time is OK for me (I begin to have somehting close to a beta app with CRUD, aka 10 pages and consistent services with Auth, DB on Ionic Cloud).

But what you show like taking 500 MB for one build is nothing like I saw. Do you use cordova compatiliby plugin ? (the one to be more compatible with any downside version?)


#9

I’m not currently using the cordova compatibility plugin so I can’t really compare. When you say 500 MB for one build, you mean for all the sources and scripts, and not the final build folder, correct?


#10

No, a final build (even not in production mode) should make around 20-50 Mb tops. I was just worried your 500Mb quote. But for reference, Snapchat takes 160Mb on my Android phone, so don’t be shy with size either.


#11

Hmm… interesting - I didn’t say anything in my posts about 500 MB. Maybe you are referring to rudolf’s image displaying free memory during the build process?


#12

Yes BradBurns, sorry i mixed up posts :confused:


#13

No problem, it happens. :slight_smile:


#14

My bad sorry - but by the way I hope to learn a lot with the forum, this langague is just awesome :wink:


#15

Any update?
I’m having the same problem.


#16

Unfortunately I don’t have any resolution to the issues I was having. I did get much better compilation speed and responsiveness when moving to Ionic CLI 3 Beta 4, which would be totally your decision if you want to go in that direction.


#17

Any news on this front? O have terrible build time on Windows.

Os: Windows 10 64bits
CPU: Intel® Core™ i5 Processor 2410M
RAM: 8Gb
Ionic 3.3.0 Start sidemenu (without modifications)
Node: 6.11.0
Cordova: 7.0.1

[17:42:59] watch started …
[17:42:59] build dev started …
[17:42:59] clean started …
[17:42:59] clean finished in 120 ms
[17:42:59] copy started …
[17:42:59] transpile started …
[17:43:12] transpile finished in 13.22 s
[17:43:12] preprocess started …
[17:43:12] deeplinks started …
[17:43:12] deeplinks finished in 234 ms
[17:43:12] preprocess finished in 250 ms
[17:43:12] webpack started …
[17:43:14] copy finished in 14.55 s
[17:43:57] webpack finished in 44.80 s
[17:43:57] sass started …
[17:44:03] sass finished in 5.31 s
[17:44:03] postprocess started …
[17:44:03] postprocess finished in 39 ms
[17:44:03] lint started …
[17:44:03] build dev finished in 64.01 s
[17:44:03] watch ready in 64.56 s
[17:44:03] dev server running: http://localhost:8100/


#18

I also wanna bump this and mention it takes ~10 seconds for me to update a change on Windows.

Anyone got any fix?


#19

Ionic app-script 2.0.1 was released, should improve build and reload while doing ionic serve

Pay attention: if you upgrade from app-scripts < 2.0.0, don’t miss the changes described in changelog


#20

My builds went from ~15s to <5s (on consecutive builds) ith app-scripts 2.x :thumbsup: