CSS Animation examples inefficient ? #33426
Labels
Content:CSS
Cascading Style Sheets docs
Content:Glossary
Glossary entries
needs triage
Triage needed by staff and/or partners. Automatically applied when an issue is opened.
MDN URL
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_animations/Using_CSS_animations
What specific section or headline is this issue about?
Examples
What information was incorrect, unhelpful, or incomplete?
The example suggests to you use margins and width for animating text across the screen.
Isn't this bad for performance due to constantly needing to recalculate the layout? I feel like this should at least be mentioned somewhere in the article if the examples aren't changed.
What did you expect to see?
Animating the transform property would be the better option, as it doesn't change the layout while animating, and is actually simpler than the proposed example?
Although https://developer.mozilla.org/en-US/docs/Web/CSS/transform may need to be linked, as well
Do you have any supporting links, references, or citations?
https://developer.mozilla.org/en-US/docs/Glossary/Reflow
https://web.dev/articles/animations-guide#triggers
Do you have anything more you want to share?
No response
MDN metadata
Page report details
en-us/web/css/css_animations/using_css_animations
The text was updated successfully, but these errors were encountered: