TLDR Dev · ARTICLES & TUTORIALS

WE BUILT A VIDEO RENDERING ENGINE BY LYING TO THE BROWSER ABOUT WHAT TIME IT IS

blog.replit.com13 min read

Summary from the TLDR Dev newsletter

Replit developed a unique video rendering engine to turn any web page into a deterministic video file, overcoming the challenge that browsers are real-time systems ill-suited for frame-perfect capture. Its solution involves injecting a JavaScript virtual clock into the browser, which replaces native timing APIs like `setTimeout` and `requestAnimationFrame`, so time advances only when commanded. This system also has a complex pipeline for handling video elements by preprocessing them server-side and rendering frames to a canvas.