LeClap

Deterministic, on-device, agent-callable video — composed by prompt or by hand.

Describe a video in one JSON template — sections, filters, music, overlays — then render that same template on a phone (React Native, on-device) or in the browser (WebAssembly). No upload, no server, no generative model: the render is deterministic and reproducible, not sampled.

Quick start · Templates · Library API · Architecture · Docs

✨ What is LeClap?

One JSON template. It renders on Node, in the browser via WebAssembly, and natively on-device on React Native — same template, same pipeline, reproducible run after run on a given platform. No upload, no server, no generative model.

🎥 Demo

Two looks at LeClap — a finished clip rendered from a single JSON template, and the mobile app composing one fully on-device.

🤔 Why LeClap?

Generative tools can't reproduce a result twice. Cloud renderers can't run in your user's pocket. Remotion renders without a server, but needs a browser engine to do it — LeClap links FFmpeg into the app itself.

_{¹ Per platform, not across them: Node and the browser encode with libx264, Android with libopenh264, iOS with h264_videotoolbox, and the on-device build drops boxblur and rewrites eq→lutyuv. Same composition, different pixels.}

LeClap vs Remotion → — the reasoning behind each row, the full caveats, every claim sourced to vendor docs, and when to pick Remotion instead.

🧰 Highlights

🚀 Quick start

💡 Recommended: mise. mise install provisions the exact pinned toolchain — Node 24, pnpm 11, FFmpeg 8.1.1, and Rust — so every contributor and CI run identical versions. Managing versions yourself? Bring Node ≥ 24 and pnpm 11.

git clone https://github.com/heristop/leclap.git
cd leclap
mise install     # Node 24, pnpm 11, FFmpeg 8.1.1 + Rust
pnpm install

Then pick an app:

pnpm app:web      # web app — compiles videos in-browser (no server)
pnpm app:expo     # Expo mobile app — compiles fully on-device (no server)

Or use the CLI — @leclap/cli is the leclap dev tool:

npx @leclap/cli init my-video         # scaffold a starter project
npx @leclap/cli render template.json  # render it (`leclap diagnose` checks your FFmpeg)

Or drive it from an AI agent: the @leclap/mcp server exposes the engine as MCP tools — schema → validate → render — with no LLM in the output path.

📦 Monorepo

pnpm workspaces (apps/*, packages/*) — no turbo/nx. The root is a private orchestrator (leclap); ffmpeg-video-composer, @leclap/cli, and @leclap/mcp are published to npm. The web and mobile apps both run the same core — the mobile app drives it fully on-device via the embedded native engine (no server), the web app in-browser via WASM.

🧩 Templates & library

A template is a Zod-validated JSON descriptor — a global block plus an ordered list of sections, each a clip with its own inputs → maps → filters pipeline and {{ variable }} placeholders. Start from a creative-kit template and tweak text, colors, and media — by prompt (MCP) or in the visual builder.

• 📖 Template configuration reference — global config, sections, the FFmpeg pipeline, placeholders.
• 📥 Use it as a library — install, the compile() API, entry points (Node / browser / RN), and automatic FFmpeg detection.

📚 Documentation

• 🌐 Descriptor reference (web) — the full, schema-driven descriptor reference, one page per topic (sections, transitions, looks, grade, motion, audio, captions, filters, examples, JSON Schema).
• 🧩 Template Configuration — the template JSON reference.
• 🏗 Architecture — system architecture and design patterns.
• 🔧 FFmpeg Fallback Strategy — how automatic FFmpeg detection works.
• 📱 On-Device Compilation — the serverless Expo compile pipeline.
• 🤖 AGENTS.md — repo layout, commands, and conventions for contributors and AI agents.

Read the full README on GitHub →