AutoGPT is the vision of accessible AI for everyone, to use and to build on. Our mission is to provide the tools, so that you can focus on what matters.
fix(frontend): make auth panel vortex animation frame-rate independent (#13194)
### Why / What / How
**Why:** The vortex particle animation on the login/signup left panel
was tied to frame rate. Higher-refresh displays (120/144/240Hz) ran the
animation up to ~2.4× faster than 60Hz, and slower CPUs made it crawl
unevenly. The user reported it "feels tied to CPU speed."
**What:** Make the vortex animation frame-rate independent using delta
time, and slow the overall drift on the auth marketing panel.
**How:**
- `vortex.tsx`: track `lastTime` via `performance.now()` each frame and
compute `dtFrames = dt * 60` (normalized to a 60 fps reference, capped
at 2 frames to avoid jumps after tab inactivity). Scale all per-frame
increments by `dtFrames`:
- position: `x + vx * speed * dtFrames`
- noise advance: `tick += dtFrames`
- life: `life += dtFrames`
- velocity smoothing uses the frame-rate-independent form `1 -
0.5^dtFrames` instead of constant `0.5`
- `AuthMarketingPanel.tsx`: lower `rangeSpeed` from `1.2` to `0.22` and
add `baseSpeed={0.08}` so particles drift slowly (range 0.08–0.30 vs.
0–1.2 before).
Result: identical perceived speed across 60/120/144/240Hz displays and
across CPU tiers, at a calmer overall pace.
### Changes 🏗️
- `src/components/ui/vortex.tsx`: delta-time scaling for `tick`,
particle position, life, and velocity smoothing.
- `src/components/auth/AuthSplitLayout/AuthMarketingPanel.tsx`: lower
vortex speed (`baseSpeed=0.08`, `rangeSpeed=0.22`).
### Checklist 📋
#### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [ ] I have tested my changes according to the test plan:
- [ ] Open `/login` and `/signup` on a 60Hz display — particles drift
slowly and smoothly
- [ ] Open the same pages on a high-refresh display (120/144Hz) —
animation speed matches 60Hz, not visibly faster
- [ ] Switch tabs and return — animation does not "jump" on resume
(delta clamp at 1/30s)
- [ ] Resize window — particles continue without artifacts
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com> U
Ubbe committed
aa7d68bcf686b668161d6f03e4abde029e2cdbbd
Parent: b6e0a99
Committed by GitHub <noreply@github.com>
on 5/22/2026, 11:38:47 AM