Unstable build tool: opinions and what can we expect?

Ionic Framework ionic-v3
1

I’d like to get some general opinions in here to know if I’m the only one going mad with the build tool.

First off, I think Ionic 2 is great! It’s clean, well structured, the navigation is much simpler, typing is great, tooling is great, creating components is easy, providers are simplified, I love it!

…but the build tool… is driving me crazy. It’s too slow and unstable.

I’m the type of person who programs by small iterations. I like to make quick changes, check if it works, continue programming. In Ionic 1, any change I made took 2-3 seconds to get reflected to my browser with “ionic serve”. Now it takes on average about 45 seconds and that’s when it finishes at all. I understand that there is a new layer of “transpiling” (I’m new to typescript so I had to google the term) but the slowness terrible and not the only problem.

Sometimes the build tool will just hang there without refreshing the page in ionic serve (randomly).
Sometimes the build tool will finish, refresh the page and show the old version of the page (randomly).

I’m never sure if I’m looking at the results of my modified code or the old page and when it hangs without refreshing, it’s up to me to decide when it’s been long enough to shut down the process and start it fresh again. I feel like I’m in a constant state of waiting for transpiling/bundling and then wondering if it worked. Since we’re no longer in beta and have even moved to RC1, I would expect this to be stable and only have to worry about my own programming mistakes but now my programming is moving at a glacial pace and I can’t seem to get a clear answer to the following questions:

  1. Why is the build tool randomly hanging?
  2. Why does it sometimes refresh without updating the www with my latest modifications?
  3. When can we expect a stable version of the build tool which allows us to focus only on our code?

This morning I updated to the latest ionic@2.1.4, latest npm and tested creating a new blank project but the issues are the same. The app I’m currently working on has 3 pages and about 100 lines of code. Any changes to the JS currently takes 48 seconds to finish transpiling/bundling/refreshing in ionic serve. Does that make sense for an interpreted language?

The question I’m asking is, can we expect better or is this slowness a permanent downside of using typescript? Can we expect the build tool to speed up significantly and will we ever stop watching the watch tool to make sure it doesn’t go catatonic?

While in dev mode, is there a way we can test more quickly? Disabling optimisation/bundling? Is there a browser which can interpret typescript without having to transpile/bundle it and finally allow us to use breakpoints?

There are many great improvements in Ionic 2 but the build tool is causing me to contemplate going back to Ionic 1 until we get a stable RC. Not being sarcastic, just wondering if I’m the only one who thinks the build tool offsets the advantages of typescript.

2

No. Just as an example, I wrote this project based on the Webpack dev server and it’s a lot faster when rebuilding after a typescript change.

I’m sure ionic serve will get better as well. They basically rewrote the build scripts recently because of Angular 2 AoT template compilation. Feel free to watch issue ionic-app-scripts#47 about the slowness.

3

loki9182 my friend, you are not the only one! I’m working in a project in Brazil with more 3 developers and we’re having the same issues. I’ve tried to write a gulpfile and move back to it but no success :frowning:

4

I second that! With the betas, the build time was a few seconds using ionic serve. With RC0/1, the change to rollup (among others) resulted in build times of 30-60 second. This is not really acceptable and I am strongly looking for a faster dev mode.

5

That’s a great setup Mirkonasato!
I think I will use it to build my components and later on convert it to RC format.
How do you enable console logs?

6

You mean like the --consolelogs option of the Ionic CLI? I usually look at console logs in the Chrome DevTools.

7

You should double check you have the latest app-scripts installed with:

npm install @ionic/app-scripts@latest

Should be at least 0.39, it tells you the version when your run it
[Edit] And I’m making the assumption you are normally using ionic serve to build and test as this is generally the quickest way to see changes, unless your using native plugins on android etc.

8

I’m bouncing back and forth between version of Ionic and different app-scripts. The balance I’m looking for is something that allows me to build in dev relatively quickly (quick reloads when I make changes to html or js) and allows me to see changes quickly but also a version which will allow me to build my stuff with a structure that I won’t have to change much to fit the latest Ionic2 framework. This morning I was contemplating going back to Beta13 but I’m working on a large app so that would mean a lot of conversion when I switch to a stable RC. I don’t know anything about the different proposed build tools (webpack/rollup). I’m one of those users that just wants a list of instructions on installing the framework and then I can get to programming. My project is at near dead stop and I’m burning cash. Not even sure I’ll be able to finish. What’s should I do? I just need my app to progress using fast reloads after changes but I also want the code to stay as close to Ionic2 RCx as possible.

9

Yeah I know the feeling with this, the jump to v2 rc1 is painful but once you have resolve build issues and your app is running you should be good. There will be other updates but the biggest changes code-wise were the angular2 ngmodule and ahead of time compilation, both angular2 things (not ionic things). The switch to rollup was obviously painful too but they’re just trying to help us get the bundle sizes down.

I’d settle on the current versions then finish the app based on that. For reference the avg build time between changes using ionic serve on my laptop is 5-6 seconds, my app has more than 100mb of asset files and thousands of lines of code.

10

I will admit that with the latest build scripts and Ionic 2.1.4, build times are down to 5-10 seconds. Good job by the Ionic team! The last remaining glitch is that the refresh does not always complete. I will sometimes have to manually refresh my browser to get the latest version or enter “r” in the console to force a reload. Other than that, I’m up and running! :slight_smile :slight_smile: