Problem with React Spectrum Provider automatically applies scale client-side

[phuctm97]

React Spectrum Provider automatically applies scale client-side depending on the device size, which causes a flicky effect on initial render. Is it expected behavior or is there any recommendation for handling this?

[snowystinger]

This is expected behavior. If you can determine the device ahead of time, you can apply the scale to the provider ahead of time.
You can also delay showing the application until after first render.

[phuctm97]

Thanks for the quick reply. Is there a way to set scale/color scheme through a CSS class/attribute? Because if that's possible, a script can detect the device and set the CSS flag client-side before the app renders, which can avoid the flicky effect (how next-themes does it)