Angular-cli: AOT and NONE AOT bundle size are exactly the same

[xe4me]

Bug Report or Feature Request (mark with an x)

• [x ] bug report -> please search issues before submitting
• [ ] feature request

Versions.

@angular/cli: 1.0.0-rc.1
node: 7.6.0
os: darwin x64
@angular/common: 2.4.9
@angular/compiler: 2.4.9
@angular/core: 2.4.9
@angular/forms: 2.4.9
@angular/http: 2.4.9
@angular/material: 2.0.0-beta.2
@angular/platform-browser: 2.4.9
@angular/platform-browser-dynamic: 2.4.9
@angular/router: 3.4.9
@angular/cli: 1.0.0-rc.1
@angular/compiler-cli: 2.4.9

Repro steps.

1- Create a new project
2- Run ng build --prod --aot or ng build --prod --aot=true or ng build --prod --aot=false or ng build --prod or ng build --prod --aot --env=prod

3- For all of those build, the vendor bundle and main bundle and the rest, are exactly the same. (741kb for vendor)

Desired functionality.

I'd have thought that the aot built bundle should be smaller in size.

Strangely enough, when I clone a seed repo from AngularClass and then run their npm run build:aot:prod the bundle size is less than half of what Angular cli would produce.

Mention any other details that might be useful.

[Meligy]

ng -prod is the same as ng -prod --aot.
But it should be different from ng -prod --aot=false (or ng -prod --no-aot, which is the same).

Can you please share your output from these three commands?

ng -prod

ng -prod --aot=false

ng -prod --no-aot

Thanks.

[filipesilva]

Closing as answered, thanks @Meligy !

[vinaynp123]

I am facing the same issue.
Recently I have made my angular 2 project AOT compatible and tried building with angular-cli .

Case 1: With prod flag(which uses aot by default) ng build -prod which resulted in js bundles as expected in a dist folder inside my project.

Now looking at the networks tab and loading my page gave following data download and loadtime. (2.4MB and 889ms)

Case 2: Now again when I tried with aot flag set to false ng build -prod -aot=false

Now looking at the networks tab again and loading my page gave following new data download and loadtime.(2MB and 2.91 s)

As you can see the downloaded data remained almost unchanged but the time reduced drastically.

Case 3: And finally I used ng serve with prod flag ng serve -prod and looking at the network tab gave me reduced data download along with reduced page laod time as shown below (683KB and 894ms)

Shouldn't case 1 and case 3 behave in a similar way(In terms of data transfer and page load time) as both make use of AOT compilation?

What the reason behind ng serve performing better?

For case 1 & case 2 I am making use of nginx server.

[filipesilva]

@vinaynp123 really depends on what you used to serve. My guess is that the server you used in case 1 and 2 didn't have gzip compression on, whereas ng serve --prod does.

[vignesh2694]

what is the difference between ng -prod --aot=false and ng -prod --aot=true

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}