search

angular / angular

Deliver web apps with confidence 🚀
https://angular.dev
MIT License
96.42k stars 25.59k forks source link

Upgrade to 9.1 - hangs on 0% compiling #36272

Closed piernik closed 4 years ago

piernik commented 4 years ago

🐞 Bug report

Command (mark with an x)

Is this a regression?

Yes, the previous version in which this bug was not present was: 9.0.7

Description

Yesterday I was working on angular@9.07 and today there was update to 9.1 which I did. And now ng serve is hanging on 0% compiling for 5 minutes :/ Here is my screenshot:

ng-hang

🔬 Minimal Reproduction

🔥 Exception or Error




```
{
  "name": "@infirma/frontend",
  "version": "3.3.0",
  "scripts": {
    "ng": "ng",
    "start:n": "ng serve",
    "start": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng serve --extra-webpack-config webpack.extra.js",
    "start:aot": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng serve --aot",
    "build": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng build --aot --build-optimizer --progress=true --extra-webpack-config webpack.extra.js",
    "build:prod": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng build --prod --build-optimizer --progress=true --extra-webpack-config webpack.extra.js",
    "build:prod:source-map": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng build --prod --build-optimizer --progress=true --source-map --extra-webpack-config webpack.extra.js",
    "build:prod:source-map:named-chunks": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng build --prod --build-optimizer --progress=true --source-map --named-chunks --extra-webpack-config webpack.extra.js",
    "build:prod:no-aot": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng build --prod --no-aot --build-optimizer false --extra-webpack-config webpack.extra.js",
    "build:prod:analyzer": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng build --prod --source-map --stats-json --build-optimizer --progress=true --extra-webpack-config webpack.extra.js",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "bundle-analize": "webpack-bundle-analyzer dist/frontend/stats.json",
    "http-server": "http-server -p 8080 -c-1 dist/frontend"
  },
  "private": true,
  "dependencies": {
    "@agm/core": "^1.1.0",
    "@agm/js-marker-clusterer": "^1.1.0",
    "@amcharts/amcharts4": "^4.7.15",
    "@amcharts/amcharts4-geodata": "^4.1.9",
    "@angular/animations": "~9.1.0",
    "@angular/cdk": "^9.2.0",
    "@angular/common": "~9.1.0",
    "@angular/compiler": "~9.1.0",
    "@angular/core": "~9.1.0",
    "@angular/forms": "~9.1.0",
    "@angular/platform-browser": "~9.1.0",
    "@angular/platform-browser-dynamic": "~9.1.0",
    "@angular/pwa": "^0.900.7",
    "@angular/router": "~9.1.0",
    "@angular/service-worker": "~9.1.0",
    "@auth0/angular-jwt": "^4.0.0",
    "@exalif/ngx-breadcrumbs": "^7.1.1",
    "@fortawesome/angular-fontawesome": "^0.6.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.28",
    "@fortawesome/free-brands-svg-icons": "^5.13.0",
    "@fortawesome/pro-light-svg-icons": "^5.13.0",
    "@fortawesome/pro-regular-svg-icons": "^5.13.0",
    "@fortawesome/pro-solid-svg-icons": "^5.13.0",
    "@fullcalendar/bootstrap": "^4.4.0",
    "@fullcalendar/core": "^4.4.0",
    "@fullcalendar/daygrid": "^4.4.0",
    "@fullcalendar/google-calendar": "^4.4.0",
    "@fullcalendar/interaction": "^4.4.0",
    "@fullcalendar/list": "^4.4.0",
    "@fullcalendar/rrule": "^4.4.0",
    "@fullcalendar/timegrid": "^4.4.0",
    "@lukana/alerts": "^0.9.1",
    "@lukana/data-checker": "^0.9.0",
    "@lukana/dropdowns": "^0.9.0",
    "@lukana/loading-indicator": "^0.9.2",
    "@lukana/modals": "^0.9.0",
    "@lukana/ng-pick-datetime": "^0.9.1",
    "@lukana/paginator": "^0.9.0",
    "@lukana/tooltips": "^0.9.2",
    "@ng-select/ng-select": "3.7.3",
    "@ngxs/router-plugin": "3.6.2",
    "@ngxs/store": "3.6.2",
    "@schemater/bootstrap": "0.9.0",
    "@schemater/bootstrap-color": "0.9.0",
    "@schemater/components": "^0.9.1",
    "@schemater/core": "0.9.1",
    "@schemater/datetime": "0.9.0",
    "@schemater/filter-bar": "^0.9.0",
    "@schemater/sortable-arrays": "^0.9.2",
    "@sentry/browser": "^5.15.0",
    "agm-direction": "^0.7.9",
    "angular-gridster2": "^9.1.0",
    "angular2-hotkeys": "^2.2.0",
    "bootstrap": "^4.4.1",
    "ckeditor4-angular": "^1.1.0",
    "flag-icon-css": "^3.4.6",
    "js-marker-clusterer": "^1.0.0",
    "lodash": "^4.17.15",
    "moment": "^2.24.0",
    "ng-animate": "^0.3.4",
    "ngx-bootstrap": "^5.5.0",
    "ngx-build-plus": "^9.0.6",
    "ngx-color-picker": "^9.0.0",
    "ngx-sortablejs": "^3.1.4",
    "ngx-take-until-destroy": "^5.4.0",
    "npm": "^6.14.3",
    "rrule": "^2.6.4",
    "rxjs": "~6.5.4",
    "tslib": "^1.10.0",
    "sortablejs": "^1.10.2",
    "zone.js": "~0.10.3",
    "zxcvbn": "^4.4.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.901.0",
    "@angular/cli": "~9.1.0",
    "@angular/compiler-cli": "~9.1.0",
    "@angular/language-service": "~9.1.0",
    "@ngxs/devtools-plugin": "^3.6.2",
    "@types/ckeditor": "^4.9.8",
    "@types/faker": "^4.1.10",
    "@types/googlemaps": "^3.30.16",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.6",
    "@types/node": "~10.12.18",
    "codelyzer": "~5.2.1",
    "faker": "^4.1.0",
    "jasmine-core": "~3.3.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^4.4.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.2",
    "ts-node": "~8.0.1",
    "tslint": "~5.12.1",
    "typescript": "~3.7.5",
    "webpack-bundle-analyzer": "^3.6.1"
  }
}
```

🌍 Your Environment





     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 9.1.0
