-
Notifications
You must be signed in to change notification settings - Fork 6.8k
refactor(list): use light-weight tokens for injecting parent lists #19568
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(list): use light-weight tokens for injecting parent lists #19568
Conversation
dc8e8eb
to
f185ca3
Compare
integration/size-test/check-size.ts
Outdated
const expectedSize = Number(golden[testId]); | ||
const absoluteSizeDiff = Math.abs(actualSize - expectedSize); | ||
|
||
// Whether the size deviates by 1% from the expected. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We should document this at the top of the file where it says if the file size changes "by certain amount", to express these same values.
Alternatively, maybe these constants should be at the top of the file for easier discovery.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Rather than making this percentage based, what if it were just 1 kilobyte? Just because e.g. Overlay is big, doesn't mean we should necessarily tolerate larger size fluctuations in that package.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@jelbourn Exactly, but that's why we have an absolute byte change check too. The percentage is helpful when a change is smaller than the absolute threshold but is considered large in percentage of the expected size.
This matches the same conditions as in angular/angular
. The absolute threshold is currently 500 bytes.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@josephperrott Moved it to the top-level as constants w/ comments. That should be better, agreed.
integration/size-test/check-size.ts
Outdated
const expectedSize = Number(golden[testId]); | ||
const absoluteSizeDiff = Math.abs(actualSize - expectedSize); | ||
|
||
// Whether the size deviates by 1% from the expected. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Rather than making this percentage based, what if it were just 1 kilobyte? Just because e.g. Overlay is big, doesn't mean we should necessarily tolerate larger size fluctuations in that package.
Angular Material list items currently optionally inject a parent `MatNavList` or `MatList`. This has the downside of retaining these tokens at runtime because they are used for dependency injection as values. We can improve this by using so-called light-weight tokens. These allow us to continue injecting parent list or nav-lists, but without the risk of retaining the `MatList` and `MatNavList` classes with their factories. This was already the case before Angular v9 with View Engine, but the issue significance increases with Ivy where factories are now directly attached to the classes (such as `MatList` or `MatNavList`). Using light-weight tokens avoids this issue and gives us an additional size improvement. Notably this won't be an improvement when an application uses both the nav-list and standard `MatList`. Related to https://github.com/angular/angular-cli/issues/16866. More context on light-weight tokens in: https://hackmd.io/@mhevery/SyqDjUlrU#.
f185ca3
to
eb99a05
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM, for dev-infra
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
Angular Material list items currently optionally inject a parent
MatNavList
or
MatList
. This has the downside of retaining these tokens at runtimebecause they are used for dependency injection as values.
We can improve this by using so-called light-weight tokens. These allow
us to continue injecting parent list or nav-lists, but without the risk of
retaining the
MatList
andMatNavList
classes with their factories.This was already the case before Angular v9 with View Engine, but
the problem became significantly worse with Ivy, where factories are now
directly attached to the classes (such as
MatList
orMatNavList
).Using light-weight tokens avoids this issue and gives us an additional
size improvement. Notably this won't be an improvement when an
application uses both the nav-list and standard
MatList
.Related to angular/angular-cli#16866. More context on light-weight tokens in:
https://hackmd.io/@mhevery/SyqDjUlrU#.
Note: I'll be going through other components in the repo and send
similar changes (if applicable; and non-breaking).