Skip to content

unused classes got added in build, tree-shaking not working propely聽#15396

Closed

Description

@Saranya13

馃悶 Bug report

Command (mark with an x)

- [ ] new
- [ ] build
- [ ] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Is this a regression?

Yes

Description

Tree-shaking not working as expected

馃敩 Reproducing steps

  1. download below sample

tree-shake.zip

  1. run "npm i"

  2. then give "ng build --prod"

check build source-
In that, "main-es5.js" and "main-es2015.js" has all modules, no tree shaking.

check string [getModuleName=function()] in bundle file , you can find it 61 times which means all other modules are imported even if they are not used. This shows unused classes are not getting tree-shaken.

馃敟 Exception or Error

While using GridAllModule , build size is 1.8mb

Screenshot (27)

While using GridModule which has less no of imported class, build size is same.

Screenshot (29)

馃實 Your Environment


"@angular/animations": "~8.2.0",
    "@angular/common": "~8.2.0",
    "@angular/compiler": "~8.2.0",
    "@angular/core": "~8.2.0",
    "@angular/forms": "~8.2.0",
    "@angular/platform-browser": "~8.2.0",
    "@angular/platform-browser-dynamic": "~8.2.0",
    "@angular/router": "~8.2.0",
"@angular-devkit/build-angular": "~0.802.0",
    "@angular/cli": "~8.2.0",
    "@angular/compiler-cli": "~8.2.0",
    "@angular/language-service": "~8.2.0",
@angular-devkit/build-optimizer@0.802.2

Anything else relevant?
#14585
#14577

Activity

  1. Saranya13 commented on Aug 21, 2019

    @Saranya13
    Author

    @alan-agius4 ,

    For your reference.

    Issue occurs in latest angular-cli version 8.2.2 also

  2. kumaresan-subramani commented on Aug 21, 2019

    @kumaresan-subramani

    Hi,

    It is working fine in below environmen:

      "dependencies": {
        "@angular/animations": "~8.0.0",
        "@angular/common": "~8.0.0",
        "@angular/compiler": "~8.0.0",
        "@angular/core": "~8.0.0",
        "@angular/forms": "~8.0.0",
        "@angular/platform-browser": "~8.0.0",
        "@angular/platform-browser-dynamic": "~8.0.0",
        "@angular/router": "~8.0.0",
        "@syncfusion/ej2-angular-charts": "^17.2.36",
        "@syncfusion/ej2-angular-grids": "^17.2.41",
        "rxjs": "~6.4.0",
        "tslib": "^1.9.0",
        "zone.js": "~0.9.1"
      },
      "devDependencies": {
        "@angular-devkit/build-angular": "~0.800.0",
         "@angular-devkit/build-optimizer": "0.800.6",
        "@angular/cli": "~8.0.0",
        "@angular/compiler-cli": "~8.0.0",
        "@angular/language-service": "~8.0.0",
        "@types/node": "~8.9.4",
        "@types/jasmine": "~3.3.8",
        "@types/jasminewd2": "~2.0.3",
        "codelyzer": "^5.0.0",
        "jasmine-core": "~3.4.0",
        "jasmine-spec-reporter": "~4.2.1",
        "karma": "~4.1.0",
        "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.0",
        "ts-node": "~7.0.0",
        "tslint": "~5.15.0",
        "typescript": "~3.4.3"
      }
    

    Please find working sample here-
    treeshake-issue.zip

  3. modified the milestones: needsTriage, Backlog on Aug 21, 2019
  4. alan-agius4 commented on Aug 21, 2019

    @alan-agius4
    Collaborator

    Hi all,

    I had a look at this issue and the reason why tree-shaking is not working is that @syncfusion packages do not specify a typings field in their package.json. This field is typically added to TypeScript generated libraries and is also part of the APF specs (https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs/preview).

    Following this PR #14998 that landed in 8.2, we are using this field to determine whether build-optimizer should try to optimize a library, if no such field is found in the package.json, build-optimizer will not perform any optimizations on that library.

    It is also paramount to mention that the @syncfusion libraries are not using TypeScript helpers such as __decorate, __extends etc... via tslib but rather these are being inlined in the bundle. The library author should enable importHelpers option found in the compilerOptions of their tsconfig.json.

    NB: In future optimizations related to TypeScript helpers replacements will be removed from build optimizer.

  5. kumaresan-subramani commented on Aug 22, 2019

    @kumaresan-subramani

    Hi all,

    I had a look at this issue and the reason why tree-shaking is not working is that @syncfusion packages do not specify a typings field in their package.json. This field is typically added to TypeScript generated libraries and is also part of the APF specs (https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs/preview).

    Following this PR #14998 that landed in 8.2, we are using this field to determine whether build-optimizer should try to optimize a library, if no such field is found in the package.json, build-optimizer will not perform any optimizations on that library.

    It is also paramount to mention that the @syncfusion libraries are not using TypeScript helpers such as __decorate, __extends etc... via tslib but rather these are being inlined in the bundle. The library author should enable importHelpers option found in the compilerOptions of their tsconfig.json.

    NB: In future optimizations related to TypeScript helpers replacements will be removed from build optimizer.

    HI @alan-agius4 ,

    Thanks for your response. While adding typings field in our packages, tree-shaking works fine as expected.

  6. clydin commented on Sep 25, 2019

    @clydin
    Member

    This issue appears to have been resolved. If this has been closed in error, please let us know.

  7. angular-automatic-lock-bot commented on Oct 26, 2019

    @angular-automatic-lock-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.

  8. locked and limited conversation to collaborators on Oct 26, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions