Complete browser-based FFmpeg system. PROACTIVELY activate for: (1) ffmpeg.wasm setup and loading, (2) Browser video transcoding, (3) React/Vue/Next.js integration, (4) SharedArrayBuffer and COOP/COEP headers, (5) Multi-threaded ffmpeg-core-mt, (6) Cloudflare Workers limitations, (7) Custom ffmpeg.wasm builds, (8) Memory management and cleanup, (9) Progress tracking and UI, (10) IndexedDB core caching. Provides: Framework-specific examples, header configuration, common operation recipes, performance optimization, troubleshooting guides. Ensures: Client-side video processing without server dependencies.
View on GitHubJosiahSiegel/claude-plugin-marketplace
ffmpeg-master
plugins/ffmpeg-master/skills/ffmpeg-webassembly-workers/SKILL.md
January 20, 2026
Select agents to install to:
npx add-skill https://github.com/JosiahSiegel/claude-plugin-marketplace/blob/main/plugins/ffmpeg-master/skills/ffmpeg-webassembly-workers/SKILL.md -a claude-code --skill ffmpeg-webassembly-workersInstallation paths:
.claude/skills/ffmpeg-webassembly-workers/## CRITICAL GUIDELINES ### Windows File Path Requirements **MANDATORY: Always Use Backslashes on Windows for File Paths** When using Edit or Write tools on Windows, you MUST use backslashes (`\`) in file paths, NOT forward slashes (`/`). --- ## Quick Reference | Package | Size | Threading | Install | |---------|------|-----------|---------| | `@ffmpeg/core` | ~31MB | Single | `npm install @ffmpeg/ffmpeg @ffmpeg/util` | | `@ffmpeg/core-mt` | ~31MB | Multi | Requires COOP/COEP headers | | Header | Value | Purpose | |--------|-------|---------| | Cross-Origin-Embedder-Policy | `require-corp` | SharedArrayBuffer | | Cross-Origin-Opener-Policy | `same-origin` | Multi-threading | | Operation | Command | |-----------|---------| | Convert WebM→MP4 | `await ffmpeg.exec(['-i', 'input.webm', 'output.mp4'])` | | Extract frame | `await ffmpeg.exec(['-i', 'video.mp4', '-ss', '5', '-vframes', '1', 'thumb.jpg'])` | ## When to Use This Skill Use for **browser-based video processing**: - Client-side transcoding without server - React/Vue/Next.js FFmpeg integration - Setting up COOP/COEP headers - Cloudflare Workers FFmpeg limitations - Memory management and cleanup --- # FFmpeg WebAssembly & Cloudflare Workers (2025) Guide to running FFmpeg in browsers and edge environments using WebAssembly. ## ffmpeg.wasm Overview **ffmpeg.wasm** is a pure WebAssembly/JavaScript port of FFmpeg that runs directly in browsers without server-side processing. ### Key Features - **Browser-based**: No server required for video processing - **Cross-platform**: Works on any modern browser - **Single-thread**: @ffmpeg/core (~31MB) - **Multi-thread**: @ffmpeg/core-mt (requires SharedArrayBuffer) - **Customizable**: Build your own core with specific codecs ### Limitations - **Performance**: ~10-100x slower than native FFmpeg - **Memory**: Limited by browser memory constraints - **File size**: Core is ~31MB (can be reduced with custom builds) - **Threading**: Multi-thread requires specific hea