{"id":24164510,"url":"https://github.com/diffusionstudio/ffmpeg-js","last_synced_at":"2025-10-17T10:44:09.042Z","repository":{"id":177092297,"uuid":"659913002","full_name":"diffusionstudio/ffmpeg-js","owner":"diffusionstudio","description":null,"archived":false,"fork":false,"pushed_at":"2024-08-16T09:38:33.000Z","size":41348,"stargazers_count":83,"open_issues_count":4,"forks_count":11,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-06T12:08:48.162Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/diffusionstudio.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-06-28T20:55:43.000Z","updated_at":"2025-01-20T15:00:01.000Z","dependencies_parsed_at":"2024-08-17T17:55:43.343Z","dependency_job_id":null,"html_url":"https://github.com/diffusionstudio/ffmpeg-js","commit_stats":null,"previous_names":["diffusion-studio/ffmpeg-js","diffusionstudio/ffmpeg-js"],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/diffusionstudio%2Fffmpeg-js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/diffusionstudio%2Fffmpeg-js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/diffusionstudio%2Fffmpeg-js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/diffusionstudio%2Fffmpeg-js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/diffusionstudio","download_url":"https://codeload.github.com/diffusionstudio/ffmpeg-js/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238759722,"owners_count":19525873,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-01-12T19:17:35.521Z","updated_at":"2025-10-17T10:44:04.010Z","avatar_url":"https://github.com/diffusionstudio.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg src=\"./public/icon.png\" alt=\"Library Icon\" width=\"164\" height=\"164\" /\u003e\n\u003c/p\u003e\n\n[![Website shields.io](https://img.shields.io/website-up-down-green-red/http/shields.io.svg)](https://ffmpeg-js-preview.vercel.app)\n[![Discord](https://badgen.net/badge/icon/discord?icon=discord\u0026label)](https://discord.gg/n3mpzfejAb)\n[![GitHub license](https://badgen.net/github/license/Naereen/Strapdown.js)](https://github.com/diffusion-studio/ffmpeg-js/blob/main/LICENSE)\n[![TypeScript](https://badgen.net/badge/icon/typescript?icon=typescript\u0026label)](https://typescriptlang.org)\n\n# 🎥 FFmpeg.js: A WebAssembly-powered FFmpeg Interface for Browsers\n\nWelcome to FFmpeg.js, an innovative library that offers a WebAssembly-powered interface for utilizing FFmpeg in the browser. 🌐💡\n\n## Demo\n\n![GIF Converter Demo](./public/preview.gif)\n\n[Open Demo Application](https://ffmpeg-js-preview.vercel.app/)\n\n## ❓ Why FFmpeg.js?\n\nThis project has been inspired by the awesome work of [ffmpeg.wasm](https://github.com/ffmpegwasm/ffmpeg.wasm), but we noted a few drawbacks that might limit its applicability for broader use:\n\n1. The project employs a GPL3 build of FFmpeg, limiting its use for commercial projects. 🚫💼\n2. It's developed in JavaScript and hence offers limited typing, restricting the potential for more rigorous static type checks. ❗⌨️\n3. The lack of an object-oriented approach for writing FFmpeg commands. 🔄📝\n\n## ✔️ FFmpeg.js to the Rescue!\n\nAddressing the issues above, FFmpeg.js:\n\n- Provides an LGPL build of FFmpeg, making it commercially more viable, checkout https://ffmpeg.org/legal.html for more detail. 🟢💼\n- Is written in TypeScript, introducing static type checking to enhance code reliability. 👌🔍\n- Offers an object-oriented interface for writing FFmpeg commands, inspired by `fluent-ffmpeg`\n  , making it more programmer-friendly. 🎯🔄\n\nHowever, it's important to note that as of now, FFmpeg.js runs only in Chrome, Firefox, and Edge browsers. It doesn't support Safari or Node. 🚧🔍\n\n## 🚀 Setup\n\nSetting up FFmpeg.js is a breeze!\n\n```bash\nnpm i @diffusion-studio/ffmpeg-js\n```\n\nThis should install the library. Now because ffmpeg.js requires the use of the [SharedArrayBuffer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer) you need to enable `Cross-Origin-Opener-Policy: same-origin` and `Cross-Origin-Embedder-Policy: require-corp` on the server side.\n\n### ⚡️Vite\n\nIn a vite environment you can simply add these policies by putting the following into your `vite.config.js`:\n\n```js\n...\nserver: {\n    ...\n    headers: {\n      'Cross-Origin-Embedder-Policy': 'require-corp',\n      'Cross-Origin-Opener-Policy': 'same-origin',\n    },\n},\n...\n```\n\n### △Next.js\n\nHere is an example `next.config.js` that supports the SharedArrayBuffer:\n\n```\nmodule.exports = {\n    async headers() {\n        return [\n            {\n                source: '/',\n                headers: [\n                    {\n                        key: 'Cross-Origin-Embedder-Policy',\n                        value: 'require-corp',\n                    },\n                    {\n                        key: 'Cross-Origin-Opener-Policy',\n                        value: 'same-origin',\n                    },\n                ],\n            },\n        ];\n    },\n};\n```\n\n## 💻 Usage\n\nSomewhere in your project you need to initiate a ffmpeg instance.\n\n```typescript\nimport { FFmpeg } from '@diffusion-studio/ffmpeg-js';\n\nconst ffmpeg = new FFmpeg();\n```\n\nBy default this will pull a [LGPLv2.1 compliant build](https://github.com/diffusion-studio/ffmpeg-wasm-lgpl-build) of FFmpeg from the [UNPKG delivery network](https://www.unpkg.com).\u003cbr\u003e Consequently if you immidiately intent to run commands you need to wait until the binaries have been fetched successfully, like this:\n\n```typescript\nffmpeg.whenReady(async () =\u003e {\n  await ffmpeg.exec(['-help']);\n});\n```\n\nThis will output the ffmpeg help as fast as possible.\n\n\u003e HINT: Even though this library intends to provide a object oriented interface for ffmpeg, you can still run commands manually using the `exec` method.\n\nWhen working with files you need to save them to the in-memory file system first:\n\n```typescript\nconst source = 'https://\u003cpath to file\u003e/\u003cfilename\u003e.mp4';\n\n// write to file system\nawait ffmpeg.writeFile('input.mp4', source);\n\n// convert mp4 to avi\nawait ffmpeg.exec(['-i', 'input.mp4', 'output.avi']);\n\n// read from file system\nconst result: Uint8Array = ffmpeg.readFile('output.avi');\n\n// free memory\nffmpeg.deleteFile('input.mp4');\nffmpeg.deleteFile('output.avi');\n```\n\nLet's see how you would get the same result the **object oriented** way.\n\n```typescript\nconst source = 'https://\u003cpath to file\u003e/\u003cfilename\u003e.mp4';\n\nconst result: Uint8Array | undefined = ffmpeg\n  .input({ source })\n  .ouput({ format: 'avi' })\n  .export();\n```\n\n\u003e If you were wondering, yes the memory is being managed for you.\n\n## 📖 Examples\n\nTake a look at these tests for more examples:\n\n- https://github.com/diffusion-studio/ffmpeg-js/blob/main/examples/src/main.ts\n- https://github.com/diffusion-studio/ffmpeg-js/blob/main/tests/export.spec.ts\n- https://github.com/diffusion-studio/ffmpeg-js/blob/main/tests/commands.spec.ts\n\n## 🛑 Limitations\n\n- Webassembly is limited to 2GB\n- Difficult to handle in unit tests, it's probably best if you mock the FFmpeg class and leave the testing to us (which is also good practice).\n- There is no hardware acceleration available, making video encoding/decoding rather slow.\n\n## ⚙️ Configurations\n\nCurrently there are two different FFmpeg configurations available with more on the way.\n\n- `lgpl-base` (default): It is a compilation of FFmpeg without any external libraries, which is useful for audio \u0026 video muxing/demuxing and audio encoding/decoding. It is v2.1LGPL compliant and can therefore be used for commercial projects.\n- `gpl-extended`: This is the [@ffmpeg/core](https://github.com/ffmpegwasm/ffmpeg.wasm-core) configuration, that has been built with `--enable-gpl` and `--enable-nonfree` and can therefore only be used for commercial projects if the entire codebase is publicly accessible. It supports popular delivery codecs such as `h264/h265/vp9` etc.\n\nFor more information about the supported codecs and muxers run the following commands:\n\n```typescript\nconsole.log(await ffmpeg.codecs());\nconsole.log(await ffmpeg.formats());\n```\n\nThis is how you can switch the configuration:\n\n```typescript\nimport {\n  FFmpeg,\n  FFmpegConfigurationGPLExtended,\n} from '@diffusion-studio/ffmpeg-js';\n\n// FFmpegConfigurationGPLExtended will add the type extensions\nconst ffmpeg = new FFmpeg\u003cFFmpegConfigurationGPLExtended\u003e({\n  config: 'gpl-extended',\n});\n```\n\nThats it!\n\nWe believe that FFmpeg.js will significantly streamline your interaction with FFmpeg in the browser, providing a more effective and efficient coding experience. Happy coding! 🚀🌟\n\n### DISCLAIMER\n\n_The information contained in this text is provided for informational purposes only. It is not intended as a comprehensive guide to the GPL and LGPL license usages nor does it offer legal advice. Laws and regulations surrounding software licenses can be complex and may change over time. The author and provider of this information cannot be held responsible for any errors, omissions, or any outcomes related to your use of this information._\n\n_While every effort has been made to ensure the information presented here is accurate as of the date of publication, no guarantee is given as to its currency or applicability to your specific situation. You should not rely upon this information as a substitute for consultation with a legal professional or other competent advisors. Always consult with a qualified professional familiar with your particular circumstances before making decisions that could have legal implications._\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdiffusionstudio%2Fffmpeg-js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdiffusionstudio%2Fffmpeg-js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdiffusionstudio%2Fffmpeg-js/lists"}