Build with "ng -prod" is extremely slow

[ankeshdave]

Bug Report or Feature Request (mark with an x)

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

Versions.

ng --version
_ _ ____ _ ___
/ \ _ __ __ _ _ | | __ _ _ __ / | | | |
/ △ \ | ' \ / _ | | | | |/ _ | '| | | | | | |
/ ___ | | | | (| | || | | (| | | | || | | |
// __| ||_, |_,||_,|| _|||
|___/
@angular/cli: 1.1.0
node: 7.9.0
os: win32 x64 (Win 10 Enterpirise - 16Gig , i7)
@angular/animations: 4.0.0
@angular/common: 4.0.0
@angular/compiler: 4.0.0
@angular/core: 4.0.0
@angular/forms: 4.0.0
@angular/http: 4.0.0
@angular/platform-browser: 4.0.0
@angular/platform-browser-dynamic: 4.0.0
@angular/router: 4.0.0
@angular/cli: 1.1.0
@angular/compiler-cli: 4.0.0
@angular/language-service: 4.0.0

Repro steps.

$ ng build --prod --aot=false -ec --sourcemap=false
Hash: 552d9867ececa788ac3a
Time: 670222ms
chunk {0} polyfills.d77767cee98c83f90386.bundle.js (polyfills) 294 kB {5} [initial] [rendered]
chunk {1} main.255e1d27fe4d40b56ab2.bundle.js (main) 1.51 MB {4} [initial] [rendered]
chunk {2} scripts.45a4574f31d7b91e5a5e.bundle.js (scripts) 3.88 MB {5} [initial] [rendered]
chunk {3} styles.ac17d766c993c4027892.bundle.css (styles) 228 bytes {5} [initial] [rendered]
chunk {4} vendor.86c029ec4598fb674488.bundle.js (vendor) 8.23 MB [initial] [rendered]
chunk {5} inline.750f0337ff0a9bee9813.bundle.js (inline) 0 bytes [entry] [rendered]

ng build --aot -ec -sm
Hash: 24f744145f250126e699
Time: 62809ms
chunk {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 294 kB {5} [initial] [rendered]
chunk {1} main.bundle.js, main.bundle.js.map (main) 3.07 MB {4} [initial] [rendered]
chunk {2} scripts.bundle.js, scripts.bundle.js.map (scripts) 3.88 MB {5} [initial] [rendered]
chunk {3} styles.bundle.css, styles.bundle.css.map (styles) 228 bytes {5} [initial] [rendered]
chunk {4} vendor.bundle.js, vendor.bundle.js.map (vendor) 7.37 MB [initial] [rendered]
chunk {5} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered]

670222ms vs 62809ms is a huge difference

The log given by the failure.

There is no failure , the build takes a very long time to complete its stuck at
92% chunk asset optimization and then we have to wait for 10-15 mins to get the build completed.
I have disabled aot and sourcemaps, still the speed is very slow.

Desired functionality.

build should have similar time that to of ng build -aot

Any help and guidance to reduce will be helpful.

[ankeshdave]

@filipesilva Is this the expected behavior, do i need to change something ?

[filipesilva]

Production builds are usually slower than development builds. Besides using --aot, other optimizations are also used.

I do think your build time is too long though. I haven't seen other apps that have such a big difference between prod and dev build time. chunk asset optimization is a phase where sourcemaps are usually handled... but you have them turned off.

I'm unsure of what's happening. Perhaps it's related to webpack/webpack#4863.

Is this a public project that I can look at? You might also have a cyclic dependency perhaps.. if so, #6813 could help you.

Note: sourcemaps are disabled in production builds by default, while css extraction is enabled by default.

[elvisbegovic]

Same problem here

ng build --aot=false : 41286ms
ng build --aot=false --prod : 66594ms
ng build --prod : 193155ms

@filipesilva you can check here if you can see import problem : https://plnkr.co/edit/xMf8HXoNIhq3urJ6cPXQ?p=preview

This is one proble "slow" but Other problem is : I don't understand why on dev mode "ng serve" after cli recompile fils changes and finish the browser autorefresh and I need wait 6-7seconds until browser finish refreshing this is very very big and make me crazy

[GoNode5]

@filipesilva how is Angular-cli tested with real life projects? 20-50 modules and 5-10 thirdpary JS Libs?

[hoangit21]

Same issue here. Im using
@angular/cli: 1.4.2
node: 8.5.0
Os: Mac os sierra.
Script: ng build --prod --env=prod

[billdwhite]

Same issue here:
@angular/cli: 1.4.3
node: 8.5.0
OS: Mac OSX 10.13 (High Sierra)
ng build --prod --env=prod --target=production --sourcemaps

 [exec] Date: 2017-09-27T23:19:55.604Z
 [exec] Hash: fa2db26f638074fd1389
 [exec] Time: 476879ms

[billdwhite]

FYI, it speeds up considerably when I leave off the --sourcemaps option. Off course, that's a must have so it still needs a fix......

 [exec] Time: 111347ms

[ShadowManu]

Anything on this @filipesilva? We are running ng build --prod --aot and having times of:

• libs=4.4.x + cli=1.4.9 ~> 12 minutes
• libs=5.0.0-rc.x + cli=1.5.0.rc.x ~> +28 minutes

[mko]

Any update on this? We're even to the point where we're seeing JavaScript heap errors when we compile with sourcemaps turned on.

[thatisuday]

Time: 311644ms
chunk {0} main.71984717b389e49ae42e.bundle.js (main) 2.64 MB [initial] [rendered]
chunk {1} polyfills.e6475d2787bb3154d59c.bundle.js (polyfills) 61 kB [initial] [rendered]
chunk {2} styles.51bed08d75b28990a11e.bundle.css (styles) 671 kB [initial] [rendered]
chunk {3} inline.b8bddd744d2f9e590618.bundle.js (inline) 1.45 kB [entry] [rendered]

Angular CLI: 1.5.2
Node: 7.10.0
OS: win32 x64
Angular: 5.0.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 5.0.0-rc0
@angular/cli: 1.5.2
@angular/material: 5.0.0-rc0
@angular-devkit/build-optimizer: 0.0.33
@angular-devkit/core: 0.0.20
@angular-devkit/schematics: 0.0.36
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.2
@schematics/angular: 0.1.5
typescript: 2.4.2
webpack: 3.8.1

[gozeon]

Date: 2017-11-23T01:59:15.670Z
Hash: dfd7e6a64a5c706ebc84
Time: 461173ms
chunk {0} 0.51b252b5a5d17d9e26c9.chunk.js (common) 358 kB {16}  [rendered]
chunk {1} 1.e4aae86fef81cbdf4571.chunk.js () 490 kB {16}  [rendered]
chunk {2} 2.e0e90ed4a7c76fb9cc64.chunk.js () 443 kB {16}  [rendered]
chunk {3} 3.4f8163065e611b0b5b99.chunk.js () 29.4 kB {16}  [rendered]
chunk {4} 4.85e0c8b989186f994199.chunk.js () 661 kB {16}  [rendered]
chunk {5} 5.ac3ae6b24f5617625496.chunk.js () 54.8 kB {16}  [rendered]
chunk {6} 6.346f88d49d734d317eca.chunk.js () 67.9 kB {16}  [rendered]
chunk {7} 7.f45af7d2f19ea142be6b.chunk.js () 378 kB {16}  [rendered]
chunk {8} 8.67d5955810160bf3abc1.chunk.js () 261 kB {16}  [rendered]
chunk {9} 9.117ecb1bbecbb2b8dae3.chunk.js () 85.6 kB {16}  [rendered]
chunk {10} 10.d26d500eaae787ac8e06.chunk.js () 44.7 kB {16}  [rendered]
chunk {11} 11.bccce4a907647697e438.chunk.js () 11.9 kB {16}  [rendered]
chunk {12} 12.58c78451438f761d9fc3.chunk.js () 24.8 kB {16}  [rendered]
chunk {13} 13.c232605735cecba45737.chunk.js () 361 kB {16}  [rendered]
chunk {14} 14.c3b4c5317a93227ef829.chunk.js () 42.7 kB {16}  [rendered]
chunk {15} polyfills.14a6e475fb60a31cb355.bundle.js (polyfills) 63.7 kB {20} [initial] [rendered]
chunk {16} main.7f2fb8db839c9f4091d4.bundle.js (main) 533 kB {19} [initial] [rendered]
chunk {17} scripts.6082498be40515e405ed.bundle.js (scripts) 109 kB {20} [initial] [rendered]
chunk {18} styles.b93f29cd6d301dfb05ca.bundle.css (styles) 308 kB {20} [initial] [rendered]
chunk {19} vendor.ca648642601664013b21.bundle.js (vendor) 2.81 MB [initial] [rendered]
chunk {20} inline.1cfa0fd976f080e73d87.bundle.js (inline) 1.86 kB [entry] [rendered]

[KissBalazs]

Angular 5

Time: 413322ms
chunk {0} polyfills.1970941146babc162eea.bundle.js (polyfills) 99.8 kB [initial] [rendered]
chunk {1} main.14b317fb1264dafeb9ad.bundle.js (main) 3.96 MB [initial] [rendered]
chunk {2} styles.1d741fb54f277aec9a5f.bundle.css (styles) 738 bytes [initial] [rendered]
chunk {3} inline.51acfa358278247dad6c.bundle.js (inline) 1.45 kB [entry] [rendered]