Kira works on the render core: headless Chromium scheduling, frame capture, and the encoder pipeline. She cares about reproducible builds and small numbers next to the word "variance."
Build an App Store preview video in HTML — phone-frame entrance, paginated screenshots, cross-faded captions — and render to deterministic MP4 at every required size.
Build an animated pull quote in HTML — oversized opening glyph, word-by-word typewriter, attribution rise — and render deterministic MP4s for editorial video pipelines.
Build a poll results animation that renders to deterministic MP4: four horizontal bars race to their final percentages, then a winner ribbon sweeps in.
Build an animated boarding pass video: a plane traces an arc from origin to destination, gate and time settle in, the pass folds out — rendered as MP4.
A deterministic testimonial video template you can render from a JSON payload — avatar, quote, attribution, all frame-pinned MP4. The fastest testimonial video template for SaaS.
Build a recipe card video for Instagram, TikTok, and Pinterest — ingredients check off line-by-line, a step counter ticks, and a circular timer fills. Rendered deterministically to MP4.
Build an animated heatmap in plain HTML and CSS — a 12×7 grid where cells fade in with intensity-based color values, scrubbing left-to-right. Deterministic MP4 from JSON.
An animated Gantt chart video built from a JSON of tasks. Horizontal bars that grow across a date axis with a moving today cursor — deterministic MP4 out.
A live-looking price ticker — three series, gradient fill, bid/ask flash — in 200 lines of HTML. Render to MP4 for ads, dashboards, and 24h-recap reels.
A walkthrough of generating MP4s from a Node.js process — headless Chromium, frame capture, encoding, and the pitfalls to avoid.
Headless Chromium is the engine, not the renderer. The difference matters when you're trying to produce frame-perfect MP4s.
Render a React component to a deterministic MP4. The trick is treating time as a prop, not a side effect.
Puppeteer can record video — sort of. Here's the screencast API, its limits, and the deterministic alternative for real production work.
An end-to-end recipe for turning a static HTML file into a deterministic MP4 — no timeline tool, no manual export, no headless-Chrome plumbing.
requestAnimationFrame quirks, document.timeline, OffscreenCanvas, WAAPI commitStyles, the new Chromium headless timing model. What is reliable in 2026, and what is still broken.
Build animated pie and donut charts with pure CSS conic-gradient and stroke-dashoffset. Two techniques, full source, MP4 export.
Decoder support tables, real bitrate-vs-quality numbers, encoder availability, and CDN compatibility — a practitioner's guide to which codec to ship for the web in 2026.
One template, one CSV, one thousand MP4s. The pattern, the cost model, and the GitHub Actions matrix.
The WebCodecs API has finally grown up. A deep look at VideoEncoder, hardware H.264 vs AV1 support across Chromium 130+, and why we are slowly rewriting parts of the HyperFrames render path on top of it.
A scrubbing-line stock chart from a JSON of price points. The windowing trick, the easing, and the render.
POST a JSON payload, get back an MP4. The route handler, the template, and the Vercel deploy notes.
Build a YouTube Shorts generator with HTML templates. 9:16, 60-second cap, on-screen captions, MP4 export, batch render from JSON or CSV.
GIF is a 256-color, 30× larger format than MP4. Here is when to convert, when not to, and the parameters that matter.
A frame-by-frame walkthrough of what happens between hyperframes render and a finished MP4. Chromium, seek events, capture, encode — the whole pipeline, with timings.
Two renders of the same source should produce byte-identical MP4s. Here is why that property is rare, and why it changes how teams ship video.
If you cannot render the same frame twice, you do not have a render pipeline — you have a slot machine. Why determinism is the only feature that matters in modern video tooling.
Burn-in subtitles for video using HTML and CSS — typography, timing, safe-area rules, and the export pipeline. Beats FFmpeg for design control.
Turn any React component into a deterministic MP4. Frame-pinned timing, props as variables, the export pipeline. No headless Chrome scripting required.
When to use MP4 vs WebM vs GIF for product videos in 2026. Browser support, file size, transparency, autoplay rules, and the right call per use case.
FFmpeg vs HTML-to-MP4 rendering: when each tool wins, where they overlap, and how they compose in a real production pipeline.