Skip to content

refactor(ivy): evaluate map-based styling bindings with a new algorithm - #30543

Closed
matsko wants to merge 1 commit into
angular:masterfrom
matsko:styling_refactor_style_and_class_maps
Closed

matsko wants to merge 1 commit into
angular:masterfrom
matsko:styling_refactor_style_and_class_maps

Conversation

@matsko

@matsko matsko commented May 17, 2019 •

Copy link
Copy Markdown
Contributor

This patch in the second runtime change which refactors how styling
bindings work in Angular. This patch refactors how map-based
[style] and [class] bindings work using a new algorithm which
is faster and less complex than the former one.

This patch is a follow-up to an earlier refactor which enabled
support for prop-based [style.name] and [class.name]
bindings (see f03475c).

@matsko matsko added comp: ivy target: major This PR is targeted for the next major release labels May 17, 2019
@ngbot ngbot Bot added this to the needsTriage milestone May 17, 2019
@matsko
matsko force-pushed the styling_refactor_style_and_class_maps branch 5 times, most recently from e3fef6f to 56cbc2f Compare May 23, 2019 06:01
@matsko
matsko requested a review from mhevery May 23, 2019 06:02
@matsko

matsko commented May 23, 2019

Copy link
Copy Markdown
Contributor Author

@matsko
matsko force-pushed the styling_refactor_style_and_class_maps branch 6 times, most recently from 4e52ce4 to ba2ebb6 Compare May 23, 2019 19:56

@mhevery mhevery left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

with minor comments

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Why not just use ngDevModeResetPerfCounters?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

fixed.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Can you add a tests with the nulled value in the middle. Right now it is not clear if the fontSize just happens to be at the end or of all null values are at the end.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

fixed.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Why did the indexes change +1?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

The first index (zero in this case) is reserved for map-based bindings.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Why are you chocking if it is an array? When would it not be an array? Seems like unneeded check to me.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Array.isArray() checks for the presence of LStylingMap. This function is called both for map-based bindings (which have a LStylingMap value) as well as prop-based bindings (which are just raw values). So both cases are needed.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

we discussed that this check is not the most efficient, https://jsperf.com/value-vs-string-comparison Not sure it is worth the trouble though.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

This only happens during debug mode. Not in the actual algorithm. I made sure of that.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

The reason why it's in the util.ts file is because the constant is in there.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Why is this written this way rather than as a simple function syncStylingMap(...)?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

This is the only way I can have it respect the interface. The only way I can find having a function respect an interface is via it being a variable.

// works
const x: FnType = function() { }

// doesn't work
function x() { } as FnType

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Suggested change
* If there any map-based entries present (which are applied to the
* If there are any map-based entries present (which are applied to the

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

fixed.

@mhevery mhevery added the action: cleanup The PR is in need of cleanup, either due to needing a rebase or in response to comments from reviews label May 24, 2019
@matsko
matsko force-pushed the styling_refactor_style_and_class_maps branch 2 times, most recently from 644cd86 to bac99d8 Compare May 24, 2019 17:45
This patch in the second runtime change which refactors how styling
bindings work in Angular. This patch refactors how map-based
`[style]` and `[class]` bindings work using a new algorithm which
is faster and less complex than the former one.

This patch is a follow-up to an earlier refactor which enabled
support for prop-based `[style.name]` and `[class.name]`
bindings (see f03475c).
@matsko
matsko force-pushed the styling_refactor_style_and_class_maps branch from bac99d8 to 6b62155 Compare May 24, 2019 17:46
@matsko matsko added action: merge The PR is ready for merge by the caretaker and removed action: cleanup The PR is in need of cleanup, either due to needing a rebase or in response to comments from reviews labels May 24, 2019
@matsko
matsko marked this pull request as ready for review May 24, 2019 17:51
@matsko
matsko requested review from a team May 24, 2019 17:51
@matsko

matsko commented May 24, 2019

Copy link
Copy Markdown
Contributor Author

@matsko matsko closed this in dc6406e May 24, 2019
alxhub added a commit to alxhub/angular that referenced this pull request May 24, 2019
This fixes a collision between angular#30639 and angular#30543 where the latter added
usages of @ViewChild without the static flag present, but the former
made the flag required.
@angular-automatic-lock-bot

Copy link
Copy Markdown

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.

@angular-automatic-lock-bot angular-automatic-lock-bot Bot locked and limited conversation to collaborators Sep 15, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

action: merge The PR is ready for merge by the caretaker cla: yes target: major This PR is targeted for the next major release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants