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

Animations: consider dropping CssKeyframesDriver in favor of WebAnimationsDriver #44520

Closed
AndrewKushnir opened this issue Dec 17, 2021 · 3 comments
Assignees
Labels
area: animations refactoring Issue that involves refactoring or code-cleanup state: has PR
Milestone

Comments

@AndrewKushnir
Copy link
Contributor

AndrewKushnir commented Dec 17, 2021

Which @angular/* package(s) are relevant/releated to the feature request?

animations

Description

Currently we have 2 implementations of the animations driver:

  • CssKeyframesDriver
  • WebAnimationsDriver

We select which one to use in this code based on the presence of the animate function in an element's prototype (see here). Since IE is no longer supported, the animate function should be available in all supported browsers, so it looks like we can drop the CssKeyframesDriver in favor of WebAnimationsDriver.

The biggest benefit that we'd have is less code in app bundles, the way those classes are referenced is non-tree-shakable (see here): both classes would be retained in an app bundle when the BrowserAnimationsModule is used. That'd probably save a few KB.

If we decide to do that, it'd be great to implement and land the tooling to measure the bundle size and retained symbols first, see #44437. In this case we'd be able to measure the impact of this change.

@AndrewKushnir AndrewKushnir added area: animations refactoring Issue that involves refactoring or code-cleanup labels Dec 17, 2021
@ngbot ngbot bot modified the milestone: needsTriage Dec 17, 2021
@AndrewKushnir AndrewKushnir added the feature Issue that requests a new feature label Dec 17, 2021
@ngbot ngbot bot modified the milestones: needsTriage, Backlog Dec 17, 2021
@angular-robot angular-robot bot added the feature: votes required Feature request which is currently still in the voting phase label Dec 17, 2021
@angular-robot
Copy link
Contributor

angular-robot bot commented Dec 17, 2021

This feature request is now candidate for our backlog! In the next phase, the community has 60 days to upvote. If the request receives more than 20 upvotes, we'll move it to our consideration list.

You can find more details about the feature request process in our documentation.

@angular-robot
Copy link
Contributor

angular-robot bot commented Jan 25, 2022

Just a heads up that we kicked off a community voting process for your feature request. There are 20 days until the voting process ends.

Find more details about Angular's feature request process in our documentation.

AndrewKushnir added a commit to AndrewKushnir/angular that referenced this issue Jan 31, 2022
This commit removes CSS keyframes-based code that was used to support animations in old browsers. With IE11 deprecation, all supported browsers have native WebAnimations support, so the old code can be removed. This should decrease the bundle size, since most of the code was non-tree-shakable.

Closes angular#44520.
@AndrewKushnir AndrewKushnir added state: has PR and removed feature Issue that requests a new feature feature: votes required Feature request which is currently still in the voting phase labels Jan 31, 2022
@ngbot ngbot bot modified the milestones: Backlog, needsTriage Jan 31, 2022
@AndrewKushnir AndrewKushnir self-assigned this Jan 31, 2022
AndrewKushnir added a commit to AndrewKushnir/angular that referenced this issue Jan 31, 2022
This commit removes CSS keyframes-based code that was used to support animations in old browsers. With IE11 deprecation, all supported browsers have native WebAnimations support, so the old code can be removed. This should decrease the bundle size, since most of the code was non-tree-shakable.

Closes angular#44520.
AndrewKushnir added a commit to AndrewKushnir/angular that referenced this issue Jan 31, 2022
This commit removes CSS keyframes-based code that was used to support animations in old browsers. With IE11 deprecation, all supported browsers have native WebAnimations support, so the old code can be removed. This should decrease the bundle size, since most of the code was non-tree-shakable.

Closes angular#44520.
AndrewKushnir added a commit to AndrewKushnir/angular that referenced this issue Jan 31, 2022
This commit removes CSS keyframes-based code that was used to support animations in old browsers. With IE11 deprecation, all supported browsers have native WebAnimations support, so the old code can be removed. This results in ~7KB decrease of the animations package bundle size, since most of the code was non-tree-shakable.

Closes angular#44520.
AndrewKushnir added a commit to AndrewKushnir/angular that referenced this issue Jan 31, 2022
This commit removes CSS keyframes-based code that was used to support animations in old browsers. With IE11 deprecation, all supported browsers have native WebAnimations support, so the old code can be removed. This results in ~7KB decrease of the animations package bundle size, since most of the code was non-tree-shakable.

Closes angular#44520.
AndrewKushnir added a commit to AndrewKushnir/angular that referenced this issue Jan 31, 2022
…ar#44903)

This commit removes CSS keyframes-based code that was used to support animations in old browsers. With IE11 deprecation, all supported browsers have native WebAnimations support, so the old code can be removed. This results in ~7KB decrease of the animations package bundle size, since most of the code was non-tree-shakable.

Closes angular#44520.
jessicajaniuk pushed a commit that referenced this issue Jan 31, 2022
… (#44919)

This commit removes CSS keyframes-based code that was used to support animations in old browsers. With IE11 deprecation, all supported browsers have native WebAnimations support, so the old code can be removed. This results in ~7KB decrease of the animations package bundle size, since most of the code was non-tree-shakable.

Closes #44520.

PR Close #44919
@angular-automatic-lock-bot
Copy link

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 Mar 3, 2022
josmar-crwdstffng pushed a commit to josmar-crwdstffng/angular that referenced this issue Apr 8, 2022
…ar#44903)

This commit removes CSS keyframes-based code that was used to support animations in old browsers. With IE11 deprecation, all supported browsers have native WebAnimations support, so the old code can be removed. This results in ~7KB decrease of the animations package bundle size, since most of the code was non-tree-shakable.

Closes angular#44520.

PR Close angular#44903
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area: animations refactoring Issue that involves refactoring or code-cleanup state: has PR
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant