Skip to content

Improve tree shake- and compressability of angular #40997

@sod

Description

@sod

If you create a blank angular project with @angular/cli and build it in production mode:
npm i -g @angular/cli; ng new ng-test; cd ng-test; ng build --prod
things you find in the bundle (354kb):

  • https://angular.io/api/common/HashLocationStrategy (even though this is opt-in and not enabled by default)
  • unused code that adds window.ng in dev mode (e.g. search for addToWindow)
  • full blown HTML sanitizer, even if you never use [innerHTML]
  • locale data even if you don't use it (e.g. search for NumberFormats)
  • 70kb of @angular/router (is that thing tree shakeable? For comparison, vue-router tree shakes every feature you don't use and at max grows to 27kb!)
  • if I just need a binding on an input, let's say <input [ngModel]="foo">, I have to import FormsModule => thats gonna be 33kb extra
Edit: Irrelevant stuff because I compiled with `"compilationMode": "partial"`:
  • code to support annotations even though your compiler removes the annotations at build time (e.g. search for __prop__metadata__ or propMetadata)
  • pre-ivy debug code (e.g. search for ._debugContext which belongs to DebugNode__PRE_R3__)
  • more debug code (e.g. search for setCurrentNode:, where one of those belong to createDebugServices with all its debug helper methods)
  • code that is only used in dev mode (e.g. search for ng-reflect- which belongs to normalizeDebugBindingName)
  • code that is only used in tests like DebugRenderer2 (e.g. search for .createDebugContext
  • tons of translations capabilities, even if you don't use angular for translating or don't translate at all (e.g. search for ICU)
  • runtime templateUrl resource resolver, even when you compile with directTemplateLoading: true

This seems highly unoptimized. Pretty sad given that angular itself is darn fast, but loses big time in the total blocking time department as the browser has to parse and run all this stuff thats not even used.

Metadata

Metadata

Assignees

Labels

area: coreIssues related to the framework runtimearea: formsarea: routercross-cutting: tree-shakingneeds reproductionThis issue needs a reproduction in order for the team to investigate furtherneeds: clarificationThis issue needs additional clarification from the reporter before the team can investigate.

Type

No type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions