Bedtime: Using JavaScript Spinners as a Sleep Aid

We've all been there. You're waiting for a web page to load, watching that little spinner spin, and somehow the waiting itself becomes almost meditative. Liora Sarusso took that observation and turned it into a sleep aid called Bedtime.

The concept is deceptively simple but psychologically clever. Instead of fighting the spinner, you lean into it. The project tells a bedtime story about a character named Liora and their companion, but the text appears slowly and is interspersed with intentionally slow JavaScript loaders. The key innovation is the progression: as the story continues, both the loader duration and text appearance speed increase. The goal isn't to finish the story—it's to fall asleep before you get there.

The Accidental Sleep Aid

Sarusso's origin story resonates with anyone who's struggled with insomnia. While trying to fall asleep one night, they were waiting for data analysis results on a web platform. The spinner's repetitive motion had an unexpectedly calming effect. It wasn't intentional—it was a side effect of slow data processing—but it worked.

This speaks to a broader pattern in how we interact with digital interfaces. Our brains sometimes latch onto repetitive, low-stimulus visual patterns. The spinner provides just enough engagement to keep racing thoughts at bay without being interesting enough to keep you awake. It's like counting sheep, but for the internet age.

The project documentation mentions that Sarusso uses it personally and "it helps a bit." That's the right level of enthusiasm—no claims of miracle cures, just a tool that might give you an edge against insomnia.

Technical Implementation

Looking at the GitHub repository, this is a straightforward web project. The magic happens through carefully timed JavaScript that controls both the story rendering and the loader animation. The progressive slowdown suggests an exponential backoff pattern in the timing functions.

What's interesting is the user experience design. Most web performance optimization aims to make loaders disappear faster. Here, the loader is the main feature. The project encourages adding it to your phone's home screen for fullscreen mode, which removes browser chrome and creates a more immersive, distraction-free experience.

Why This Matters

Bedtime sits at the intersection of utility and whimsy. It's not trying to be a major productivity app or a medical device. It's a "toy project" in the best sense—born from personal need, shared because it might help others, and designed with a specific, narrow purpose.

There's also something refreshing about the anti-pattern. In a world obsessed with speed and efficiency, deliberately slowing things down serves a human need. The spinner, usually a symbol of frustration, becomes a tool for relaxation.

The project also highlights how small observations can become useful tools. Not every app needs to solve a massive problem. Sometimes noticing that a spinner makes you sleepy and building on that insight is enough.

Try It Out

You can access the project directly at bedtime.my. The fullscreen experience on mobile seems to be the intended use case, so adding it to your home screen is recommended. It's open source, so if you want to customize the story or adjust the timing curves, you can fork the repository and make it your own.

For anyone who's ever found themselves oddly soothed by a loading animation, Bedtime offers a way to weaponize that feeling against insomnia. It won't replace medical sleep solutions, but as a free, low-tech intervention, it's worth a shot.