CircularProgress spinner uses excessive cpu and gpu

[fatso83]

• I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

Spinner should not use much cpu or gpu

Current Behavior

Just keeping the spinner example demo open consumes approx 70% cpu and 65% GPU on my machine.

Steps to Reproduce (for bugs)

1. Open Chrome
2. Open Task Manager and observe low cpu usage
3. Go to https://codesandbox.io/s/wwjyz58948
4. Observe how the Task Manager shows the demo tab using much cpu and gpu

Context

Your Environment

As I am referring to the demo docs, all the versions are the latest.

Tech	Version
Material-UI	latest
React	latest
browser	Chrome
OS	Ubuntu 18.04
Machine	Dell XPS 9350

i7-6560U, Iris Graphics 540

[fatso83]

This might be a general problem with SVG spinners in general, mind you, but perhaps there is a common fix.

[oliviertassinari]

@fatso83 We are well aware of this problem. We have been facing this problem with the linear progress in the past. We solved it using CSS over JS: #4412. We have already been discussing this problem in #10327.

[fatso83]

I did search the issues, but it wasn't immediately obvious that #10327 related to this by reading the title. As this component is already using CSS over JS, I assume the situation can't be improved much, ref your comment:

I don't think that we could do anything to improve the current situation

Oh, well. At least the situation has been researched 👍

[oliviertassinari]

@fatso83 I wish we had some leverage :/. Hopefully, someone will submit a pull-request about it in the future.