Show loading bar on initial load

[david-crespo]

I kinda thought we did this already, but apparently not. So I was curious what it would take. The first commit just moves the loading bar component to its own file without making any changes, and then the second commit makes the change. It's mildly interesting because in order for the loading bar to not get swapped out when the initial loader completes (and the skeleton fallback gets replaced with the actual app), it needs to be rendered outside of the router provider but it still needs to listen to routing events, so it uses useSyncExternalStore to subscribe to events on the router.

I can live without it — it's kind of nice, but an animation on the skeleton itself (and the middle not being so empty) might be better.

2026-07-08-loading-bar-init.mp4

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
console	Ready	Preview	Jul 8, 2026 9:51pm

[fakemonster]

It's kind of a look-and-feel thing, more than anything else. I think a loading bar on pageload gives "SPA energy". And to be fair, this is an SPA! But a lot of our loaders are prefetching, so moment-to-moment feels more server-rendered. To that end, it seems more appropriate to have really minimal initial loading state.

That said, it is an SPA at the end of the day, and while I personally don't expect to see a loading bar on my landing page, I don't really mind it either.

[david-crespo]

Trying it out now, I don't love it. I think I'd rather have a subtle ripple on the skeleton.