Angular Increase page speed

Question

I am creating a project using angular.I have problem while testing the page speed in gtmatrix.. Below is the command for generating build:

ng build --prod--aot

The size of the file is 1.9mb...Bu gt matrix says speed is low due to this file...

Here is packeage

"dependencies": {
    "@angular/animations": "~10.0.2",
    "@angular/cdk": "^10.0.1",
    "@angular/common": "~10.0.2",
    "@angular/compiler": "~10.0.2",
    "@angular/core": "~10.0.2",
    "@angular/forms": "~10.0.2",
    "@angular/material": "^10.0.1",
    "@angular/platform-browser": "~10.0.2",
    "@angular/platform-browser-dynamic": "~10.0.2",
    "@angular/router": "~10.0.2",
    "@kolkov/angular-editor": "^1.1.2",
    "angular2-cookie": "^1.2.6",
    "angularx-social-login": "^3.2.0",
    "jquery": "^3.5.1",
    "moment": "^2.27.0",
    "ng-pick-datetime": "^7.0.0",
    "ng2-search-filter": "^0.5.1",
    "ngx-bootstrap": "^5.6.1",
    "ngx-cookie-service": "^3.0.4",
    "ngx-page-scroll": "^7.0.1",
    "ngx-page-scroll-core": "^7.0.1",
    "ngx-pagination": "^5.0.0",
    "ngx-toastr": "^12.1.0",
    "ngx-ui-loader": "^9.1.1",
    "rxjs": "~6.5.5",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.3"
  },

Does this answer your question? [How to test performance / load of a modern angular application](https://stackoverflow.com/questions/54405954/how-to-test-performance-load-of-a-modern-angular-application) — , Jul 17 '20 at 09:16

score 1 · Answer 1 · answered Jul 17 '20 at 09:15

You should consider lazy loading, this means loading only components, images, CSS, js that you need at the moment you need them and not at the startup of your app. You should create different modules and lazy load them when you need them. This way only a part of your app loads at startup and then it loads the rest if you need it, it will save you some time, check out the angular doc on how to set this up : https://angular.io/guide/lazy-loading-ngmodules

Angular Increase page speed

1 Answers1