MV Studio
Audio in, timed lyrics on a canvas, WebM out. Everything runs in this tab.
Export
IdleRecording is realtime: it plays the song from the top and captures the canvas plus the audio as it goes. Keep this tab in front until it finishes.
Lines & timing
Times are seconds from the start of the track. Edit a value and the preview updates on the next frame.
1 · Audio
Local files are the safer path for export — remote audio can only be recorded when the server allows cross-origin reads.
2 · Lyrics
Leading [mm:ss.xx] stamps are honoured. Unstamped lines are spread across the remaining time.
3 · Style
Notes on the export path
The preview and the export are the same drawing code. A requestAnimationFrame loop asks the <audio> element what time it is, resolves which lyric line owns that moment, and paints one frame. Recording simply attaches canvas.captureStream(30) to a MediaRecorder, adds an audio track taken from a MediaStreamDestination fed by the same playback graph, and lets both run until the track ends.
Two consequences worth knowing. First, the render is realtime — there is no faster path, because there is no offline renderer. Second, if the browser throttles this tab the captured stream loses frames, so leave the window in front. If your machine struggles, drop the font size or switch off the faint next line; both cut per-frame work.