Library

React Components / v9 (@fluentui/react-components)

System Info

N/A

Are you reporting Accessibility issue?

no

Reproduction

https://codesandbox.io/s/empty-sky-8dpd3l?file=/src/App.tsx

Bug Description

Actual Behavior

Under CPU load, the spinning animation produces jank and frames are dropped because the animation relies on the main thread to update.

Expected Behavior

The animation can be offloaded to the compositor and is free from jank regardless of the CPU load. (Note: this is how the spinner imported from fluentui/react@^8.0 behaves).

Let me know if it helps to provide profiles for both the good and the perf-impacted spinner. Happy to help where possible -- my alias is magostis. Thanks!

Logs

No response

Requested priority

Normal

Products/sites affected

No response

Are you willing to submit a PR to fix?

yes

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.