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

refactor(store): tree-shake internal state tokens #2246

Merged
merged 1 commit into from
Nov 12, 2024
Merged

Conversation

arturovt
Copy link
Member

@arturovt arturovt commented Nov 3, 2024

In this commit, we remove internal injection token providers from the root providers list. Instead, we expose a function that provides these tokens.

Copy link

nx-cloud bot commented Nov 3, 2024

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 0a93595. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this CI Pipeline Execution


✅ Successfully ran 4 targets

Sent with 💌 from NxCloud.

Copy link

pkg-pr-new bot commented Nov 3, 2024

Open in Stackblitz

@ngxs/devtools-plugin

yarn add https://pkg.pr.new/@ngxs/[email protected]

@ngxs/form-plugin

yarn add https://pkg.pr.new/@ngxs/[email protected]

@ngxs/hmr-plugin

yarn add https://pkg.pr.new/@ngxs/[email protected]

@ngxs/router-plugin

yarn add https://pkg.pr.new/@ngxs/[email protected]

@ngxs/storage-plugin

yarn add https://pkg.pr.new/@ngxs/[email protected]

@ngxs/store

yarn add https://pkg.pr.new/@ngxs/[email protected]

@ngxs/websocket-plugin

yarn add https://pkg.pr.new/@ngxs/[email protected]

commit: 0a93595

Copy link

bundlemon bot commented Nov 3, 2024

BundleMon

Files updated (2)
Status Path Size Limits
fesm2022/ngxs-store.mjs
102.86KB (+368B +0.35%) 103KB / +0.5%
fesm2022/ngxs-store-internals.mjs
11.33KB (+32B +0.28%) 13KB / +0.5%
Unchanged files (4)
Status Path Size Limits
fesm2022/ngxs-store-internals-testing.mjs
6.83KB 7KB / +0.5%
fesm2022/ngxs-store-operators.mjs
6.22KB 7KB / +0.5%
fesm2022/ngxs-store-plugins.mjs
2.04KB 3KB / +0.5%
fesm2022/ngxs-store-experimental.mjs
1.4KB 2KB / +0.5%

Total files change +400B +0.3%

Groups updated (2)
Status Path Size Limits
@ngxs/store(esm2022)[gzip]
./esm2022/**/*.mjs
225.62KB (+1.44KB +0.64%) +1%
@ngxs/store(fesm2022)[gzip]
./fesm2022/*.mjs
31.29KB (+168B +0.53%) +1%

Final result: ✅

View report in BundleMon website ➡️


Current branch size history | Target branch size history

Copy link

bundlemon bot commented Nov 3, 2024

BundleMon (NGXS Plugins)

Unchanged files (9)
Status Path Size Limits
Plugins(fesm2022)[gzip]
storage-plugin/fesm2022/ngxs-storage-plugin.m
js
4.16KB +0.5%
Plugins(fesm2022)[gzip]
router-plugin/fesm2022/ngxs-router-plugin.mjs
3.19KB +0.5%
Plugins(fesm2022)[gzip]
websocket-plugin/fesm2022/ngxs-websocket-plug
in.mjs
2.64KB +0.5%
Plugins(fesm2022)[gzip]
hmr-plugin/fesm2022/ngxs-hmr-plugin.mjs
2.61KB +0.5%
Plugins(fesm2022)[gzip]
form-plugin/fesm2022/ngxs-form-plugin.mjs
2.59KB +0.5%
Plugins(fesm2022)[gzip]
devtools-plugin/fesm2022/ngxs-devtools-plugin
.mjs
2.23KB +0.5%
Plugins(fesm2022)[gzip]
logger-plugin/fesm2022/ngxs-logger-plugin.mjs
2.03KB +0.5%
Plugins(fesm2022)[gzip]
storage-plugin/fesm2022/ngxs-storage-plugin-i
nternals.mjs
875B +0.5%
Plugins(fesm2022)[gzip]
router-plugin/fesm2022/ngxs-router-plugin-int
ernals.mjs
411B +0.5%

No change in files bundle size

Unchanged groups (1)
Status Path Size Limits
All Plugins(fesm2022)[gzip]
./-plugin/fesm2022/.mjs
20.71KB +0.5%

Final result: ✅

View report in BundleMon website ➡️


Current branch size history | Target branch size history

Copy link

bundlemon bot commented Nov 3, 2024

BundleMon (Integration Projects)

Files updated (3)
Status Path Size Limits
Main bundles(Gzip)
hello-world-ng17/dist-integration/main.(hash)
.js
68.51KB (-22B -0.03%) +1%
Main bundles(Gzip)
hello-world-ng16/dist-integration/main.(hash)
.js
67.61KB (-33B -0.05%) +1%
Main bundles(Gzip)
hello-world-ng18/dist-integration/browser/mai
n-(hash).js
71.62KB (-56B -0.08%) +1%

Total files change -111B -0.05%

Final result: ✅

View report in BundleMon website ➡️


Current branch size history | Target branch size history

Copy link
Member

@markwhitfeld markwhitfeld left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm trying to understand the motivation here?
What is the practical benefit of the tree shaking? What problem are we solving?

@arturovt
Copy link
Member Author

arturovt commented Nov 8, 2024

Tokens are removed from the bundle.

In this commit, we remove internal injection token providers from the root providers list.
Instead, we expose a function that provides these tokens.
Copy link

codeclimate bot commented Nov 10, 2024

Code Climate has analyzed commit 0a93595 and detected 0 issues on this pull request.

The test coverage on the diff in this pull request is 90.0% (50% is the threshold).

This pull request will bring the total coverage in the repository to 95.3% (0.0% change).

View more on Code Climate.

@arturovt arturovt merged commit 2699787 into master Nov 12, 2024
18 checks passed
@arturovt arturovt deleted the refactor/tokens branch November 12, 2024 11:50
@arturovt
Copy link
Member Author

Merging because I want to proceed with the next patch release. This change only reduces the bundle size by removing tokens that are not used in standard apps. These tokens were previously exposed as part of the ngxs-labs/data package.

import {
ɵStateClass,
ɵNGXS_STATE_CONTEXT_FACTORY,
ɵNGXS_STATE_FACTORY,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@arturovt ɵNGXS_STATE_FACTORY is used by @angular-ru/ngxs

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

They will need to use the ɵprovideNgxsInternalStateTokens in their providers list.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How do you inject the factory without having access to the injection token? State factory itself is used in the code.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can still inject the factory through the token.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Through which token?

Copy link
Member Author

@arturovt arturovt Nov 12, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't understand the phrase "having access to the token". Why don't you have access to the token?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ngxs no longer exports ɵNGXS_STATE_FACTORY and ɵNGXS_STATE_CONTEXT_FACTORY tokens after this PR was merged.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It didn't export it before either.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, my bad. For some reason instead of import, I thought export was removed. The tokens are still exported from @ngxs/store/internals. I'll try to use ɵprovideNgxsInternalStateTokens() to see if it fixes the issue.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ɵprovideNgxsInternalStateTokens() fixes the issue. Sorry for the confusion.

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.

3 participants