Testing your animation refresh rate with CSS
cohost.orgFlexible refresh rates would be a good idea. I have two that exceed 144Hz at different points (160 and 165), there are infinite more :p
I have a record player with a system like this for confirming that the speed is accurate. The turntable has a few rows of "dots" for different rpms and there's an LED light which flashes at a certain speed that then makes one row look more stable than the others, indicating the speed.
This sounds cool, but didn't work in Chrome, Chrome Canary, Edge, or Firefox on Windows for me.
In my case it's working on Chrome/Edge and Firefox on Mac OS.
Do you have Reduced Motion turned on? Works for me in Firefox.
Ah, I found the "Show animations in Windows" toggle in Windows 10. I thought it was a browser setting.
Working for me with Firefox on Ubuntu.
Sounds like something more interesting happen above or below than browser.
If anyone sees a static "image" on their iPhone, check that you have Reduced motion disabled in system Settings. I totally forgot I did that and just assumed it doesn't work on mobile.
On my phone, as long as the page is scrolling, it seems to indicate 120 Hz, but after a few seconds there is a sudden switch to 60. Not sure if the tool is working correctly.
That'll be one of the tricks your browser employs to save compute time on animations for inactive tabs/windows. Interact with it again and the browser will allow scripts/animations to run at full speed again.
I can get any outer ring to register depending on how fast I scroll. I think it's OLED schmearing.