Generate waveform from audio file, export as a video. SRT and effects support.
- TypeScript 79.7%
- CSS 14.6%
- JavaScript 5.4%
- HTML 0.3%
Sid
ed22b1679e
- Per-frame worker messaging: workers stream frames individually via
postMessage({index, data}) with ArrayBuffer transfer instead of
batch-collecting all PNGs (fixes OOM on long renders)
- Ordered frame pipe: ffmpeg spawned before workers; frameQueue +
tryFlushPipe() streams frames in sequence as they arrive
- framesReceived progress counter (every 30 frames)
- getWorkerPath(): resolves render-worker.js in both dev (server-dist/)
and production (resources/server-dist/)
- fork() cwd fix: set child process CWD to server/ so --import tsx/esm
finds tsx in server/node_modules/
- build-server.mjs: copy server/node_modules/ to server-dist/node_modules/
so dev mode workers can resolve the canvas native module
|
||
|---|---|---|
| .opencode/plans | ||
| docs/plans | ||
| electron | ||
| fonts | ||
| packages/shared | ||
| public | ||
| scripts | ||
| server | ||
| src | ||
| .gitignore | ||
| electron-builder.yml | ||
| electron.vite.config.ts | ||
| eslint.config.js | ||
| index.html | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| screenshot.png | ||
| screenshot2.png | ||
| tsconfig.app.json | ||
| tsconfig.json | ||
| tsconfig.node.json | ||
| vite.config.ts | ||
Reelmaker
Create reels from audio. Generate an audio waveform video by dropping in an audio file, configure waveform style, and render a video visualization. Add subtitles as a .SRT file to burn them into the rendered media.
Install
See the releases page to download latest Windows .exe file.
Screenshots
Dev
Run the frontend + server separately:
# Terminal 1 — Electron + frontend (with HMR)
npm run dev
# Terminal 2 — Express server (API)
npm run dev:server
The Vite dev server proxies /encode requests to the Express server, so the frontend uses relative URLs.
Build
npm run build
Compiles: server → server-dist/ (esbuild), Electron → out/ (electron-vite).
Package (Windows .exe)
Run from Windows
npm install --legacy-peer-deps
npm run package
This will:
- Download ffmpeg.exe / ffprobe.exe to
resources/ffmpeg/ - Build the server bundle (
server-dist/) - Build the Electron app (
out/) - Rebuild native addons for Electron's Node version
- Produce a standalone installer in
dist-electron/
Requires:
- Visual Studio Build Tools (for
canvasnative addon vianode-gyp) - Internet connection on first build (downloads ~50MB ffmpeg)
Project structure
├── packages/shared/ # Shared types + utils (@waveforms-gen/shared)
├── server/ # Express API server (canvas + ffmpeg)
├── server-dist/ # Compiled server bundle (esbuild output)
├── src/ # React frontend (renderer)
├── electron/
│ ├── main/index.ts # Electron main process
│ └── preload/index.ts # Preload script
├── fonts/ # Bundled Roboto variable TTF files (Light → Black, incl. Italic)
├── resources/ffmpeg/ # Bundled ffmpeg.exe / ffprobe.exe
├── scripts/
│ ├── build-server.mjs # Server esbuild bundler
│ ├── download-ffmpeg.mjs
│ └── generate-font-css.mjs # Inline fonts as base64 @font-face CSS
├── electron.vite.config.ts
├── electron-builder.yml
├── out/ # electron-vite build output
└── dist-electron/ # electron-builder installer output