feat: an unsealing wave for the boot splash #22

Merged

me merged 2 commits from feat/unsealing-loader into main

2026-08-30 03:03:17 +00:00

me commented

2026-08-29 18:59:59 +00:00

Owner

Boot loading moment, framed as ritual rather than apology. Designed via /grilling.

Grain. noise.gif 755,823 → 40,857 bytes (−94.6%). Cropped to a 128px tile rather than downscaled — scaling averages grain into mush. Same 7 frames and delays, indistinguishable at the real 3% opacity. LCP 4604 → 3580 ms.

Loader. Indeterminate wave, no percentage: there is no honest denominator before the app has loaded, so the only thing it says is when it stops. Boot only, route-agnostic — a share link is that visitor's boot. 900ms floor on first visit, lifted for returning visitors via localStorage, since immutable caching would otherwise flash it past unseen. Replaces the ring and the "...". Reduced motion gets a still line and frozen grain; the floor stays.

	settles	visible for
First visit	991 ms (held by floor)	1210 ms
Repeat visit	487 ms (when ready)	817 ms

Two bugs found.

SplashScreen's grain class was missing its closing bracket, so the splash has never had grain. Fixing it doubles the texture over <main>, which already carries it — left off, needs your call.
.grain { position: relative } stripped fixed off the splash; this stylesheet loads after the Tailwind utilities and wins the tie. Removed.

Verified. tsc, 71 tests, both build modes, all four perf budgets. The wave does not become the LCP element — that stays the hero h1.

Boot loading moment, framed as ritual rather than apology. Designed via `/grilling`. **Grain.** `noise.gif` 755,823 → 40,857 bytes (−94.6%). Cropped to a 128px tile rather than downscaled — scaling averages grain into mush. Same 7 frames and delays, indistinguishable at the real 3% opacity. LCP 4604 → 3580 ms. **Loader.** Indeterminate wave, no percentage: there is no honest denominator before the app has loaded, so the only thing it says is when it stops. Boot only, route-agnostic — a share link is that visitor's boot. 900ms floor on first visit, lifted for returning visitors via `localStorage`, since `immutable` caching would otherwise flash it past unseen. Replaces the ring and the "...". Reduced motion gets a still line and frozen grain; the floor stays. | | settles | visible for | |---|---|---| | First visit | 991 ms (held by floor) | 1210 ms | | Repeat visit | 487 ms (when ready) | 817 ms | **Two bugs found.** - `SplashScreen`'s grain class was missing its closing bracket, so the splash has never had grain. Fixing it doubles the texture over `<main>`, which already carries it — left off, needs your call. - `.grain { position: relative }` stripped `fixed` off the splash; this stylesheet loads after the Tailwind utilities and wins the tie. Removed. **Verified.** `tsc`, 71 tests, both build modes, all four perf budgets. The wave does not become the LCP element — that stays the hero `h1`.

me added 2 commits

2026-08-29 18:59:59 +00:00

perf: re-encode the noise grain from 755KB to a 41KB tile 523bba5469

feat: hold an unsealing wave on the boot splash

CI / Frontend CI (pull_request) Successful in 57s

Details

CI / Backend CI (pull_request) Successful in 51s

Details

CI / E2E Tests (pull_request) Successful in 5m47s

Details

1dcc3a20af