Show HN: Avoid smooth spinners, use low-FPS spinners
2 days ago (nh2.me)
I got so annoyed by various apps (VScode, Chromium, Firefox, Thunderbird) burning CPU/GPU cycles and and making my laptop hot and sluggish with spinners on otherwise static content, that I made this little page to fight this.
Your claimed GPU usage seems really high for a simple spinner, even considering the CPU is pretty old. I wonder if there's some other problem going on with your setup.
I don't think so. This is just what happens when you redraw the screen.
Doing it 30x more frequent than needed costs more, no matter if it's only 1 pixel.
This problem is not isolated to me or to just one machine. Check out the chromium bug about the tab loading spinner, for example. It is a "simple" spinner as well.
Or the Zed editor, which spams screen redraws even when nothing changes at all, so it has high GPU usage for still picture.
It should not cost a visible fraction of CPU/GPU to update a little sprite even at 30fps.
7 replies →
I miss the 1 update per second animations of ye olden times, even if it would be ugly as sin in a modern product.
I'm on mobile so I'm not able to check, but can the will-change and contain attributes reduce the cost?
1 reply →
Those aren’t spinners (also called numeric updowns, see [1]). Those are throbbers (also called loading icons, see [2]).
[1]: https://en.wikipedia.org/wiki/Spinner_(computing)
[2]: https://en.wikipedia.org/wiki/Throbber
> [1]: https://en.wikipedia.org/wiki/Spinner_(computing)
Hah, I did not expect that. I can't imagine any end users will be able to name that one.
This is a rare instance where I think Wikipedia is plain wrong. Maybe the process to have multiple pages renamed is onerous? The thing in the original post I've usually heard to be called spinners, while this input element, which I'm not sure I've ever even seen, doesn't seem to have its name justified in any way on the Wikipedia page either. I can't really tell why it'd desperately need a concise name either, it's basically a numeric input with extra controls on it? anyhow, spinners spin and those spin so they're spinners, I won't hear otherwise.
Mozilla employees up until recently (2024), and research literature, seem to be calling them throbbers as well.
Anecdotally, I’ve only ever heard non-frontend developers call them “spinners”.
Maybe starting a discussion on the articles’ talk page could elicit some change? Language evolves, after all.
1 reply →
spin boxes date back to windows 95 and were part of the windows common controls, often called spinners
https://learn.microsoft.com/en-us/previous-versions/windows/...
I think they fell out of fashion after the scroll wheel was invented
To be fair, those do spin, while "spinners" don't.
That’s not how language works.
That is how language works.
1 reply →
Can this be done in a lightweight way that uses less resources at full speed?
Low fps seems jerky/retro?
Probably no.
Does "Square ring" really look jerky/retro?
Square ring and the 2x2 look smooth!
I truly wish i could get everything to use the ticking clock one at 1Hz (or maybe 0.5) for spinners, animation in user interfaces causes me anguish in general, so i have to go around filtering them on webapps.