Angular with Ivy + webpack - bundles larger than before

Question

I've upgraded to Angular 8.0 while opting in to "Ivy". Everything is compiling OK but results have been disappointing in terms of bundle sizes. Actually, my vendor bundle with Angular has increased in size vs ng7.

Not configured right?

I'm using Node 12
@angular 8.0 with @ngtool 8.01

tsconfig

{
  "compileOnSave": false,
    "compilerOptions": {
        "baseUrl": ".",
        "noImplicitAny": false,
        "noEmitOnError": true,
        "sourceMap": false,
        "inlineSourceMap": false,
        "target": "es5",
        "module": "es2015",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "allowSyntheticDefaultImports": false,
        "allowJs": false,
        "noStrictGenericChecks": true,
        "noEmit": false,
        "lib": [ "es6", "dom" ],
    },
 "angularCompilerOptions": {
    "skipMetadataEmit": true,
    "enableIvy": "ngtsc",
    "allowEmptyCodegenFiles": true
  }
}

the vendor bundle which contains angular is actually slightly larger than before Ivy was enabled (1.2MB). Definitely not what they're advertising but like I mentioned, maybe I didn't configure it right. — vidalsasoon, Jun 05 '19 at 12:49
@Sergey I set "-p" in my package.json prod script params. Not sure if ngtools picks it up. — vidalsasoon, Jun 11 '19 at 18:23

maxime1992 · Answer 1 · 2019-06-05T08:35:14.657

Angular's new compiler (Ivy) is only experimental for now and not even fully stable.

You can try it out if you're running Angular 8 by passing a flag enableIvy as you've done. But it's not the default value (now) for a good reason. You shouldn't use that in prod (yet).

You'll not get anything beneficial by activating Ivy right now. They've changed the way the compiler does work and one of the reasons is to get better tree shaking. But the tooling around that hasn't been updated yet (which in my opinion will probably only come in v9).

For now, it's fine to use Ivy as a beta tester and report any issue you might encounter with it to the team. You'll also encounter issues with libraries that haven't been updated yet to support it. So I wouldn't recommend to use it in prod.

PS:

I've also talked about that in this thread https://github.com/angular/angular/issues/13721#issuecomment-498989717 (I'm explaining things about Ivy but also giving an answer to someone insulting maintainers so don't bother with that part...)

I'm only upgrading my personal website so I don't mind be an early adopter. Since i'm opting in to the preview and everything seems to be compiling OK I was expecting *some* improvement in bundle size. — vidalsasoon, Jun 05 '19 at 12:40
That's fair enough @vidalsasoon and I'm glad some people are willing to try Ivy before it's set by default! But as I explained, tooling is not quite ready yet so for now if you're trying it the only advantage you'll get is probably better debugging when you've got an error into a template. You'll have to be a little bit more patient for tiny bundles — maxime1992, Jun 05 '19 at 12:54

Angular with Ivy + webpack - bundles larger than before

1 Answers1