"ng build -prod" is still extremely slow ！

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• xi18n
• run
• config
• help
• version
• doc

Description

ng build --prod in a large project is extremely slow ! I found many issue to this problem,but in the end, they didn’t solve it properly(search by keyword ‘92%’、‘80%’、‘slow’) It takes 11min at 7.x, 15min at 8.x, now it’s too slow to be tolerated. I even wonder if angular can be used for large projects.

🔬 Minimal Reproduction

Large projects has this problems

🔥 Exception or Error

1、80% chunk modules optimization ModuleConcatenationPlugin 2、92% chunk asset optimization At this two points it takes so much time!

I have two project created by @nrwl/nx. One has 256 files, it’s build very fast with 3-5min. The other project has 2,598 files, it’s build so slowly. Two projects share a lib (1000files) ng build without ivy and all config closed by false(aot、buildOptimizer…) need so many memory that jenkins server always crash.

> node --max-old-space-size=16384 ./node_modules/@angular/cli/bin/ng b platform --progress=true --showCircularDependencies=true --prod=true --sourceMap=false --statsJson=true --verbose=true >>log.txt

Warning: Entry point 'ngx-echarts/core' contains deep imports into 'node_modules/echarts/lib/echarts'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
<w> [webpack.Progress] 139177ms building
 [webpack.Progress] 663ms finish module graph
 [webpack.Progress] 17ms sealing
 [webpack.Progress] 254ms dependencies optimization
 [webpack.Progress] 135ms chunk graph
 [webpack.Progress] 616ms module optimization
 [webpack.Progress] 40ms advanced chunk optimization
<w> [webpack.Progress] 742198ms chunk modules optimization
 [webpack.Progress] 48ms module order optimization
 [webpack.Progress] 104ms before module ids
 [webpack.Progress] 17ms module ids
 [webpack.Progress] 34ms module id optimization
 [webpack.Progress] 19ms chunk id optimization
 [webpack.Progress] 32ms after chunk id optimization
 [webpack.Progress] 18ms record modules
<w> [webpack.Progress] 27104ms hashing
<w> [webpack.Progress] 13876ms chunk assets processing
 [webpack.Progress] 36ms additional chunk assets processing
<w> [webpack.Progress] 2260ms additional asset processing
<w> [webpack.Progress] 398697ms chunk asset optimization
 [webpack.Progress] 14ms after chunk asset optimization
 [webpack.Progress] 23ms after asset optimization
 [webpack.Progress] 48ms after seal
<w> [webpack.Progress] 144895ms emitting
Hash: 26f644aa4d62175a2b2d
Version: webpack 4.42.0
Time: 3118021ms
Built at: 2020-04-28 00:26:31

🌍 Your Environment

Angular CLI: 9.1.1
Node: 12.14.0
OS: win32 x64

Angular: 9.1.2
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.901.1
@angular-devkit/build-angular     0.901.1
@angular-devkit/build-optimizer   0.901.1
@angular-devkit/build-webpack     0.901.1
@angular-devkit/core              9.1.1
@angular-devkit/schematics        9.1.1
@angular/cdk                      9.2.1
@angular/cli                      9.1.1
@ngtools/webpack                  9.1.1
@schematics/angular               9.1.1
@schematics/update                0.901.1
rxjs                              6.5.5
typescript                        3.8.3
webpack                           4.42.0

Anything else relevant?

                    "production": {
                            "fileReplacements": [
                                {
                                    "replace": "environments/environment.ts",
                                    "with": "environments/environment.prod.ts"
                                }
                            ],
                            "optimization": true,
                            "outputHashing": "all",
                            "sourceMap": false,
                            "extractCss": true,
                            "namedChunks": false,
                            "extractLicenses": true,
                            "aot": true,
                            "vendorChunk": false,
                            "buildOptimizer": true,
                            "baseHref": "./",
                            "budgets": [
                                {
                                    "type": "initial",
                                    "maximumWarning": "4mb",
                                    "maximumError": "10mb"
                                },
                                {
                                    "type": "anyComponentStyle",
                                    "maximumWarning": "6kb"
                                }
                            ]
                        },

"dependencies": {
        "@angular/animations": "^9.1.2",
        "@angular/cdk": "^9.2.1",
        "@angular/common": "^9.1.2",
        "@angular/core": "^9.1.2",
        "@angular/forms": "^9.1.2",
        "@angular/platform-browser": "^9.1.2",
        "@angular/platform-browser-dynamic": "^9.1.2",
        "@angular/router": "^9.1.2",
        "@ngrx/effects": "^9.1.0",
        "@ngrx/router-store": "^9.1.0",
        "@ngrx/store": "^9.1.0",
        "@nrwl/nx": "7.8.7",
        "aot-loader": "^1.0.1",
        "core-js": "^3.6.5",
        "date-fns": "^2.12.0",
        "echarts": "^4.1.0",
        "html2canvas": "^1.0.0-rc.0",
        "moment": "^2.24.0",
        "ngrx-store-freeze": "0.2.4",
        "ngx-bootstrap": "^5.6.1",
        "ngx-drag-drop": "^2.0.0",
        "ngx-echarts": "^4.1.0",
        "ngx-img-cropper": "^9.0.1",
        "ngx-sortablejs": "^3.1.3",
        "qrcode": "^1.3.2",
        "rxjs": "^6.5.5",
        "rxjs-compat": "^6.5.5",
        "sortablejs": "^1.9.0",
        "tslib": "^1.10.0",
        "wangeditor": "^3.1.1",
        "zone.js": "~0.10.2"
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "~0.901.1",
        "@angular/cli": "^9.1.1",
        "@angular/compiler": "^9.1.2",
        "@angular/compiler-cli": "^9.1.2",
        "@angular/language-service": "^9.1.2",
        "@angularclass/hmr": "^2.1.3",
        "@babel/plugin-syntax-dynamic-import": "^7.8.3",
        "@ngrx/store-devtools": "^9.1.0",
        "@nrwl/schematics": "8.12.11",
        "@nrwl/workspace": "^9.2.2",
        "@types/echarts": "^4.4.6",
        "@types/jasmine": "~3.5.10",
        "@types/jasminewd2": "~2.0.3",
        "@types/node": "^12.11.1",
        "codelyzer": "^5.1.2",
        "jasmine-core": "~3.5.0",
        "jasmine-marbles": "0.6.0",
        "jasmine-spec-reporter": "~5.0.1",
        "karma": "^5.0.1",
        "karma-chrome-launcher": "~3.1.0",
        "karma-coverage-istanbul-reporter": "~2.1.1",
        "karma-jasmine": "~3.1.1",
        "karma-jasmine-html-reporter": "^1.5.3",
        "prettier": "2.0.4",
        "protractor": "~5.4.0",
        "ts-node": "~8.8.2",
        "tslint": "~6.1.1",
        "typescript": "^3.8.3",
        "webpack-bundle-analyzer": "^3.7.0"
    }

[w2819]

I think this issue will be closed with no solution…

[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.}