// the find
developedbyed/react-gradient-glow
A Next.js demo repo showing how to render ASCII art animations in the browser using text frames pre-converted from video via a bash script and a requestAnimationFrame timing loop. It's a tutorial companion — the real artifact is the technique, not a reusable library. Aimed at frontend developers who want to replicate the effect for portfolio sites or creative projects.
The AnimationManager class handles timing correctly — it uses delta accumulation rather than naive setInterval, so frame rate stays stable even when the browser throttles. The prefers-reduced-motion check is present and actually does something (skips starting the animation entirely). Pausing on window blur is a small but correct performance decision. The color overlay via CSS blend modes is the cheapest possible approach — no canvas, no WebGL, just a positioned div with mix-blend-mode: color-dodge.
Loading 60–300 frames as individual HTTP fetches is genuinely painful on first load — 300 text files is 300 round trips, and there's no bundling, sprite approach, or even a manifest. The frame data lives in public/frames as flat text files committed to git, which means the repo itself is bloated with animation assets that have nothing to do with the code being taught. The debug line 'Frame: {currentFrame + 1}/{frames.length}' is rendered in the component with no way to hide it without editing the source. There's no error recovery if frame loading fails mid-sequence — the catch block logs to console and leaves the component in a broken loading state.