Node: 12.16.1
OS: win32 x64

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

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.901.0
@angular-devkit/build-angular     0.901.0
@angular-devkit/build-optimizer   0.901.0
@angular-devkit/build-webpack     0.901.0
@angular-devkit/core              8.0.0
@angular-devkit/schematics        8.0.0
@angular/cdk                      9.2.0
@angular/pwa                      0.900.7
@ngtools/webpack                  9.1.0
@schematics/angular               8.0.0
@schematics/update                0.901.0
rxjs                              6.5.4
typescript                        3.7.5
webpack                           4.42.0

Anything else relevant?

TinyMan commented 4 years ago

Same here, it was fine with @angular/core@9.1.0-rc.0 and @angular/cli@9.1.0-next4.

Note that src/__ngcc_entry_points__.json is created in application workspace, is this intended ?

petebacondarwin commented 4 years ago

Thanks for the extra info... we should not be writing that file to src directory. It should be going into the node_modules folder. So something is not right. This might not be the cause of your build hanging though.

Could you provide more information about your project setup? Ideally a repository that I can clone and use to debug the problem.

piernik commented 4 years ago

I cannot provide You my repository - it's quite big CRM system :/ I got back to angular 9.0.7 and everything is ok

minijus commented 4 years ago

Thanks for the extra info... we should not be writing that file to src directory. It should be going into the node_modules folder. So something is not right. This might not be the cause of your build hanging though.

Could you provide more information about your project setup? Ideally a repository that I can clone and use to debug the problem.

In @nrwl/nx case it is being written to /libs directory.

petebacondarwin commented 4 years ago

Hmm, so looking at the code in ngcc, we are doing:

        this.entryPointManifest.writeEntryPointManifest(basePath, entryPoints);

where basePath is computed from the basePath passed to ngcc in the first place but also from pathMappings...

So if you have path mappings setup like:

"pathMappings": {
  "@lib/*": ["lib/*"]
}

then we may indeed write a manifest to the lib directory.

We probably should avoid doing this... but I don't know if this is the cause of the hanging build...

If you could find a way to strip down your project to a minimal reproduction then I can debug it.

sbradl commented 4 years ago

@Piernik Are you running on a windows system?

petebacondarwin commented 4 years ago

@piernik - can you provide the contents of your tsconfig.json? In particular the baseUrl and paths settings?

sbradl commented 4 years ago

I also see that ng test hangs 0% compiling. Could this be related to my other issue https://github.com/angular/angular/issues/36414?

piernik commented 4 years ago

@sbradl Yes - windows 10 here is tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "resolveJsonModule": true,
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "ES2015",
    "lib": [
      "es2018",
      "dom"
    ],
    "paths": {
      "@app/*": [
        "src/app/*"
      ],
      "@mocks/*": [
        "src/mocks/*"
      ],
      "@decorators/*": [
        "src/app/utils/decorators/*"
      ],
      "@dostosowanie/*": [
        "src/dostosowanie/*"
      ]
    }
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

tsconfig.app.json

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "types": []
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}
RadekRobot commented 4 years ago

I experience exactly the same problem. ng serve hangs for couple of minutes on 0% before starting. As none of my collegues has complained about that, and I'm the only one with Windows, I think that might be OS - dependent issue.

petebacondarwin commented 4 years ago

If you run node_modules/.bin/ngcc -l debug in your project root before calling ng serve does it still hang? And how long does the initial ngcc run take?

RadekRobot commented 4 years ago

I have just checked - for me no - the node_modules/.bin/ngcc -l debug doesn't prevent the ng serve to hang for over 3 minutes, and the command itself takes quite a lot of time as well

petebacondarwin commented 4 years ago

@RadekRobot - which version of ngcc are you running? If possible can you try 9.1.2. And also can you run ngcc -l debug on a fresh install; and then run it again straight away. What are the timings for each?

mohyeid commented 4 years ago

I am facing the same issue. It's just stuck at 0% compiling and does not move forward for over 10 minutes. It then starting compiling of each single node_module dependency which is also taking very long. "@angular/core": "9.1.2" "@angular/cli": "^9.0.1"

red-man commented 4 years ago

I upgraded from 9.0.5 to 9.1.6 and am experiencing the same issue. It sits at 0% compiling for 5-10 minutes.

RadekRobot commented 4 years ago

@petebacondarwin sorry for long answering, I was running on 9.1.0 and shortly after we have updated to 9.1.2. The problem seem to disappear ever since everything runs like a charm, but It might be some of the other angular libraries, that were updated as well (eg other group of angular packages we updated from ^9.2.0 to ^9.2.1).

petebacondarwin commented 4 years ago

Thanks for replying @RadekRobot - this is one of the problems with issues like this. They are really tricky to track down, which is which we really need reproductions. Glad your project is up and running again...

RadekRobot commented 4 years ago

@petebacondarwin yes - I'm aware, that's not a very helpful answer, and from the other comment's I can see that there's no pattern for the particular version of the package where the problem might have happen. I wish I could help more, but I lack the knowledge of the core and I cannot reproduce it anymore anyway. Maybe extending verbose logging (i checked it once with --verbose and It was not very helpful) could be way to go. Thanks for great work on angular by the way!

briosheje commented 4 years ago

I'm experiencing the same issue upgrading a project from angular 7 to angular 9. After a lot of struggle to setup the whole thing, the dev build takes about 5-7 minutes to complete, while with angular 7 it took barely 40 seconds (which was quite long already).

Is there any news / tip about how to track down and eventually resolve the issue? There "0% compiling" just sits there and it appears ( to me ) that the machine is doing NOTHING at all until it effectively starts compiling, which happens after a long while.

bree7e commented 4 years ago

I am facing the same issue. ng serve time

win10 after upgrade - 332083ms (other values 289653ms, 301621ms)

     _                      _                 ____ _     ___ 
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | | 
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | | 
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 9.1.6
Node: 12.13.1     
OS: win32 x64     

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

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.901.5
@angular-devkit/build-angular      0.901.6
@angular-devkit/build-ng-packagr   0.901.6
@angular-devkit/build-optimizer    0.901.6
@angular-devkit/build-webpack      0.901.6
@angular-devkit/core               9.1.5
@angular-devkit/schematics         9.1.5
@angular/cdk                       9.2.3
@angular/cli                       9.1.6
@angular/material                  8.2.3
@ngtools/webpack                   9.1.6
@schematics/angular                9.1.5
@schematics/update                 0.901.6
ng-packagr                         9.1.3
rxjs                               6.5.5
typescript                         3.8.3
webpack                            4.42.0

win10 before upgrade - 55805ms

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 8.3.26
Node: 12.13.1
OS: win32 x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, elements
... forms, language-service, platform-browser
... platform-browser-dynamic, router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.803.23
@angular-devkit/build-angular      0.803.26
@angular-devkit/build-ng-packagr   0.803.26
@angular-devkit/build-optimizer    0.803.26
@angular-devkit/build-webpack      0.803.26
@angular-devkit/core               8.3.23
@angular-devkit/schematics         8.3.23
@angular/cdk                       8.2.3
@angular/cli                       8.3.26
@angular/material                  8.2.3
@ngtools/webpack                   8.3.26
@schematics/angular                8.3.23
@schematics/update                 0.803.26
ng-packagr                         5.7.1
rxjs                               6.5.5
typescript                         3.5.3
webpack                            4.39.2

❌ difference 277 sec - 603%

wsl win10 after upgrade - 202134ms


     _                      _                 ____ _     ___  
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _| 
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |  
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |  
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___| 
                |___/

Angular CLI: 9.1.6
Node: 12.16.2
OS: linux x64

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

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.901.5
@angular-devkit/build-angular      0.901.6
@angular-devkit/build-ng-packagr   0.901.6
@angular-devkit/build-optimizer    0.901.6
@angular-devkit/build-webpack      0.901.6
@angular-devkit/core               9.1.5
@angular-devkit/schematics         9.1.5
@angular/cdk                       9.2.3
@angular/cli                       9.1.6
@angular/material                  8.2.3
@ngtools/webpack                   9.1.6
@schematics/angular                9.1.5
@schematics/update                 0.901.6
ng-packagr                         9.1.3
rxjs                               6.5.5
typescript                         3.8.3
webpack                            4.42.0

wsl win10 before upgrade - 48349ms

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 8.3.26
Node: 12.16.2
OS: linux x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, elements
... forms, language-service, platform-browser
... platform-browser-dynamic, router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.803.23
@angular-devkit/build-angular      0.803.26
@angular-devkit/build-ng-packagr   0.803.26
@angular-devkit/build-optimizer    0.803.26
@angular-devkit/build-webpack      0.803.26
@angular-devkit/core               8.3.23
@angular-devkit/schematics         8.3.23
@angular/cdk                       8.2.3
@angular/cli                       8.3.26
@angular/material                  8.2.3
@ngtools/webpack                   8.3.26
@schematics/angular                8.3.23
@schematics/update                 0.803.26
ng-packagr                         5.7.1
rxjs                               6.5.5
typescript                         3.5.3
webpack                            4.39.2

❌ difference 154 sec - 420%

There is no issue on mac or linux.

macos after upgrade - 117855ms

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 9.1.6
Node: 12.16.1
OS: darwin x64

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

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.901.6
@angular-devkit/build-angular      0.901.6
@angular-devkit/build-ng-packagr   0.901.6
@angular-devkit/build-optimizer    0.901.6
@angular-devkit/build-webpack      0.901.6
@angular-devkit/core               9.1.6
@angular-devkit/schematics         9.1.6
@angular/cdk                       9.2.3
@angular/cli                       9.1.6
@angular/material                  8.2.3
@ngtools/webpack                   9.1.6
@schematics/angular                9.1.6
@schematics/update                 0.901.6
ng-packagr                         9.1.3
rxjs                               6.5.5
typescript                         3.8.3
webpack                            4.42.0

macos before upgrade - 82701ms

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 8.3.26
Node: 12.16.1
OS: darwin x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, elements
... forms, language-service, platform-browser
... platform-browser-dynamic, router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.803.23
@angular-devkit/build-angular      0.803.26
@angular-devkit/build-ng-packagr   0.803.26
@angular-devkit/build-optimizer    0.803.26
@angular-devkit/build-webpack      0.803.26
@angular-devkit/core               8.3.23
@angular-devkit/schematics         8.3.23
@angular/cdk                       8.2.3
@angular/cli                       8.3.26
@angular/material                  8.2.3
@ngtools/webpack                   8.3.26
@schematics/angular                8.3.23
@schematics/update                 0.803.26
ng-packagr                         5.7.1
rxjs                               6.5.5
typescript                         3.5.3
webpack                            4.39.2

✅ difference 35 sec - 42%

I also asked 3 people from my team. No one has encountered such a problem. They work for Linux.

briosheje commented 4 years ago

Not sure whether it's relevant or not, but every single build AFTER the initial build (the one that takes a lot of time) seems to produce memory heaps.

In Windows, the node process was about 800mb of ram, after about 10 rebuilds it reached 1.6gb. After a couple of hours I was working on the project it was over 2.5GB.

I will try to revert to 9.0.7 to check whether it suffers the same issue on windows or not, since someone mentioned that it actually solves to issue.

petebacondarwin commented 4 years ago

@briosheje - please create a new issue with some way for us to reproduce the problem. Or at least a detailed list of the logging and error messages so that we can work out which part of the build process is causing the heap dump.

petebacondarwin commented 4 years ago

The problem of the manifest being written outside node_modules, mentioned earlier in the issue, has been resolved by https://github.com/angular/angular/pull/36299.

petebacondarwin commented 4 years ago

I think that just leaves the final problem in this issue, which is the long build time.

If it is just the initial build that is slow (specifically after changing installed dependencies) then this is somewhat expected behaviour... ngcc needs to process every library in your node_modules and compile any Angular entry-points. This can take a long time if there are a lot of dependencies.

We have done some work over the last few weeks to improve this initial processing time. And we will continue to look at further improvements - e.g. https://github.com/angular/angular/pull/37075

If you are experiencing long build times after the initial one, then please open a new issue that provides a reproduction that we can debug and analyse to work out why it is so slow.

briosheje commented 4 years ago

I think that just leaves the final problem in this issue, which is the long build time.

If it is just the initial build that is slow (specifically after changing installed dependencies) then this is somewhat expected behaviour... ngcc needs to process every library in your node_modules and compile any Angular entry-points. This can take a long time if there are a lot of dependencies.

We have done some work over the last few weeks to improve this initial processing time. And we will continue to look at further improvements - e.g. #37075

If you are experiencing long build times after the initial one, then please open a new issue that provides a reproduction that we can debug and analyse to work out why it is so slow.

Can you please specify what you mean by "the initial build"?

Since angular 9, I could detect two phases:

1) Precompile of angular modules (after a fresh install, of course). 2) Project compile (where it's stuck at 0%).

Phase 1 takes a while, but it happens only once every install, which is fair. Most people from what I see (me included) are having problems in the second phase, where the "0% compiling" gets stuck for quite a while. In my case, it takes about 7 minutes.

If that's intended to stay stuck at "0%" for a long time, then it should be mentioned. Otherwise, if you have any clue or anything to give hint about what might be causing such a long compile time, a feedback would be very welcome.

I've upgraded from 7 to 9 and, personally, I would really go back to angular 7 if it wasn't that newer components requires angular 9: dev build times should not take that much time... With angular 7 the same project was building in 40 seconds (which was quite long already in my opinion, but acceptable).

petebacondarwin commented 4 years ago

@briosheje - are you saying that every time you run ng build even back to back you have to wait 7 minutes?? This does not seem right. I don't know what could be taking that long, since after the first build all the ngcc processing should have completed. Please can you provide some more information - preferably access to a repository that demonstrates the issue.

petebacondarwin commented 4 years ago

And please open a new issue with this reproduction so that it can be addressed directly. The difficulty with appending it to this issue is that similar symptoms can be caused by different underlying processing. It is better to have multiple issues that we can aggregate into a single one later than a single issue that covers lots of problems.

briosheje commented 4 years ago

@briosheje - are you saying that every time you run ng build even back to back you have to wait 7 minutes?? This does not seem right. I don't know what could be taking that long, since after the first build all the ngcc processing should have completed. Please can you provide some more information - preferably access to a repository that demonstrates the issue.

The repository is unluckily private (due to work limitations I cannot expose the repository). However, if that matters, the application has a lot of dependencies and, some of the biggest dependencies that actually are giving tons of warning in the compile process (the one that hangs) are ngbootstrap and devextreme (with devextreme-angular). Is there anything I can actually run to produce a verbose log of the compile process? Perhaps I can detect where the bottleneck is (assuming there is any).

I'm not sure whether those dependencies are the issue, but I really have no clue about how the compile time increased from 40 seconds to about 7 minutes.

briosheje commented 4 years ago

And please open a new issue with this reproduction so that it can be addressed directly. The difficulty with appending it to this issue is that similar symptoms can be caused by different underlying processing. It is better to have multiple issues that we can aggregate into a single one later than a single issue that covers lots of problems.

Ok, I will do that in my spare time, if there is any tip about how to investigate, though, please let me know before I open the issue, so that if I can use any tool to understand where the bottleneck is I can do that before opening another issue.

Thanks

petebacondarwin commented 4 years ago

Can you dump what output you do get?

petebacondarwin commented 4 years ago

You an also add the --verbose flag:

ng build --verbose

This will not show any more ngcc information but might provide additional insight into the rest of the build process.

petebacondarwin commented 4 years ago

Finally this is where ngcc is triggered before the build begins (i.e. at the 0% stage, I believe): https://github.com/angular/angular-cli/blob/master/packages/ngtools/webpack/src/ngcc_processor.ts#L75-L92 You could try changing that to add in the --l debug option to get ngcc to dump all its debugging output... see https://unpkg.com/browse/@ngtools/webpack@9.1.7/src/ngcc_processor.js

briosheje commented 4 years ago

You an also add the --verbose flag:

ng build --verbose

This will not show any more ngcc information but might provide additional insight into the rest of the build process.

I will update you on that point, I can already give you a feedback, though: I reverted to 9.0.1 (temporarely), and experienced this:

I highly suspect that some third party libraries are actually the cause of these 4 minutes or, perhaps, the cause is that my application is actually quite big and has tons of files and modules (about 450 custom modules). I don't know what Ivy does under the hood, neither what ngcc does, so I would argue that the complexity of the application PLUS some third party dependencies are actually the reason of those long build times.

I will keep investigating with the verbose flag, hopefully I can get some useful infos.

vivainio commented 4 years ago

This happened with us as well.

We upgraded from Angular 8 to 9.1.9, and ended up with slow build and 0% "hanging" for a long time.

Downgrading to 9.0.7 (with exact same versions for other libraries) cut 60 secs from the build time, so something really bad happened in 9.1. 9.0.7 is still slower than Angular 8, but not massively slower.

I also tried NG_BUILD_PROFILING environment variable, but it deadlocked at "Chuck graph 70%" phase forever. Same problem with both 9.0.7 and 9.1.9

mohyeid commented 4 years ago

This still the same for us. We are postponing upgrade to 9 due to this. We can not have our development teams to be stuck over 10 minutes just to do ng serve.

bree7e commented 4 years ago

Finally this is where ngcc is triggered before the build begins (i.e. at the 0% stage, I believe): https://github.com/angular/angular-cli/blob/master/packages/ngtools/webpack/src/ngcc_processor.ts#L75-L92 You could try changing that to add in the --l debug option to get ngcc to dump all its debugging output... see https://unpkg.com/browse/@ngtools/webpack@9.1.7/src/ngcc_processor.js

▶ node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build --verbose
before NgccProcessor -> process -> spawnSync
Debug: The basePath "E:/home/angular/isp/vepp-front/dist/libs/form-buttons" computed from baseUrl "E:/home/angular/isp/vepp-front" and path mapping "dist/libs/form-buttons" does not exist in the file-system.
It will not be scanned for entry-points.
Debug: Forking unlocker child-process
Debug: Attemping to write lock-file at E:/home/angular/isp/vepp-front/node_modules/@angular/compiler-cli/ngcc/__ngcc_lock_file__ with PID 17984
Debug: Written lock-file at E:/home/angular/isp/vepp-front/node_modules/@angular/compiler-cli/ngcc/__ngcc_lock_file__ with PID 17984
Debug: Running ngcc on ClusterExecutor (using 3 worker processes).
Debug: Analyzing entry-points...
Debug: Entry-point manifest found for E:/home/angular/isp/vepp-front/node_modules so loading entry-point information directly.
Debug: Reading entry-points using the manifest entries took 0.6s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/isp/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/isp/src for entry-points took 0.1s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/common/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/common/src for entry-points took 0.2s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/auth-api/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/auth-api/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/vepp-api/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/vepp-api/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/market-api/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/market-api/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/updater-api/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/updater-api/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/settings-api/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/settings-api/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/user-api/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/user-api/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/core-api/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/core-api/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/validator-api/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/validator-api/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/demo-api/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/demo-api/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/settings/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/settings/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/dynamic-form/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/dynamic-form/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/form-buttons/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/form-buttons/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/purchase/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/purchase/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/vepp-mascot/src so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/vepp-mascot/src for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/libs/vepp-mascot/mascots so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/libs/vepp-mascot/mascots for entry-points took 0s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/dist/libs/core-api so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/dist/libs/core-api for entry-points took 0.1s.
Debug: No manifest found for E:/home/angular/isp/vepp-front/dist/libs/validator-api so walking the directories for entry-points.
Debug: Walking E:/home/angular/isp/vepp-front/dist/libs/validator-api for entry-points took 0.1s.
Warning: Entry point '@ngispui/select' contains deep imports into 'E:/home/angular/isp/vepp-front/node_modules/lodash/fp'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
Warning: Entry point 'angular2-text-mask' contains deep imports into 'E:/home/angular/isp/vepp-front/node_modules/text-mask-core/dist/textMaskCore'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
Debug: Invalid entry-point E:/home/angular/isp/vepp-front/node_modules/@angular/common/upgrade. It is missing required dependencies:
 - @angular/upgrade/static
Debug: Invalid entry-point E:/home/angular/isp/vepp-front/node_modules/@angular/router/upgrade. It is missing required dependencies:
 - @angular/upgrade/static
Debug: Invalid entry-point E:/home/angular/isp/vepp-front/node_modules/@nrwl/angular. It is missing required dependencies:
 - @ngrx/effects
 - @ngrx/router-store
 - @ngrx/store
Debug: Skipping @angular/animations : es2015 (already compiled).
Debug: Skipping @angular/core : es2015 (already compiled).
Debug: Skipping @angular/animations/browser : es2015 (already compiled).
Debug: Skipping @angular/animations/browser/testing : es2015 (already compiled).
Debug: Skipping @angular/common : es2015 (already compiled).
Debug: Skipping @angular/cdk/clipboard : es2015 (already compiled).
Debug: Skipping @angular/cdk/platform : es2015 (already compiled).
Debug: Skipping @angular/cdk/bidi : es2015 (already compiled).
Debug: Skipping @angular/cdk/collections : es2015 (already compiled).
Debug: Skipping @angular/cdk/scrolling : es2015 (already compiled).
Debug: Skipping @angular/cdk/drag-drop : es2015 (already compiled).
Debug: Skipping @angular/common/http : es2015 (already compiled).
Debug: Skipping @angular/common/http/testing : es2015 (already compiled).
Debug: Skipping @angular/elements : es2015 (already compiled).
Debug: Skipping @angular/cdk/keycodes : es2015 (already compiled).
Debug: Skipping @angular/cdk/observers : es2015 (already compiled).
Debug: Skipping @angular/cdk/a11y : es2015 (already compiled).
Debug: Skipping @angular/platform-browser : es2015 (already compiled).
Debug: Skipping @angular/platform-browser/animations : es2015 (already compiled).
Debug: Skipping @angular/forms : es2015 (already compiled).
Debug: Skipping @angular/material/core : es2015 (already compiled).
Debug: Skipping @angular/cdk/portal : es2015 (already compiled).
Debug: Skipping @angular/cdk/overlay : es2015 (already compiled).
Debug: Skipping @angular/material/form-field : es2015 (already compiled).
Debug: Skipping @angular/material/autocomplete : es2015 (already compiled).
Debug: Skipping @angular/material/badge : es2015 (already compiled).
Debug: Skipping @angular/cdk/layout : es2015 (already compiled).
Debug: Skipping @angular/material/bottom-sheet : es2015 (already compiled).
Debug: Skipping @angular/material/button : es2015 (already compiled).
Debug: Skipping @angular/material/button-toggle : es2015 (already compiled).
Debug: Skipping @angular/material/card : es2015 (already compiled).
Debug: Skipping @angular/material/checkbox : es2015 (already compiled).
Debug: Skipping @angular/material/chips : es2015 (already compiled).
Debug: Skipping @angular/material/dialog : es2015 (already compiled).
Debug: Skipping @angular/cdk/text-field : es2015 (already compiled).
Debug: Skipping @angular/material/input : es2015 (already compiled).
Debug: Skipping @angular/material/datepicker : es2015 (already compiled).
Debug: Skipping @angular/material/divider : es2015 (already compiled).
Debug: Skipping @angular/cdk/accordion : es2015 (already compiled).
Debug: Skipping @angular/material/expansion : es2015 (already compiled).
Debug: Skipping @angular/material/grid-list : es2015 (already compiled).
Debug: Skipping @angular/material/icon : es2015 (already compiled).
Debug: Skipping @angular/material/list : es2015 (already compiled).
Debug: Skipping @angular/material/menu : es2015 (already compiled).
Debug: Skipping @angular/material/select : es2015 (already compiled).
Debug: Skipping @angular/material/tooltip : es2015 (already compiled).
Debug: Skipping @angular/material/paginator : es2015 (already compiled).
Debug: Skipping @angular/material/progress-bar : es2015 (already compiled).
Debug: Skipping @angular/material/progress-spinner : es2015 (already compiled).
Debug: Skipping @angular/material/radio : es2015 (already compiled).
Debug: Skipping @angular/material/sidenav : es2015 (already compiled).
Debug: Skipping @angular/material/slide-toggle : es2015 (already compiled).
Debug: Skipping @angular/material/slider : es2015 (already compiled).
Debug: Skipping @angular/material/snack-bar : es2015 (already compiled).
Debug: Skipping @angular/material/sort : es2015 (already compiled).
Debug: Skipping @angular/cdk/stepper : es2015 (already compiled).
Debug: Skipping @angular/material/stepper : es2015 (already compiled).
Debug: Skipping @angular/cdk/table : es2015 (already compiled).
Debug: Skipping @angular/material/table : es2015 (already compiled).
Debug: Skipping @angular/material/tabs : es2015 (already compiled).
Debug: Skipping @angular/material/toolbar : es2015 (already compiled).
Debug: Skipping @angular/cdk/tree : es2015 (already compiled).
Debug: Skipping @angular/material/tree : es2015 (already compiled).
Debug: Skipping @angular/material : es2015 (already compiled).
Debug: Skipping @angular/core/testing : es2015 (already compiled).
Debug: Skipping @angular/platform-browser-dynamic : es2015 (already compiled).
Debug: Skipping @angular/platform-browser/testing : es2015 (already compiled).
Debug: Skipping @angular/compiler/testing : es2015 (already compiled).
Debug: Skipping @angular/platform-browser-dynamic/testing : es2015 (already compiled).
Debug: Skipping @angular/common/testing : es2015 (already compiled).
Debug: Skipping @angular/router : es2015 (already compiled).
Debug: Skipping @angular/router/testing : es2015 (already compiled).
Debug: Skipping @ispdevkit/error-report : es2015 (already compiled).
Debug: Skipping @ngispui/window-service : module (already compiled).
Debug: Skipping @ispdevkit/frontend-metric : es2015 (already compiled).
Debug: Skipping @ispdevkit/list : es2015 (already compiled).
Debug: Skipping @ngx-translate/core : es2015 (already compiled).
Debug: Skipping @ispdevkit/notifier : es2015 (already compiled).
Debug: Skipping @ngispui/dom-outlet : module (already compiled).
Debug: Skipping @ngispui/notification : es2015 (already compiled).
Debug: Skipping @ispdevkit/ng-plugin-utils : es2015 (already compiled).
Debug: Skipping @ispdevkit/product-metric : es2015 (already compiled).
Debug: Skipping @ispdevkit/retry-interceptor : es2015 (already compiled).
Debug: Skipping @ispdevkit/coreapi : es2015 (already compiled).
Debug: Skipping @ispdevkit/update : es2015 (already compiled).
Debug: Skipping @ispdevkit/validators : es2015 (already compiled).
Debug: Skipping @ispui/ng-button : es2015 (already compiled).
Debug: Skipping @ispui/ng-chip : es2015 (already compiled).
Debug: Skipping @ispui/ng-close : es2015 (already compiled).
Debug: Skipping @ispui/ng-confirm : es2015 (already compiled).
Debug: Skipping @ispui/ng-link : es2015 (already compiled).
Debug: Skipping @ispui/ng-progress-bar : es2015 (already compiled).
Debug: Skipping @ispui/ng-spinner : es2015 (already compiled).
Debug: Skipping @ispui/ng-toast : es2015 (already compiled).
Debug: Skipping @ispui/ng-toggle : es2015 (already compiled).
Debug: Skipping @ispui/ng-tooltip : es2015 (already compiled).
Debug: Skipping @ngispui/collapse : module (already compiled).
Debug: Skipping @ngispui/desc : module (already compiled).
Debug: Skipping @ngispui/dlist : module (already compiled).
Debug: Skipping @ngispui/dropdown : es2015 (already compiled).
Debug: Skipping @ngispui/keycodes : main (already compiled).
Debug: Skipping @ngispui/file : module (already compiled).
Debug: Skipping @ngispui/grid-list : module (already compiled).
Debug: Skipping @ngispui/indicator : module (already compiled).
Debug: Skipping @ngispui/input-prefix : module (already compiled).
Debug: Skipping @ngispui/input-range-slider : module (already compiled).
Debug: Skipping @ngispui/sticky : module (already compiled).
Debug: Skipping @ngispui/modal : module (already compiled).
Debug: Skipping @ngispui/navigation : module (already compiled).
Debug: Skipping @ngispui/button : module (already compiled).
Debug: Skipping @ngispui/checkbox : module (already compiled).
Debug: Skipping @ngispui/selection : main (already compiled).
Debug: Skipping @ngispui/switch : es2015 (already compiled).
Debug: Skipping @ngispui/select : es2015 (already compiled).
Debug: Skipping @ngispui/pagination : module (already compiled).
Debug: Skipping ngx-window-token : es2015 (already compiled).
Debug: Skipping ngx-clipboard : es2015 (already compiled).
Debug: Skipping @ngispui/label : module (already compiled).
Debug: Skipping @ngispui/link : module (already compiled).
Debug: Skipping @ngispui/password : module (already compiled).
Debug: Skipping @ngispui/preloader : module (already compiled).
Debug: Skipping @ngispui/preloader-bar : module (already compiled).
Debug: Skipping @ngispui/rating : module (already compiled).
Debug: Skipping @ngispui/selection-list : module (already compiled).
Debug: Skipping @ngispui/slide-toggle : module (already compiled).
Debug: Skipping @ngispui/sort-indicator : module (already compiled).
Debug: Skipping @ngispui/switcher : module (already compiled).
Debug: Skipping @ngispui/table : es2015 (already compiled).
Debug: Skipping @ngispui/table-sticky : es2015 (already compiled).
Debug: Skipping @ngispui/tree : es2015 (already compiled).
Debug: Skipping @ngispui/vlist : module (already compiled).
Debug: Skipping @ngispui/vmenu : module (already compiled).
Debug: Skipping @ngispui/vtab : es2015 (already compiled).
Debug: Skipping @ngispui/warning : module (already compiled).
Debug: Skipping @ngx-formly/core : es2015 (already compiled).
Debug: Skipping @ngx-formly/core/json-schema : es2015 (already compiled).
Debug: Skipping @ngx-formly/core/select : es2015 (already compiled).
Debug: Skipping @ngx-translate/http-loader : es2015 (already compiled).
Debug: Skipping @nicky-lenaers/ngx-scroll-to : es2015 (already compiled).
Debug: Skipping angular-pipes : es2015 (already compiled).
Debug: Skipping angular2-text-mask : main (already compiled).
Debug: Skipping ngx-filesaver : es2015 (already compiled).
Debug: Skipping ngx-monaco-editor : es2015 (already compiled).
Debug: Skipping ngx-permissions : es2015 (already compiled).
Debug: Skipping ngx-quicklink : es2015 (already compiled).
Debug: Skipping ngx-translate-messageformat-compiler : es2015 (already compiled).
Debug: Skipping @ispdevkit/api-base : es2015 (already compiled).
Debug: Skipping @vepp/core-api : es2015 (already compiled).
Debug: Skipping @vepp/validator-api : es2015 (already compiled).
Debug: Analyzed 149 entry-points in 1.2s. (Total tasks: 0)
Debug: Attempting to remove lock-file at E:/home/angular/isp/vepp-front/node_modules/@angular/compiler-cli/ngcc/__ngcc_lock_file__.
Debug: PIDs match (17984), so removing E:/home/angular/isp/vepp-front/node_modules/@angular/compiler-cli/ngcc/__ngcc_lock_file__.
Debug: Run ngcc in 3s.
Debug: Starting unlocker at process 16064 on behalf of process 17984
Debug: The lock-file path is E:/home/angular/isp/vepp-front/node_modules/@angular/compiler-cli/ngcc/__ngcc_lock_file__
Debug: Attempting to remove lock-file at E:/home/angular/isp/vepp-front/node_modules/@angular/compiler-cli/ngcc/__ngcc_lock_file__.
Debug: The lock-file at E:/home/angular/isp/vepp-front/node_modules/@angular/compiler-cli/ngcc/__ngcc_lock_file__ was already removed.

Total time here: ~ 22 sec
before if (status !== 0) {

0% compiling here

<w> [webpack.Progress] 45566ms building
<i> [webpack.Progress] 299ms finish module graph
<i> [webpack.Progress] 107ms chunk graph
<w> [webpack.Progress] 1630ms module optimization
<i> [webpack.Progress] 46ms advanced chunk optimization
<i> [webpack.Progress] 33ms before module ids
<i> [webpack.Progress] 26ms module id optimization
<i> [webpack.Progress] 21ms after chunk id optimization
<i> [webpack.Progress] 135ms hashing
<i> [webpack.Progress] 347ms chunk assets processing
<i> [webpack.Progress] 45ms additional chunk assets processing
<w> [webpack.Progress] 4068ms after chunk asset optimization
<i> [webpack.Progress] 518ms emitting

Total time here: ~ 318 sec

Generating ES5 bundles for differential loading...
ES5 bundle generation complete.
chunk {polyfills} polyfills-es2015.js, polyfills-es2015.js.map (polyfills) 303 kB [initial] [rendered]
chunk {polyfills-es5} polyfills-es5.js, polyfills-es5.js.map (polyfills-es5) 839 kB [initial] [rendered]
chunk {2} 2-es2015.js, 2-es2015.js.map () 3.29 kB  [rendered]
chunk {2} 2-es5.js, 2-es5.js.map () 4.78 kB  [rendered]
...
chunk {webcomponents-shadycss-custom-style-interface-min} webcomponents-shadycss-custom-style-interface-min-es5.js, webcomponents-shadycss-custom-style-interface-min-es5.js.map (webcomponents-shadycss-custom-style-interface-min) 5.27 kB  [rendered]
chunk {view-overview-overview-module} view-overview-overview-module-es2015.js, view-overview-overview-module-es2015.js.map (view-overview-overview-module) 238 kB  [rendered]
chunk {view-overview-overview-module} view-overview-overview-module-es5.js, view-overview-overview-module-es5.js.map (view-overview-overview-module) 261 kB  [rendered]
Date: 2020-05-30T05:57:09.169Z - Hash: 9d13cc1a7e6f980bcb26 - Time: 384599ms

chrome-profiler-events-es2015.zip speed-measure-plugin-es2015.zip

petebacondarwin commented 4 years ago

So this appears to rule out ngcc as the bottle neck:

Debug: Run ngcc in 3s.

Although it is strange that the CLI reports that it takes 22 secs to get to the end of the ngcc processing...

The 3s timing is wrapped around the entire ngcc executable - but it might not include the time for the CLI to create the child process and the time it takes to load up the ngcc source files and parse them by the node.js runtime.

Also it is very strange that the sum of the individual build steps, marked [webpack.Progress], comes to ~52s. so I am not sure where the rest of the time is being spent to get to ~ 318 sec.

briosheje commented 4 years ago

So this appears to rule out ngcc as the bottle neck:

Debug: Run ngcc in 3s.

Although it is strange that the CLI reports that it takes 22 secs to get to the end of the ngcc processing...

The 3s timing is wrapped around the entire ngcc executable - but it might not include the time for the CLI to create the child process and the time it takes to load up the ngcc source files and parse them by the node.js runtime.

Also it is very strange that the sum of the individual build steps, marked [webpack.Progress], comes to ~52s. so I am not sure where the rest of the time is being spent to get to ~ 318 sec.

Not sure whether it's relevant, but from a very very initial analysis I can foresee that in my case there definitely is something wrong when processing scss files:

Child html-webpack-plugin for "index.html":
     1 asset
    Entrypoint undefined = index.html
    [MFLM] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 4.78 KiB {0} [built]
        factory:270249ms building:21ms = 270270ms
    [YuTi] (webpack)/buildin/module.js 497 bytes {0} [built]
        [MFLM] 270270ms -> [LvDl] 148ms -> factory:95ms building:0ms = 270513ms
    [yLpj] (webpack)/buildin/global.js 472 bytes {0} [built]
        [MFLM] 270270ms -> [LvDl] 148ms -> factory:95ms building:0ms = 270513ms
        + 1 hidden module
Child mini-css-extract-plugin node_modules/css-loader/dist/cjs.js!node_modules/sass-loader/dist/cjs.js!src/styles/styles.scss:
    Entrypoint mini-css-extract-plugin = *
    [+7B6] ./src/styles/material-design-iconic-font/fonts/materialdesignicons-webfont.woff2?v=1.8.36 90 bytes {0} [built]
        [j2Vk] 4409ms -> [dnHE] 518ms -> factory:419ms building:2ms = 5348ms
    [+9Kp] ./src/theming/assets/scss/icons/flag-icon-css/flags/lc.svg 63 bytes {0} [built]
        [j2Vk] 4409ms -> [QQ58] 518ms -> factory:588ms building:0ms = 5515ms
    [+PDx] ./src/theming/assets/scss/icons/flag-icon-css/flags/pl.svg 63 bytes {0} [built]
        [j2Vk] 4409ms -> [QQ58] 518ms -> factory:588ms building:0ms = 5515ms
    [+Zfz] ./src/theming/assets/scss/icons/flag-icon-css/flags/qa.svg 63 bytes {0} [built]
        [j2Vk] 4409ms -> [QQ58] 518ms -> factory:588ms building:0ms = 5515ms
    [+nzb] ./src/theming/assets/scss/icons/flag-icon-css/flags/gn.svg 63 bytes {0} [built]
        [j2Vk] 4409ms -> [QQ58] 518ms -> factory:588ms building:0ms = 5515ms
    [72vF] ./src/styles/icons/dxicons.woff2 70 bytes {0} [built]
        [j2Vk] 4409ms -> factory:517ms building:1ms dependencies:421ms = 5348ms
    [7F9f] ./src/styles/icons/dxicons.ttf 68 bytes {0} [built]
        [j2Vk] 4409ms -> factory:517ms building:1ms dependencies:421ms = 5348ms
    [JQQE] ./src/styles/icons/dxicons.woff 69 bytes {0} [built]
        [j2Vk] 4409ms -> factory:517ms building:1ms dependencies:421ms = 5348ms
    [LNrM] ./node_modules/css-loader/dist/cjs.js!./src/theming/assets/scss/icons/simple-line-icons/css/simple-line-icons.css 16.5 KiB {0} [built]
        [j2Vk] 4409ms -> factory:517ms building:1ms dependencies:421ms = 5348ms
    [M9Nd] ./node_modules/css-loader/dist/cjs.js!./src/theming/assets/scss/icons/themify-icons/themify-icons.css 21.9 KiB {0} [built]
        [j2Vk] 4409ms -> factory:517ms building:1ms dependencies:421ms = 5348ms
    [QQ58] ./node_modules/css-loader/dist/cjs.js!./src/theming/assets/scss/icons/flag-icon-css/flag-icon.min.css 62.3 KiB {0} [built]
        [j2Vk] 4409ms -> factory:517ms building:1ms dependencies:421ms = 5348ms
    [dnHE] ./node_modules/css-loader/dist/cjs.js!./src/styles/material-design-iconic-font/css/materialdesignicons.min.css 82.6 KiB {0} [built]
        [j2Vk] 4409ms -> factory:517ms building:1ms dependencies:421ms = 5348ms
    [euFy] ./node_modules/css-loader/dist/cjs.js!./src/theming/assets/scss/icons/crypto-icons/cryptocoins.css 24.2 KiB {0} [built]
        [j2Vk] 4409ms -> factory:517ms building:1ms dependencies:421ms = 5348ms
    [j2Vk] ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/styles/styles.scss 878 KiB {0} [built] [5 warnings]
        factory:3ms building:4406ms = 4409ms
    [u9kA] ./node_modules/css-loader/dist/cjs.js!./src/theming/assets/scss/icons/weather-icons/css/weather-icons.min.css 25.4 KiB {0} [built]
        [j2Vk] 4409ms -> factory:517ms building:1ms dependencies:421ms = 5348ms
        + 285 hidden modules

Isn't 4409ms a bit too much when processing icons?

At this point, I wonder whether it might be that it's rather a webpack issue and nothing related to angular ngcc at all.

vivainio commented 4 years ago

ngcc seems very slow with Angular 9.1 (Windows 10, node 10.16.0), every module takes > 500ms, while in 9.0 it took < 10ms.

Here are the bad numbers for Angular 9.1.9:

NgccProcessor.processModule.ngcc.process+url: 525.810ms
NgccProcessor.processModule.ngcc.process+util: 648.198ms
NgccProcessor.processModule.ngcc.process+querystring: 554.056ms
NgccProcessor.processModule.ngcc.process+selenium-webdriver/chrome: 571.471ms
NgccProcessor.processModule.ngcc.process+selenium-webdriver/firefox: 577.600ms
NgccProcessor.processModule.ngcc.process+selenium-webdriver/http: 516.081ms
NgccProcessor.processModule.ngcc.process+selenium-webdriver/remote: 617.139ms
NgccProcessor.processModule.ngcc.process+@angular/material/table: 530.776ms
NgccProcessor.processModule.ngcc.process+@angular/cdk/table: 646.601ms
NgccProcessor.processModule.ngcc.process+@angular/material/paginator: 615.905ms
NgccProcessor.processModule.ngcc.process+@angular/material/sort: 599.321ms
NgccProcessor.processModule.ngcc.process+@angular/material/select: 563.546ms
NgccProcessor.processModule.ngcc.process+@angular/material/form-field: 572.500ms
NgccProcessor.processModule.ngcc.process+broadcast-channel: 801.551ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/da: 513.703ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/de: 542.033ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/en: 680.970ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/es: 540.271ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/et: 645.216ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/fi: 527.103ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/fr: 508.534ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/hu: 581.784ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/it: 584.718ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/ja: 523.064ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/ko: 516.557ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/ms: 550.808ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/nb: 544.732ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/nl: 521.589ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/pl: 515.576ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/pt: 533.402ms

Here are the good numbers for Angular 9.0.7:

NgccProcessor.processModule.ngcc.process+@angular/cdk/table: 3.321ms
NgccProcessor.processModule.ngcc.process+@angular/material/paginator: 3.089ms
NgccProcessor.processModule.ngcc.process+@angular/material/sort: 4.990ms
NgccProcessor.processModule.ngcc.process+@angular/material/select: 3.305ms
NgccProcessor.processModule.ngcc.process+@angular/material/form-field: 3.061ms
NgccProcessor.processModule.ngcc.process+broadcast-channel: 4.268ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/da: 3.226ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/de: 2.990ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/en: 3.305ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/es: 2.944ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/et: 4.199ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/fi: 2.915ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/fr: 5.085ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/hu: 2.640ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/it: 2.817ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/ja: 6.322ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/ko: 2.719ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/ms: 3.336ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/nb: 2.975ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/nl: 6.432ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/pl: 3.333ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/pt: 3.925ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/ru: 4.633ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/sv: 3.236ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/te: 3.493ms
NgccProcessor.processModule.ngcc.process+@angular/common/locales/tr: 2.745ms

AOT is off in both builds.

petebacondarwin commented 4 years ago

@vivainio - you probem might be related to use parsing the tsconfig.json on each pass. This was improved in 9.1.10. See https://github.com/angular/angular/blob/master/CHANGELOG.md#performance-improvements

Can you try that version?

vivainio commented 4 years ago

@petebacondarwin I can confirm 9.1.10 fixed the ngcc performance problem. Pretty much every ngcc invocation took < 2msec. Woohoo!

petebacondarwin commented 4 years ago

That's great!

bree7e commented 4 years ago

Two days ago, I found a problem in my project. In the tsconfig.json file there were sections" files "and" include "

{
  "compilerOptions": {
    "types": ["node", "jest" ]
  },
  "extends": "../../tsconfig.json",
  "files": ["src/main.ts", "src/polyfills.ts"],
  "include": [
    "src/**/*.d.ts"
  ]
}

And the same sections in the file tsconfig.app.json

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "../../dist/out-tsc",
    "types": []
  },
  "files": ["src/main.ts", "src/polyfills.ts"],
  "exclude": ["src/test.ts", "**/*.spec.ts"]
}

I deleted "files" and "include" in tsconfig.json and the project began to build as quickly as in Angular 8 🎉. But the tests still took 5 minutes to build. However, I upgraded to 9.1.10 yesterday and the tests build quickly. Everything works well 🎉🎉🎉.

mohyeid commented 4 years ago

Ok, to confirm if anyone is facing any issues related to this, what you need to upgrade is @angular/compiler-cli@9.1.10. This solved our issue

piernik commented 4 years ago

I also can confirm that this is working. Thanks!

briosheje commented 4 years ago

I can confirm as well that with 9.1.11 the issue is resolved, compile times are back to what it was in my case with angular 6, which is about 40 seconds to 1 minute, which is feasible in my scenario according to the project overall complexity.

Roaders commented 4 years ago

version 9.1.12 brings my compile time down from over 7 minutes to under 1. THANK GOD!

petebacondarwin commented 4 years ago

Wow! Glad you are back to a reasonable time @Roaders

angular-automatic-lock-bot[bot] commented 4 years ago

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.