Agentic Coding FFT in Javascript

Wouldn’t it be cool to record your voice and have it come out as a picture? Wouldn’t it be especially cool if the computations for this were done entirely in the browser with no backend? I had already created a dash app in python to create FFT plots of sounds I had recorded. But this past Sunday, I decided it was important to put Gemini / Antigravity through its paces by re building it from scratch in a single html file using embedded javascript.

I set out asking for a simple web page that can record a sound and play it back and allow download. After a few minutes, Gemini gave me a page that could do all this. It would download the sound as a webm file, so I asked for it to convert to wav. Gemini created the headers for wav format and made wav download work. I asked for it to generate the short time fourier transform as a function in pure javascript (no libraries) and generate an image of the sound FFT on the page. I asked it to reformat the page so there is a sidebar and the image takes up the whole screen.

A conversation with my wife about the fruit durian

I am astonished how well this has worked. The code is very clean. Everything works. It was a huge lift for it to implement the signal processing I had the agent create the FFT code in pure javascript with no libraries.

App Interface

I worked with the Antigravity agent to create a UI that allows users to record sounds, playback sound, select segments with keyboard hotkeys, and rearrange saved segments.