Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Redesign dependency list, reducing dependencies where possible. #448

Merged
merged 2 commits into from
Sep 28, 2022

Conversation

kaladay
Copy link
Contributor

@kaladay kaladay commented Sep 28, 2022

Resolves #445

The @ngrx/store-devtools is being included in production code. Follow the design suggested here https://ngrx.io/guide/store-devtools/recipes/exclude . This design conditionally removes the devtools when building production (taking advantage of tree-shaking to do so). A custom devtools/instrument.ts and devtools/instrument.prod.ts are provided to achieve this.

The version should be something more like 2.0.3-rc.1.

Many of the dependencies are already being included. Remove the redundant dependencies, where possible. In some cases, the dependency is necessary to prevent an unwanted version from being pulled in. Remove all variable versioning and use explicit version numbers.

The ng-inline-svg is removed by other work and is now removed from the dependencies list. The css-element-queries is removed by other work and is now removed from the dependencies list.

There are problems where numerous versions of the same package are being included. This is a problem with how npm's package system is designed. Use the "overrides" section to prevent and intermix of versions. I only fixed the packages I noticed as there are quite a lot of packages (a ballpark of ~2000 dependencies).

The use of the "overrides" is also used to remove security issues. It turns out one of the dependencies is pulling in an angular 11.x dependency for @angular/core. This is the reason for some of the more serious security issues.

Several of the polyfills are now removed.

The wysiwyg uses a lot of dependencies but is not removed.

The lighthouse dependencies remain in place because several of the scripts still use them. A redesign of the scripting process might make it possible to remove this (including moving the code into the Github workflows). Lighthouse also brings in 5 moderate severity vulnerabilities due to the latest-version dependency (which is now overwritten).

Protractor has a lot of dependencies, but it will not go away so long as we are using angular 12. This is being brought in through Angular 12 dependencies but is otherwise not explicitly defined in the dependency list.

The tslint/eslint dependencies can be reduced.
This is a large task and there is already another issue for solving this. Such changes are left alone and are expected to be resolved in the other issue.

The unit tests pass for me but I am unable to run the e2e tests due to problems with the chromium webdriver version that suddenly appeared.

I made attempts and replacing karma-coverage-istanbul-reporter with karma-coverage. Problems happened, so I backed off.
Replacing karma-coverage-istanbul-reporter would allow for more dependency removals.

The build statistics are now as follows:

Initial Chunk Files | Names                |      Size
main-es5.js         | main                 |   2.94 MB
main-es2015.js      | main                 |   2.71 MB
styles.css          | styles               | 288.50 kB
polyfills-es5.js    | polyfills-es5        | 133.86 kB
polyfills-es2015.js | polyfills            |  33.25 kB

                    | Initial ES5 Total    |   3.35 MB
                    | Initial ES2015 Total |   3.03 MB

The `@ngrx/store-devtools` is being included in production code.
Follow the design suggested here https://ngrx.io/guide/store-devtools/recipes/exclude .
This design conditionally removes the devtools when building production (taking advantage of tree-shaking to do so).
A custom `devtools/instrument.ts` and `devtools/instrument.prod.ts` are provided to achieve this.

The version should be something more like 2.0.3-rc.1.

Many of the dependencies are already being included.
Remove the redundant dependencies, where possible.
In some cases, the dependency is necessary to prevent an unwanted version from being pulled in.
Remove all variable versioning and use explicit version numbers.

The `ng-inline-svg` is removed by other work and is now removed from the dependencies list.
The `css-element-queries` is removed by other work and is now removed from the dependencies list.

There are problems where numerous versions of the same package are being included.
This is a problem with how npm's package system is designed.
Use the "overrides" section to prevent and intermix of versions.
I only fixed the packages I noticed as there are quite a lot of packages (a ballpark of ~2000 dependencies).

The use of the "overrides" is also used to remove security issues.
It turns out one of the dependencies is pulling in an angular 11.x dependency for `@angular/core`.
This is the reason for some of the more serious security issues.

Several of the polyfills are now removed.

The wysiwyg uses a lot of dependencies but is not removed.

The lighthouse dependencies remain in place because several of the scripts still use them.
A redesign of the scripting process might make it possible to remove this (including moving the code into the Github workflows).
Lighthouse also brings in `5 moderate severity vulnerabilities` due to the `latest-version` dependency (which is now overwritten).

Protractor has a lot of dependencies, but it will not go away so long as we are using angular 12.
This is being brought in through Angular 12 dependencies but is otherwise not explicitly defined in the dependency list.

The tslint/eslint dependencies can be reduced.
This is a large task and there is already another issue for solving this.
Such changes are left alone and are expected to be resolved in the other issue.

The unit tests pass for me but I am unable to run the e2e tests due to problems with the chromium webdriver version that suddenly appeared.

I made attempts and replacing `karma-coverage-istanbul-reporter` with `karma-coverage`.
Problems happened, so I backed off.
Replacing `karma-coverage-istanbul-reporter` would allow for more dependency removals.

The build statistics are now as follows:
```
Initial Chunk Files | Names                |      Size
main-es5.js         | main                 |   2.94 MB
main-es2015.js      | main                 |   2.71 MB
styles.css          | styles               | 288.50 kB
polyfills-es5.js    | polyfills-es5        | 133.86 kB
polyfills-es2015.js | polyfills            |  33.25 kB

                    | Initial ES5 Total    |   3.35 MB
                    | Initial ES2015 Total |   3.03 MB
```
@kaladay kaladay requested review from mumptastic, jeremythuff and a user September 28, 2022 19:45
@kaladay kaladay merged commit b67eaec into staging Sep 28, 2022
@kaladay kaladay deleted the 445-reduce_dependencies branch December 9, 2022 16:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Eliminate dependencies. Lock dependency versions. Eliminate dependencies. Lock dependency versions.
1 participant