Show HN: Avoid smooth spinners, use low-FPS spinners

Show HN: Avoid smooth spinners, use low-FPS spinners 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…

27 points•nh2•6 days ago•27 comments•

#spinners #fps #low #smooth #avoid #use low #smooth spinners #avoid smooth

27 comments

echoangle6 days ago

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.

nh26 days ago

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.

adastra226 days ago

It should not cost a visible fraction of CPU/GPU to update a little sprite even at 30fps.

Lord-Jobo5 days ago

I miss the 1 update per second animations of ye olden times, even if it would be ugly as sin in a modern product.

jy148986 days ago

I'm on mobile so I'm not able to check, but can the will-change and contain attributes reduce the cost?

Diti6 days ago

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

creatonez6 days ago

> [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.

zaep5 days ago

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.

Diti5 days ago

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.

nom5 days ago

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

pwdisswordfishq6 days ago

To be fair, those do spin, while "spinners" don't.

adastra226 days ago

That’s not how language works.

Diti6 days ago

That is how language works.

4d4m5 days ago

Can this be done in a lightweight way that uses less resources at full speed?

Low fps seems jerky/retro?

nh25 days ago

Probably no.

Does "Square ring" really look jerky/retro?

4d4m5 days ago

Square ring and the 2x2 look smooth!

nonamesleft6 days ago

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.

Read the full thread on Hacker News →

27 comments

Related stories