Skip to content

fix(material/progress-bar): changing the value repaints other progress bars #23129

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

Closed
wants to merge 1 commit into from
Closed

fix(material/progress-bar): changing the value repaints other progress bars #23129

wants to merge 1 commit into from

Conversation

framasev
Copy link

@framasev framasev commented Jul 7, 2021

Create a new compositor layer to reduce repaint areas by providing will-change and z-index.

Fixes #19873

@google-cla google-cla bot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Jul 7, 2021
@@ -61,6 +61,10 @@ $mat-progress-bar-piece-animation-duration: 250ms !default;
transform-origin: top left;
transition: transform $mat-progress-bar-piece-animation-duration ease;

// Prevents elements from extra repainting due to `transition`.
will-change: transform;
z-index: 1;
Copy link
Member

@crisbeto crisbeto Jul 7, 2021

Choose a reason for hiding this comment

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

I just tried it out, but I can see the other progress bars repainting even after these changes. Would it make sense to put a translateZ(0) on the parent instead? Also for what it's worth, I'm sure what performance implications this would have, considering that the element is relatively small and you usually only have one of them at a time.

@framasev framasev closed this Oct 21, 2021
@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 Nov 21, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
cla: yes PR author has agreed to Google's Contributor License Agreement
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Changing the value of one progress bar repaints other progress bars on the same page
2 participants