Angular hot load server is having very poor performance

[siddiq-rehman]

Hello,

Recently I added the @angular-architects/module-federation to my angular 14 project. As part of that it started using ngx-build-plus as a build server.

Now the RAM usage for the angular serve is growing upto 8GB, as it was only 2GB before that. Even the time to load and build has also enormously increased.

Need help as its becoming bottleneck for the developers. Adding the dependency list here. Help will be appreciated.

"dependencies": {
"@ag-grid-community/all-modules": "^27.0.0",
"@ag-grid-community/angular": "^27.0.0",
"@ag-grid-enterprise/all-modules": "^27.0.0",
"@angular-architects/module-federation": "^15.0.3",
"@angular/animations": "^15.2.9",
"@angular/cdk": "^15.2.9",
"@angular/cli": "^15.2.8",
"@angular/common": "^15.2.9",
"@angular/compiler": "^15.2.9",
"@angular/compiler-cli": "^15.2.9",
"@angular/core": "^15.2.9",
"@angular/forms": "^15.2.9",
"@angular/material": "^15.2.9",
"@angular/platform-browser": "^15.2.9",
"@angular/platform-browser-dynamic": "^15.2.9",
"@angular/platform-server": "^15.2.9",
"@angular/router": "^15.2.9",
"@angular/service-worker": "^15.2.9",
"@ckeditor/ckeditor5-angular": "^2.0.0",
"@ckeditor/ckeditor5-build-classic": "^22.0.0",
"@fullcalendar/core": "^5.11.3",
"@ngrx/data": "^13.2.0",
"@ngrx/effects": "^13.2.0",
"@ngrx/entity": "^13.2.0",
"@ngrx/router-store": "^13.2.0",
"@ngrx/store": "^13.2.0",
"@ngrx/store-devtools": "^13.2.0",
"@ngx-pwa/local-storage": "^13.0.5",
"@ngx-translate/core": "^11.0.1",
"@ngx-translate/http-loader": "^4.0.0",
"@syncfusion/ej2": "^17.1.44",
"@syncfusion/ej2-angular-gantt": "^17.2.51",
"@types/jest": "^24.0.23",
"@types/jquery": "^3.3.31",
"@types/quill": "^2.0.2",
"ag-charts-angular": "^6.2.1",
"ag-grid-angular": "^27.0.0",
"ag-grid-autocomplete-editor": "^1.2.8",
"ag-grid-community": "^27.0.0",
"ag-grid-enterprise": "^27.0.0",
"angular-flatpickr": "^3.6.6",
"bootstrap": "^4.4.1",
"buffer": "^5.6.0",
"chart.js": "^4.0.1",
"core-js": "^2.6.9",
"datatables.net": "^1.10.20",
"datatables.net-dt": "^1.10.20",
"date-and-time": "^2.0.0",
"es6-promise": "^4.2.8",
"flatpickr": "^4.6.3",
"font-awesome": "^4.7.0",
"html2canvas": "^1.0.0-rc.3",
"jquery": "^3.6.1",
"jquery-mobile": "^1.5.0-alpha.1",
"jquery-ui-dist": "^1.12.1",
"jspdf": "^1.5.3",
"karma-coverage": "^2.2.0",
"lodash": "^4.17.15",
"ng-multiselect-dropdown": "^0.2.3",
"ng2-search-filter": "^0.4.7",
"ngrx-store-freeze": "^0.2.4",
"ngrx-store-localstorage": "^8.0.0",
"primeflex": "^2.0.0",
"primeicons": "^6.0.1",
"primeng": "^15.2.0",
"quill": "^1.3.7",
"rxjs": "^6.6.7",
"tslib": "^2.0.0",
"url-search-params-polyfill": "^5.1.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "^15.2.8",
"@angular-eslint/builder": "14.4.0",
"@angular-eslint/eslint-plugin": "14.4.0",
"@angular-eslint/eslint-plugin-template": "14.4.0",
"@angular-eslint/schematics": "14.4.0",
"@angular-eslint/template-parser": "14.4.0",
"@angular/language-service": "^15.2.9",
"@types/bootstrap": "^4.3.1",
"@types/file-saver": "^2.0.1",
"@types/jasmine": "~3.6.0",
"@types/jasminewd2": "^2.0.6",
"@types/node": "^12.11.1",
"@typescript-eslint/eslint-plugin": "^5.36.2",
"@typescript-eslint/parser": "^5.36.2",
"eslint": "^8.23.0",
"eslint-plugin-import": "latest",
"eslint-plugin-jsdoc": "latest",
"eslint-plugin-prefer-arrow": "latest",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~6.4.0",
"karma-chrome-launcher": "~3.1.0",
"karma-cli": "^2.0.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"karma-jquery": "^0.2.4",
"ngx-build-plus": "^14.0.0",
"protractor": "~7.0.0",
"ts-node": "~5.0.1",
"typescript": "^4.8.4"
}