I wanted to create a nice recording from automated tests and scenarios written in code. I could not find any nice solution for rendering and editing movies in JavaScript.
I found html5-animation-video-renderer but it was not suitable for composing a movie from several recordings due html5 media element seek latency. I took a few lines from it to use image2pipe from ffmpeg.
Check out the examples.
Run examples with npm run dev, and render with npm run render
- Real-time video preview and editing with Vite
- Rendering with playwright, firefox and screenshots piped to ffmpeg.
- Components for embedding input video and images.
- Time and playback rate control with console.
- Offline audio mixer for audio track rendering.