Docs and example apps for the single multi-threaded core

Removes @ffmpeg/core-mt from the examples, the playground's core switcher,
and documents FFmpeg 9 in the migration guide and FAQ.

Author: lucasgelfond

apps/angular-app/src/app/app.component.ts

@@ -4,7 +4,7 @@ import { RouterOutlet } from '@angular/router';
 import { FFmpeg } from '@ffmpeg/ffmpeg';
 import { fetchFile, toBlobURL } from '@ffmpeg/util';
 
-const baseURL = 'https://cdn.jsdelivr.net/npm/@ffmpeg/core-mt@0.12.10/dist/esm';
+const baseURL = 'https://cdn.jsdelivr.net/npm/@ffmpeg/core@0.13.0/dist/esm';
 
 @Component({
   selector: 'app-root',
@@ -28,10 +28,6 @@ export class AppComponent {
         `${baseURL}/ffmpeg-core.wasm`,
         'application/wasm',
       ),
-      workerURL: await toBlobURL(
-        `${baseURL}/ffmpeg-core.worker.js`,
-        'text/javascript',
-      ),
     });
     this.loaded = true;
   }

apps/nextjs-app/app/Home.tsx

@@ -13,7 +13,7 @@ export default function Home() {
 
   const load = async () => {
     setIsLoading(true);
-    const baseURL = "https://cdn.jsdelivr.net/npm/@ffmpeg/core@0.12.10/dist/umd";
+    const baseURL = "https://cdn.jsdelivr.net/npm/@ffmpeg/core@0.13.0/dist/umd";
     const ffmpeg = ffmpegRef.current;
     ffmpeg.on("log", ({ message }) => {
       if (messageRef.current) messageRef.current.innerHTML = message;

apps/react-vite-app/src/App.tsx

@@ -9,7 +9,7 @@ function App() {
   const messageRef = useRef<HTMLParagraphElement | null>(null);
 
   const load = async () => {
-    const baseURL = "https://cdn.jsdelivr.net/npm/@ffmpeg/core-mt@0.12.10/dist/esm";
+    const baseURL = "https://cdn.jsdelivr.net/npm/@ffmpeg/core@0.13.0/dist/esm";
     const ffmpeg = ffmpegRef.current;
     ffmpeg.on("log", ({ message }) => {
       if (messageRef.current) messageRef.current.innerHTML = message;
@@ -22,10 +22,6 @@ function App() {
         `${baseURL}/ffmpeg-core.wasm`,
         "application/wasm"
       ),
-      workerURL: await toBlobURL(
-        `${baseURL}/ffmpeg-core.worker.js`,
-        "text/javascript"
-      ),
     });
     setLoaded(true);
   };

apps/solidstart-app/src/routes/index.tsx

@@ -2,7 +2,7 @@ import { FFmpeg } from '@ffmpeg/ffmpeg';
 import { fetchFile, toBlobURL } from '@ffmpeg/util';
 import { createSignal, Show } from 'solid-js';
 
-const baseURL = 'https://cdn.jsdelivr.net/npm/@ffmpeg/core-mt@0.12.10/dist/esm';
+const baseURL = 'https://cdn.jsdelivr.net/npm/@ffmpeg/core@0.13.0/dist/esm';
 const videoURL =
   'https://raw.githubusercontent.com/ffmpegwasm/testdata/master/video-15s.avi';
 
@@ -28,10 +28,6 @@ export default function Home() {
         `${baseURL}/ffmpeg-core.wasm`,
         'application/wasm'
       ),
-      workerURL: await toBlobURL(
-        `${baseURL}/ffmpeg-core.worker.js`,
-        'text/javascript'
-      ),
     });
     setLoaded(true);
     setIsLoading(false);

apps/sveltekit-app/src/lib/FFmpegDemo.svelte

@@ -6,7 +6,7 @@
 
 	let videoEl: HTMLVideoElement;
 
-	const baseURL = 'https://cdn.jsdelivr.net/npm/@ffmpeg/core-mt@0.12.10/dist/esm';
+	const baseURL = 'https://cdn.jsdelivr.net/npm/@ffmpeg/core@0.13.0/dist/esm';
 	const videoURL = 'https://raw.githubusercontent.com/ffmpegwasm/testdata/master/video-15s.avi';
 
 	let message = 'Click Start to Transcode';
@@ -21,7 +21,6 @@
 		await ffmpeg.load({
 			coreURL: await toBlobURL(`${baseURL}/ffmpeg-core.js`, 'text/javascript'),
 			wasmURL: await toBlobURL(`${baseURL}/ffmpeg-core.wasm`, 'application/wasm'),
-			workerURL: await toBlobURL(`${baseURL}/ffmpeg-core.worker.js`, 'text/javascript')
 		});
 		message = 'Start transcoding';
 		await ffmpeg.writeFile('test.avi', await fetchFile(videoURL));

apps/vanilla-app/public/transcode-mt.esm.html

@@ -23,7 +23,7 @@ <h3>Upload a video to transcode to mp4 (x264) and play!</h3>
             message.innerHTML = `${progress * 100} %`;
           });
           await ffmpeg.load({
-            coreURL: "/assets/core-mt/package/dist/esm/ffmpeg-core.js",
+            coreURL: "/assets/core/package/dist/esm/ffmpeg-core.js",
           });
         }
         const { name } = files[0];

apps/vanilla-app/public/transcode-mt.html

@@ -25,7 +25,7 @@ <h3>Upload a video to transcode to mp4 (x264) and play!</h3>
             message.innerHTML = `${progress * 100} %, time: ${time / 1000000} s`;
           });
           await ffmpeg.load({
-            coreURL: "/assets/core-mt/package/dist/umd/ffmpeg-core.js",
+            coreURL: "/assets/core/package/dist/umd/ffmpeg-core.js",
           });
         }
         const { name } = files[0];

apps/vue-vite-app/src/components/FFmpegDemo.vue

@@ -11,7 +11,7 @@ import type { LogEvent } from '@ffmpeg/ffmpeg/dist/esm/types'
 import { fetchFile, toBlobURL } from '@ffmpeg/util'
 import { defineComponent, ref } from 'vue'
 
-const baseURL = 'https://cdn.jsdelivr.net/npm/@ffmpeg/core-mt@0.12.10/dist/esm'
+const baseURL = 'https://cdn.jsdelivr.net/npm/@ffmpeg/core@0.13.0/dist/esm'
 const videoURL = 'https://raw.githubusercontent.com/ffmpegwasm/testdata/master/video-15s.avi'
 
 export default defineComponent({
@@ -29,7 +29,6 @@ export default defineComponent({
       await ffmpeg.load({
         coreURL: await toBlobURL(`${baseURL}/ffmpeg-core.js`, 'text/javascript'),
         wasmURL: await toBlobURL(`${baseURL}/ffmpeg-core.wasm`, 'application/wasm'),
-        workerURL: await toBlobURL(`${baseURL}/ffmpeg-core.worker.js`, 'text/javascript')
       })
       message.value = 'Start transcoding'
       await ffmpeg.writeFile('test.avi', await fetchFile(videoURL))

apps/website/docs/contribution/core.md

@@ -6,41 +6,31 @@ You will need to install `make` to run build scripts.
 
 ## Build
 
-One command starts Docker Desktop if it isn't running, builds both cores and
+One command starts Docker Desktop if it isn't running, builds the core and
 then the JS packages:
 
 ```bash
-$ pnpm build:wasm        # production builds, like CI
-$ pnpm build:wasm dev    # dev builds (--profiling)
+$ pnpm build:wasm        # production build, like CI
+$ pnpm build:wasm dev    # dev build (--profiling)
 ```
 
 The emsdk image is multi-arch, so this runs natively on Apple Silicon too. The
 `make` targets below are what it runs.
 
-Dev Build (single thread):
+Dev Build:
 ```bash
 $ make dev
 ```
 
-Dev Build (multithread):
-```bash
-$ make dev-mt
-```
-
-Prodution Build (single thread):
+Production Build:
 ```bash
 $ make prd
 ```
 
-Prodution Build (multithread):
-```bash
-$ make prd-mt
-```
-
-> Each build might take around 1 hour depends on the spec of your machine,
+> A cold build takes a few minutes on a recent machine,
 > subsequent builds are faster as most layers are cached.
 
-The output file locates at **/packages/core** or **/packages/core-mt**.
+The output file locates at **/packages/core**.
 
 ## Custom Build / Reduce Build Size
 
@@ -130,4 +120,4 @@ This approach gives you control over the build content and its final size.
 We would like to thank @Kaizodo, @harkdawg and other community members for sharing their knowledge!
 ## Publish
 
-Simply run `npm publish` under **packages/core** or **/packages/core-mt**.
+Simply run `npm publish` under **packages/core**.

apps/website/docs/faq.md

@@ -17,8 +17,8 @@ As of now, WebAssembly is still a lot slower than native, it is possible to furt
 WebAssembly intrinsic, which is basically writing assembly code. It is something we are investigating
 and hope to introduce in the future.
 
-If you are OK with more unstable version of ffmpeg.wasm, using ffmpeg.wasm multithread (mt) version
-can have around 2x speed comparing to single thread (but consume a lot more memory and cpu)
+Since 0.13, @ffmpeg/core runs FFmpeg's multi-threaded pipeline, which is
+faster than the single-thread core of 0.12.
 
 ### Is RTSP supported by ffmpeg.wasm?