mediabunny 1.44.2 → 1.45.0

package/dist/bundles/mediabunny.cjs

@@ -103,6 +103,7 @@ var Mediabunny = (() => {
     AudioBufferSink: () => AudioBufferSink,
     AudioBufferSource: () => AudioBufferSource,
     AudioSample: () => AudioSample,
+    AudioSampleResource: () => AudioSampleResource,
     AudioSampleSink: () => AudioSampleSink,
     AudioSampleSource: () => AudioSampleSource,
     AudioSource: () => AudioSource,
@@ -200,6 +201,7 @@ var Mediabunny = (() => {
     VIDEO_SAMPLE_PIXEL_FORMATS: () => VIDEO_SAMPLE_PIXEL_FORMATS,
     VideoSample: () => VideoSample,
     VideoSampleColorSpace: () => VideoSampleColorSpace,
+    VideoSampleResource: () => VideoSampleResource,
     VideoSampleSink: () => VideoSampleSink,
     VideoSampleSource: () => VideoSampleSource,
     VideoSource: () => VideoSource,
@@ -230,7 +232,8 @@ var Mediabunny = (() => {
     getFirstEncodableVideoCodec: () => getFirstEncodableVideoCodec,
     prefer: () => prefer,
     registerDecoder: () => registerDecoder,
-    registerEncoder: () => registerEncoder
+    registerEncoder: () => registerEncoder,
+    registerVideoSampleTransformer: () => registerVideoSampleTransformer
   });
 
   // src/misc.ts
@@ -661,8 +664,8 @@ var Mediabunny = (() => {
       const nextDenominator = integer * currDenominator + prevDenominator;
       if (nextDenominator > maxDenominator) {
         return {
-          numerator: sign * currNumerator,
-          denominator: currDenominator
+          num: sign * currNumerator,
+          den: currDenominator
         };
       }
       prevNumerator = currNumerator;
@@ -675,8 +678,8 @@ var Mediabunny = (() => {
       }
     }
     return {
-      numerator: sign * currNumerator,
-      denominator: currDenominator
+      num: sign * currNumerator,
+      den: currDenominator
     };
   };
   var CallSerializer = class {
@@ -13356,7 +13359,7 @@ var Mediabunny = (() => {
     async getPacket(timestamp, options) {
       assert(this.demuxer.audioInfo);
       if (timestamp < 0) {
-        throw new Error("Timestamp cannot be negative");
+        return null;
       }
       const release = await this.demuxer.readingMutex.acquire();
       try {
@@ -15895,7 +15898,7 @@ var Mediabunny = (() => {
   };
   var URL_SOURCE_MIN_LOAD_AMOUNT = 0.5 * 2 ** 20;
   var DEFAULT_RETRY_DELAY = (previousAttempts, error, src) => {
-    const couldBeCorsError = error instanceof Error && (error.message.includes("Failed to fetch") || error.message.includes("Load failed") || error.message.includes("NetworkError when attempting to fetch resource"));
+    const couldBeCorsError = error instanceof Error && (error.message.includes("Failed to fetch") || error.message.includes("Load failed") || error.message.includes("NetworkError when attempting to fetch resource")) && typeof window !== "undefined";
     if (couldBeCorsError) {
       let originOfSrc = null;
       try {
@@ -16280,7 +16283,7 @@ var Mediabunny = (() => {
       /** @internal */
       this._pulling = false;
       this._stream = stream;
-      this._maxCacheSize = options.maxCacheSize ?? 16 * 2 ** 20;
+      this._maxCacheSize = options.maxCacheSize ?? 32 * 2 ** 20;
     }
     /** @internal */
     _getFileSize() {
@@ -16377,6 +16380,7 @@ var Mediabunny = (() => {
         }
         const startIndex = this._currentIndex;
         const endIndex = this._currentIndex + value.byteLength;
+        this._dispatchRead(startIndex, endIndex);
         for (let i = 0; i < this._pendingSlices.length; i++) {
           const pendingSlice = this._pendingSlices[i];
           const cappedStart = Math.max(startIndex, pendingSlice.start);
@@ -18293,7 +18297,8 @@ var Mediabunny = (() => {
       let slice = input._reader.requestSlice(4, 4);
       if (slice instanceof Promise) slice = await slice;
       if (!slice) return false;
-      return readAscii(slice, 4) === "moof";
+      const fourCc = readAscii(slice, 4);
+      return fourCc === "moof" || fourCc === "sidx";
     }
     get name() {
       return "MP4";
@@ -18841,6 +18846,14 @@ var Mediabunny = (() => {
       }
     });
   }
+  var VideoSampleResource = class {
+    constructor() {
+      /** @internal */
+      this._referenceCount = 0;
+      /** @internal */
+      this._lastAllocationBuffer = null;
+    }
+  };
   var VIDEO_SAMPLE_PIXEL_FORMATS = [
     // 4:2:0 Y, U, V
     "I420",
@@ -18940,7 +18953,25 @@ var Mediabunny = (() => {
         this.rotation = init.rotation ?? 0;
         this.timestamp = init.timestamp;
         this.duration = init.duration ?? 0;
-        this.colorSpace = new VideoSampleColorSpace(init.colorSpace);
+        let colorSpaceInit = init.colorSpace ?? null;
+        if (colorSpaceInit === null) {
+          if (this.format === "RGBA" || this.format === "RGBX" || this.format === "BGRA" || this.format === "BGRX") {
+            colorSpaceInit = {
+              primaries: "bt709",
+              transfer: "iec61966-2-1",
+              matrix: "rgb",
+              fullRange: true
+            };
+          } else {
+            colorSpaceInit = {
+              primaries: "bt709",
+              transfer: "bt709",
+              matrix: "bt709",
+              fullRange: false
+            };
+          }
+        }
+        this.colorSpace = new VideoSampleColorSpace(colorSpaceInit);
         this.visibleRect = {
           left: init.visibleRect?.left ?? 0,
           top: init.visibleRect?.top ?? 0,
@@ -18951,8 +18982,8 @@ var Mediabunny = (() => {
           this.squarePixelWidth = this.rotation % 180 === 0 ? init.displayWidth : init.displayHeight;
           this.squarePixelHeight = this.rotation % 180 === 0 ? init.displayHeight : init.displayWidth;
         } else {
-          this.squarePixelWidth = this.codedWidth;
-          this.squarePixelHeight = this.codedHeight;
+          this.squarePixelWidth = this.visibleRect.width;
+          this.squarePixelHeight = this.visibleRect.height;
         }
       } else if (typeof VideoFrame !== "undefined" && data instanceof VideoFrame) {
         if (init?.rotation !== void 0 && ![0, 90, 180, 270].includes(init.rotation)) {
@@ -19043,8 +19074,53 @@ var Mediabunny = (() => {
           transfer: "iec61966-2-1",
           fullRange: true
         });
+      } else if (data instanceof VideoSampleResource) {
+        if (!init || typeof init !== "object") {
+          throw new TypeError("init must be an object.");
+        }
+        if (init.rotation !== void 0 && ![0, 90, 180, 270].includes(init.rotation)) {
+          throw new TypeError("init.rotation, when provided, must be 0, 90, 180, or 270.");
+        }
+        if (!Number.isFinite(init.timestamp)) {
+          throw new TypeError("init.timestamp must be a number.");
+        }
+        if (init.duration !== void 0 && (!Number.isFinite(init.duration) || init.duration < 0)) {
+          throw new TypeError("init.duration, when provided, must be a non-negative number.");
+        }
+        this._data = data;
+        data._referenceCount++;
+        this.format = data.getFormat();
+        if (this.format !== null && !VIDEO_SAMPLE_PIXEL_FORMATS.includes(this.format)) {
+          throw new TypeError("getFormat() must return a VideoSamplePixelFormat or null.");
+        }
+        this.visibleRect = {
+          left: 0,
+          top: 0,
+          width: data.getCodedWidth(),
+          height: data.getCodedHeight()
+        };
+        if (!Number.isInteger(this.visibleRect.width) || this.visibleRect.width <= 0) {
+          throw new TypeError("getCodedWidth() must return a positive integer.");
+        }
+        if (!Number.isInteger(this.visibleRect.height) || this.visibleRect.height <= 0) {
+          throw new TypeError("getCodedHeight() must return a positive integer.");
+        }
+        this.squarePixelWidth = data.getSquarePixelWidth();
+        if (!Number.isInteger(this.squarePixelWidth) || this.squarePixelWidth <= 0) {
+          throw new TypeError("getSquarePixelWidth() must return a positive integer.");
+        }
+        this.squarePixelHeight = data.getSquarePixelHeight();
+        if (!Number.isInteger(this.squarePixelHeight) || this.squarePixelHeight <= 0) {
+          throw new TypeError("getSquarePixelHeight() must return a positive integer.");
+        }
+        this.rotation = init.rotation ?? 0;
+        this.timestamp = init.timestamp;
+        this.duration = init.duration ?? 0;
+        this.colorSpace = data.getColorSpace();
       } else {
-        throw new TypeError("Invalid data type: Must be a BufferSource or CanvasImageSource.");
+        throw new TypeError(
+          "Invalid data type: Must be a BufferSource, CanvasImageSource, or VideoSampleResource."
+        );
       }
       this.pixelAspectRatio = simplifyRational({
         num: this.squarePixelWidth * this.codedHeight,
@@ -19089,7 +19165,13 @@ var Mediabunny = (() => {
         throw new Error("VideoSample is closed.");
       }
       assert(this._data !== null);
-      if (isVideoFrame(this._data)) {
+      if (this._data instanceof VideoSampleResource) {
+        return new _VideoSample(this._data, {
+          timestamp: this.timestamp,
+          duration: this.duration,
+          rotation: this.rotation
+        });
+      } else if (isVideoFrame(this._data)) {
         return new _VideoSample(this._data.clone(), {
           timestamp: this.timestamp,
           duration: this.duration,
@@ -19134,7 +19216,12 @@ var Mediabunny = (() => {
         return;
       }
       finalizationRegistry?.unregister(this);
-      if (isVideoFrame(this._data)) {
+      if (this._data instanceof VideoSampleResource) {
+        this._data._referenceCount--;
+        if (this._data._referenceCount === 0) {
+          this._data.close();
+        }
+      } else if (isVideoFrame(this._data)) {
         this._data.close();
       } else {
         this._data = null;
@@ -19142,35 +19229,24 @@ var Mediabunny = (() => {
       this._closed = true;
     }
     /**
-     * Returns the number of bytes required to hold this video sample's pixel data. Throws if `format` is `null`.
+     * Returns the number of bytes required to hold this video sample's pixel data.
      */
     allocationSize(options = {}) {
       validateVideoFrameCopyToOptions(options);
       if (this._closed) {
         throw new Error("VideoSample is closed.");
       }
-      if (this.format === null) {
-        throw new Error("Cannot get allocation size when format is null. Sorry!");
-      }
-      assert(this._data !== null);
-      if (!isVideoFrame(this._data)) {
-        if (options.colorSpace || options.format && options.format !== this.format || options.layout || options.rect) {
-          const videoFrame = this.toVideoFrame();
-          const size = videoFrame.allocationSize(options);
-          videoFrame.close();
-          return size;
-        }
+      if ((options.format ?? this.format) == null) {
+        throw new Error("Cannot get allocation size when format is null.");
       }
       if (isVideoFrame(this._data)) {
         return this._data.allocationSize(options);
-      } else if (this._data instanceof Uint8Array) {
-        return this._data.byteLength;
-      } else {
-        return this.codedWidth * this.codedHeight * 4;
       }
+      const combinedLayout = ParseVideoFrameCopyToOptions(this, options);
+      return combinedLayout.allocationSize;
     }
     /**
-     * Copies this video sample's pixel data to an ArrayBuffer or ArrayBufferView. Throws if `format` is `null`.
+     * Copies this video sample's pixel data to an ArrayBuffer or ArrayBufferView.
      * @returns The byte layout of the planes of the copied data.
      */
     async copyTo(destination, options = {}) {
@@ -19181,37 +19257,139 @@ var Mediabunny = (() => {
       if (this._closed) {
         throw new Error("VideoSample is closed.");
       }
-      if (this.format === null) {
-        throw new Error("Cannot copy video sample data when format is null. Sorry!");
+      if ((options.format ?? this.format) == null) {
+        throw new Error("Cannot copy video sample data when format is null.");
       }
       assert(this._data !== null);
-      if (!isVideoFrame(this._data)) {
-        if (options.colorSpace || options.format && options.format !== this.format || options.layout || options.rect) {
-          const videoFrame = this.toVideoFrame();
-          const layout = await videoFrame.copyTo(destination, options);
-          videoFrame.close();
-          return layout;
-        }
-      }
       if (isVideoFrame(this._data)) {
         return this._data.copyTo(destination, options);
+      }
+      if (options.format && !["RGBA", "RGBX", "BGRA", "BGRX"].includes(this.format) && ["RGBA", "RGBX", "BGRA", "BGRX"].includes(options.format)) {
+        if (this._data instanceof VideoSampleResource) {
+          var _stack = [];
+          try {
+            const rgbSample = __using(_stack, await this._data.toRgbSample(
+              {
+                timestamp: this.timestamp,
+                duration: this.duration,
+                rotation: this.rotation
+              },
+              options.colorSpace ?? "srgb"
+            ));
+            if (!(rgbSample instanceof _VideoSample)) {
+              throw new TypeError("toRgbSample() must return a VideoSample.");
+            }
+            if (!["RGBA", "RGBX", "BGRA", "BGRX"].includes(rgbSample.format)) {
+              throw new Error(
+                `Sample returned by toRgbSample was expected to have an RGB format, got '${rgbSample.format}' instead.`
+              );
+            }
+            return await rgbSample.copyTo(destination, options);
+          } catch (_) {
+            var _error = _, _hasError = true;
+          } finally {
+            __callDispose(_stack, _error, _hasError);
+          }
+        } else {
+          if (typeof VideoFrame === "undefined") {
+            throw new Error(
+              "For this sample, converting from a non-RGB to an RGB format requires VideoFrame to be defined."
+            );
+          }
+          const tempFrame = this.toVideoFrame();
+          const result = await tempFrame.copyTo(destination, options);
+          tempFrame.close();
+          return result;
+        }
+      }
+      const combinedLayout = ParseVideoFrameCopyToOptions(this, options);
+      assert(this.format);
+      const destBytes = toUint8Array(destination);
+      if (destBytes.byteLength < combinedLayout.allocationSize) {
+        throw new TypeError(
+          `Destination buffer too small. Required: ${combinedLayout.allocationSize}, Available: ${destBytes.byteLength}`
+        );
+      }
+      const planeConfigs = getPlaneConfigs(this.format);
+      let dataPlanes;
+      if (this._data instanceof VideoSampleResource) {
+        let result = this._data.getDataPlanes();
+        if (result instanceof Promise) result = await result;
+        if (!Array.isArray(result) || result.some((x) => !(x.data instanceof Uint8Array) || !Number.isInteger(x.stride) || x.stride < 0)) {
+          throw new TypeError(
+            'getDataPlanes() must return an array of objects with a Uint8Array "data" property and a non-negative integer "stride" property.'
+          );
+        }
+        dataPlanes = result;
       } else if (this._data instanceof Uint8Array) {
         assert(this._layout);
-        const dest = toUint8Array(destination);
-        dest.set(this._data);
-        return this._layout;
+        assert(this._layout.length === planeConfigs.length);
+        dataPlanes = this._layout.map((planeLayout, i) => {
+          const height = Math.ceil(this.codedHeight / planeConfigs[i].heightDivisor);
+          return {
+            data: this._data.subarray(
+              planeLayout.offset,
+              planeLayout.offset + planeLayout.stride * height
+            ),
+            stride: planeLayout.stride
+          };
+        });
       } else {
         const canvas = this._data;
         const context = canvas.getContext("2d");
         assert(context);
         const imageData = context.getImageData(0, 0, this.codedWidth, this.codedHeight);
-        const dest = toUint8Array(destination);
-        dest.set(imageData.data);
-        return [{
-          offset: 0,
+        dataPlanes = [{
+          data: toUint8Array(imageData.data),
           stride: 4 * this.codedWidth
         }];
       }
+      const planeLayouts = [];
+      const numPlanes = planeConfigs.length;
+      for (let planeIndex = 0; planeIndex < numPlanes; planeIndex++) {
+        const computedLayout = combinedLayout.computedLayouts[planeIndex];
+        const sourceStride = dataPlanes[planeIndex].stride;
+        const sourceData = dataPlanes[planeIndex].data;
+        let sourceOffset = computedLayout.sourceTop * sourceStride;
+        sourceOffset += computedLayout.sourceLeftBytes;
+        let destinationOffset = computedLayout.destinationOffset;
+        const rowBytes = computedLayout.sourceWidthBytes;
+        const layout = {
+          offset: destinationOffset,
+          stride: computedLayout.destinationStride
+        };
+        for (let row = 0; row < computedLayout.sourceHeight; row++) {
+          if (sourceOffset + rowBytes > sourceData.byteLength) {
+            throw new Error(`Source buffer OOB read.`);
+          }
+          if (destinationOffset + rowBytes > destBytes.byteLength) {
+            throw new Error(`Destination buffer OOB write.`);
+          }
+          const srcSub = sourceData.subarray(sourceOffset, sourceOffset + rowBytes);
+          destBytes.set(srcSub, destinationOffset);
+          sourceOffset += sourceStride;
+          destinationOffset += computedLayout.destinationStride;
+        }
+        planeLayouts.push(layout);
+      }
+      if (options.format !== void 0) {
+        const needsRgbConversion = this.format.startsWith("RGB") !== options.format.startsWith("RGB");
+        const needsAlphaConversion = this.format.includes("X") && options.format.includes("A");
+        if (needsRgbConversion || needsAlphaConversion) {
+          for (let i = 0; i < combinedLayout.allocationSize; i += 4) {
+            if (needsRgbConversion) {
+              const r = destBytes[i];
+              const b = destBytes[i + 2];
+              destBytes[i] = b;
+              destBytes[i + 2] = r;
+            }
+            if (needsAlphaConversion) {
+              destBytes[i + 3] = 255;
+            }
+          }
+        }
+      }
+      return planeLayouts;
     }
     /**
      * Converts this video sample to a VideoFrame for use with the WebCodecs API. The VideoFrame returned by this
@@ -19222,7 +19400,43 @@ var Mediabunny = (() => {
         throw new Error("VideoSample is closed.");
       }
       assert(this._data !== null);
-      if (isVideoFrame(this._data)) {
+      if (this._data instanceof VideoSampleResource) {
+        if (this.format === null) {
+          throw new Error(
+            "Cannot convert a VideoSampleResource-backed VideoSample to VideoFrame if format is null."
+          );
+        }
+        const planes = this._data.getDataPlanes();
+        if (planes instanceof Promise) {
+          throw new Error(
+            "Cannot convert a VideoSampleResource-backed VideoSample to VideoFrame if getDataPlanes() returns a promise."
+          );
+        }
+        const size = planes.reduce((a, b) => a + b.data.byteLength, 0);
+        const buffer = new Uint8Array(size);
+        let offset = 0;
+        const offsets = [];
+        for (const plane of planes) {
+          buffer.set(plane.data, offset);
+          offsets.push(offset);
+          offset += plane.data.byteLength;
+        }
+        return new VideoFrame(buffer, {
+          format: this.format,
+          layout: planes.map((x, i) => ({
+            offset: offsets[i],
+            stride: x.stride
+          })),
+          codedWidth: this.codedWidth,
+          codedHeight: this.codedHeight,
+          timestamp: this.microsecondTimestamp,
+          duration: this.microsecondDuration,
+          colorSpace: this.colorSpace,
+          displayWidth: this.squarePixelWidth,
+          // Not display* since we're not passing rotation
+          displayHeight: this.squarePixelHeight
+        });
+      } else if (isVideoFrame(this._data)) {
         return new VideoFrame(this._data, {
           timestamp: this.microsecondTimestamp,
           duration: this.microsecondDuration || void 0
@@ -19235,7 +19449,10 @@ var Mediabunny = (() => {
           codedHeight: this.codedHeight,
           timestamp: this.microsecondTimestamp,
           duration: this.microsecondDuration || void 0,
-          colorSpace: this.colorSpace
+          colorSpace: this.colorSpace,
+          displayWidth: this.squarePixelWidth,
+          // Not display* since we're not passing rotation
+          displayHeight: this.squarePixelHeight
         });
       } else {
         return new VideoFrame(this._data, {
@@ -19350,8 +19567,9 @@ var Mediabunny = (() => {
       const canvasHeight = context.canvas.height;
       const rotation = options.rotation ?? this.rotation;
       const [rotatedWidth, rotatedHeight] = rotation % 180 === 0 ? [this.squarePixelWidth, this.squarePixelHeight] : [this.squarePixelHeight, this.squarePixelWidth];
-      if (options.crop) {
-        clampCropRectangle(options.crop, rotatedWidth, rotatedHeight);
+      let finalCrop = options.crop;
+      if (finalCrop) {
+        finalCrop = clampCropRectangle(finalCrop, rotatedWidth, rotatedHeight);
       }
       let dx;
       let dy;
@@ -19414,7 +19632,7 @@ var Mediabunny = (() => {
      * Converts this video sample to a
      * [`CanvasImageSource`](https://udn.realityripple.com/docs/Web/API/CanvasImageSource) for drawing to a canvas.
      *
-     * You must use the value returned by this method immediately, as any VideoFrame created internally will
+     * You must use the value returned by this method immediately, as any VideoFrame created internally may
      * automatically be closed in the next microtask.
      */
     toCanvasImageSource() {
@@ -19422,7 +19640,7 @@ var Mediabunny = (() => {
         throw new Error("VideoSample is closed.");
       }
       assert(this._data !== null);
-      if (this._data instanceof Uint8Array) {
+      if (this._data instanceof VideoSampleResource || this._data instanceof Uint8Array) {
         const videoFrame = this.toVideoFrame();
         queueMicrotask(() => videoFrame.close());
         return videoFrame;
@@ -19430,6 +19648,142 @@ var Mediabunny = (() => {
         return this._data;
       }
     }
+    /**
+     * Transform this video sample to a new video sample given the options. Can be used to resize, rotate, and crop
+     * the sample.
+     *
+     * In non-browser environments, this method will not work by default. To make it work, register a custom
+     * transformer function via {@link registerVideoSampleTransformer}.
+     */
+    async transform(options) {
+      if (!options || typeof options !== "object") {
+        throw new TypeError("options must be an object.");
+      }
+      if (options.width !== void 0 && (!Number.isInteger(options.width) || options.width <= 0)) {
+        throw new TypeError("options.width, when provided, must be a positive integer.");
+      }
+      if (options.height !== void 0 && (!Number.isInteger(options.height) || options.height <= 0)) {
+        throw new TypeError("options.height, when provided, must be a positive integer.");
+      }
+      if (options.roundDimensionsTo !== void 0 && (!Number.isInteger(options.roundDimensionsTo) || options.roundDimensionsTo <= 0)) {
+        throw new TypeError("options.roundDimensionsTo, when provided, must be a positive integer.");
+      }
+      if (options.fit !== void 0 && !["fill", "contain", "cover"].includes(options.fit)) {
+        throw new TypeError('options.fit, when provided, must be one of "fill", "contain", or "cover".');
+      }
+      if (options.width !== void 0 && options.height !== void 0 && options.fit === void 0) {
+        throw new TypeError(
+          "When both options.width and options.height are provided, options.fit must also be provided."
+        );
+      }
+      if (options.rotate !== void 0 && ![0, 90, 180, 270].includes(options.rotate)) {
+        throw new TypeError("options.rotate, when provided, must be 0, 90, 180 or 270.");
+      }
+      if (options.crop !== void 0) {
+        validateCropRectangle(options.crop, "options.");
+      }
+      if (options.alpha !== void 0 && !["keep", "discard"].includes(options.alpha)) {
+        throw new TypeError("options.alpha, when provided, must be 'keep' or 'discard'.");
+      }
+      const rotation = normalizeRotation(this.rotation + (options.rotate ?? 0));
+      const [rotatedWidth, rotatedHeight] = rotation % 180 === 0 ? [this.squarePixelWidth, this.squarePixelHeight] : [this.squarePixelHeight, this.squarePixelWidth];
+      let finalCrop = options.crop;
+      if (finalCrop) {
+        finalCrop = clampCropRectangle(finalCrop, rotatedWidth, rotatedHeight);
+      }
+      const cropWidth = finalCrop ? finalCrop.width : rotatedWidth;
+      const cropHeight = finalCrop ? finalCrop.height : rotatedHeight;
+      const originalAspectRatio = cropWidth / cropHeight;
+      let targetWidth;
+      let targetHeight;
+      if (options.width !== void 0 && options.height === void 0) {
+        targetWidth = options.width;
+        targetHeight = targetWidth / originalAspectRatio;
+      } else if (options.width === void 0 && options.height !== void 0) {
+        targetHeight = options.height;
+        targetWidth = targetHeight * originalAspectRatio;
+      } else if (options.width !== void 0 && options.height !== void 0) {
+        targetWidth = options.width;
+        targetHeight = options.height;
+      } else {
+        targetWidth = cropWidth;
+        targetHeight = cropHeight;
+      }
+      targetWidth = roundToMultiple(targetWidth, options.roundDimensionsTo ?? 1);
+      targetHeight = roundToMultiple(targetHeight, options.roundDimensionsTo ?? 1);
+      const description = {
+        width: targetWidth,
+        height: targetHeight,
+        fit: options.fit ?? "fill",
+        rotation,
+        crop: finalCrop ?? {
+          left: 0,
+          top: 0,
+          width: rotatedWidth,
+          height: rotatedHeight
+        },
+        alpha: options.alpha ?? "keep"
+      };
+      for (const transformer of registeredVideoSampleTransformers) {
+        let result = transformer(this, description);
+        if (result instanceof Promise) result = await result;
+        if (result !== null) {
+          return result;
+        }
+      }
+      let canvas = null;
+      let canvasIsNew = false;
+      for (const entry of transformationCanvasCache) {
+        if (entry.canvas.width === description.width && entry.canvas.height === description.height) {
+          canvas = entry.canvas;
+          entry.age = transformationCanvasCacheNextAge++;
+          break;
+        }
+      }
+      if (canvas === null) {
+        if (typeof OffscreenCanvas !== "undefined") {
+          canvas = new OffscreenCanvas(description.width, description.height);
+        } else {
+          if (typeof window === "undefined" || typeof document === "undefined") {
+            throw new Error(
+              "Cannot transform VideoSamples in this environment. Either run in an environment with OffscreenCanvas or HTMLCanvasElement, or supply a custom VideoSample transformer using registerVideoSampleTransformer()."
+            );
+          }
+          canvas = document.createElement("canvas");
+          canvas.width = description.width;
+          canvas.height = description.height;
+        }
+        canvasIsNew = true;
+        if (transformationCanvasCache.length >= TRANSFORMATION_CANVAS_CACHE_MAX_SIZE) {
+          transformationCanvasCache.splice(arrayArgmin(transformationCanvasCache, (x) => x.age), 1);
+        }
+        transformationCanvasCache.push({
+          canvas,
+          age: transformationCanvasCacheNextAge++
+        });
+      }
+      const context = canvas.getContext("2d", {
+        alpha: true
+      });
+      assert(context);
+      if (description.alpha === "discard") {
+        context.fillStyle = "black";
+        context.fillRect(0, 0, description.width, description.height);
+      } else if (!canvasIsNew) {
+        context.clearRect(0, 0, description.width, description.height);
+      }
+      this.drawWithFit(context, {
+        fit: description.fit,
+        rotation: description.rotation,
+        crop: description.crop
+      });
+      return new _VideoSample(canvas, {
+        timestamp: this.timestamp,
+        duration: this.duration,
+        rotation: 0
+        // Any previous rotation is now baked in
+      });
+    }
     /** Sets the rotation metadata of this video sample. */
     setRotation(newRotation) {
       if (![0, 90, 180, 270].includes(newRotation)) {
@@ -19456,6 +19810,16 @@ var Mediabunny = (() => {
       this.close();
     }
   };
+  var registeredVideoSampleTransformers = [];
+  var registerVideoSampleTransformer = (transformer) => {
+    if (registeredVideoSampleTransformers.includes(transformer)) {
+      return;
+    }
+    registeredVideoSampleTransformers.push(transformer);
+  };
+  var TRANSFORMATION_CANVAS_CACHE_MAX_SIZE = 3;
+  var transformationCanvasCache = [];
+  var transformationCanvasCacheNextAge = 0;
   var VideoSampleColorSpace = class {
     /** Creates a new VideoSampleColorSpace. */
     constructor(init) {
@@ -19651,15 +20015,135 @@ var Mediabunny = (() => {
         assert(false);
     }
   };
+  var ParseVideoFrameCopyToOptions = (sample, options) => {
+    const defaultRect = {
+      left: 0,
+      top: 0,
+      width: sample.codedWidth,
+      height: sample.codedHeight
+    };
+    const overrideRect = options.rect;
+    const parsedRect = ParseVisibleRect(
+      defaultRect,
+      overrideRect,
+      sample.codedWidth,
+      sample.codedHeight,
+      sample.format
+    );
+    const optLayout = options.layout;
+    let format;
+    if (!options.format || options.format === sample.format) {
+      format = sample.format;
+    } else if (["RGBA", "RGBX", "BGRA", "BGRX"].includes(options.format)) {
+      format = options.format;
+    } else {
+      throw new Error("NotSupportedError: Invalid destination format.");
+    }
+    return ComputeLayoutAndAllocationSize(parsedRect, format, optLayout);
+  };
+  var ParseVisibleRect = (defaultRect, overrideRect, codedWidth, codedHeight, format) => {
+    const sourceRect = { ...defaultRect };
+    if (overrideRect !== void 0) {
+      if (overrideRect.width === 0 || overrideRect.height === 0) {
+        throw new TypeError("visibleRect dimensions cannot be zero.");
+      }
+      if ((overrideRect.x || 0) + (overrideRect.width || 0) > codedWidth) {
+        throw new TypeError("visibleRect exceeds codedWidth.");
+      }
+      if ((overrideRect.y || 0) + (overrideRect.height || 0) > codedHeight) {
+        throw new TypeError("visibleRect exceeds codedHeight.");
+      }
+      sourceRect.x = overrideRect.x || 0;
+      sourceRect.y = overrideRect.y || 0;
+      sourceRect.width = overrideRect.width || 0;
+      sourceRect.height = overrideRect.height || 0;
+    }
+    const validAlignment = VerifyRectOffsetAlignment(format, sourceRect);
+    if (!validAlignment) {
+      throw new TypeError("visibleRect alignment is invalid for the format.");
+    }
+    return sourceRect;
+  };
+  var VerifyRectOffsetAlignment = (format, rect) => {
+    if (format === null) return true;
+    const planes = getPlaneConfigs(format);
+    for (let planeIndex = 0; planeIndex < planes.length; planeIndex++) {
+      const plane = planes[planeIndex];
+      const sampleWidth = plane.widthDivisor;
+      const sampleHeight = plane.heightDivisor;
+      if ((rect.x || 0) % sampleWidth !== 0) return false;
+      if ((rect.y || 0) % sampleHeight !== 0) return false;
+    }
+    return true;
+  };
+  var ComputeLayoutAndAllocationSize = (parsedRect, format, layout) => {
+    const planes = getPlaneConfigs(format);
+    const numPlanes = planes.length;
+    if (layout !== void 0 && layout.length !== numPlanes) {
+      throw new TypeError(`Layout must have ${numPlanes} planes.`);
+    }
+    let minAllocationSize = 0;
+    const computedLayouts = [];
+    const endOffsets = [];
+    for (let planeIndex = 0; planeIndex < numPlanes; planeIndex++) {
+      const plane = planes[planeIndex];
+      const sampleBytes = plane.sampleBytes;
+      const sampleWidth = plane.widthDivisor;
+      const sampleHeight = plane.heightDivisor;
+      const computedLayout = {
+        destinationOffset: 0,
+        destinationStride: 0,
+        sourceTop: 0,
+        sourceHeight: 0,
+        sourceLeftBytes: 0,
+        sourceWidthBytes: 0
+      };
+      computedLayout.sourceTop = Math.ceil(Math.trunc(parsedRect.y || 0) / sampleHeight);
+      computedLayout.sourceHeight = Math.ceil(Math.trunc(parsedRect.height || 0) / sampleHeight);
+      computedLayout.sourceLeftBytes = Math.floor(Math.trunc(parsedRect.x || 0) / sampleWidth) * sampleBytes;
+      computedLayout.sourceWidthBytes = Math.floor(Math.trunc(parsedRect.width || 0) / sampleWidth) * sampleBytes;
+      if (layout !== void 0) {
+        const planeLayout = layout[planeIndex];
+        if (planeLayout.stride < computedLayout.sourceWidthBytes) {
+          throw new TypeError(`Stride for plane ${planeIndex} is too small.`);
+        }
+        computedLayout.destinationOffset = planeLayout.offset;
+        computedLayout.destinationStride = planeLayout.stride;
+      } else {
+        computedLayout.destinationOffset = minAllocationSize;
+        computedLayout.destinationStride = computedLayout.sourceWidthBytes;
+      }
+      const planeSize = computedLayout.destinationStride * computedLayout.sourceHeight;
+      const planeEnd = planeSize + computedLayout.destinationOffset;
+      if (planeEnd > 4294967295) {
+        throw new TypeError("Allocation size exceeds limit.");
+      }
+      endOffsets.push(planeEnd);
+      minAllocationSize = Math.max(minAllocationSize, planeEnd);
+      for (let earlierPlaneIndex = 0; earlierPlaneIndex < planeIndex; earlierPlaneIndex++) {
+        const earlierLayout = computedLayouts[earlierPlaneIndex];
+        if (endOffsets[planeIndex] <= earlierLayout.destinationOffset || endOffsets[earlierPlaneIndex] <= computedLayout.destinationOffset) {
+          continue;
+        }
+        throw new TypeError("Planes overlap.");
+      }
+      computedLayouts.push(computedLayout);
+    }
+    return {
+      allocationSize: minAllocationSize,
+      computedLayouts
+    };
+  };
   var AUDIO_SAMPLE_FORMATS = /* @__PURE__ */ new Set(
     ["f32", "f32-planar", "s16", "s16-planar", "s32", "s32-planar", "u8", "u8-planar"]
   );
+  var AudioSampleResource = class {
+    constructor() {
+      /** @internal */
+      this._referenceCount = 0;
+    }
+  };
   var AudioSample = class _AudioSample {
-    /**
-     * Creates a new {@link AudioSample}, either from an existing
-     * [`AudioData`](https://developer.mozilla.org/en-US/docs/Web/API/AudioData) or from raw bytes specified in
-     * {@link AudioSampleInit}.
-     */
     constructor(init) {
       /** @internal */
       this._closed = false;
@@ -19674,6 +20158,30 @@ var Mediabunny = (() => {
         this.numberOfChannels = init.numberOfChannels;
         this.timestamp = init.timestamp / 1e6;
         this.duration = init.numberOfFrames / init.sampleRate;
+      } else if (init instanceof AudioSampleResource) {
+        this._data = init;
+        init._referenceCount++;
+        this.format = init.getFormat();
+        if (!AUDIO_SAMPLE_FORMATS.has(this.format)) {
+          throw new TypeError("getFormat() must return an AudioSampleFormat.");
+        }
+        this.sampleRate = init.getSampleRate();
+        if (!Number.isInteger(this.sampleRate) || this.sampleRate <= 0) {
+          throw new TypeError("getSampleRate() must return a positive integer.");
+        }
+        this.numberOfFrames = init.getNumberOfFrames();
+        if (!Number.isInteger(this.numberOfFrames) || this.numberOfFrames < 0) {
+          throw new TypeError("getNumberOfFrames() must return a non-negative integer.");
+        }
+        this.numberOfChannels = init.getNumberOfChannels();
+        if (!Number.isInteger(this.numberOfChannels) || this.numberOfChannels <= 0) {
+          throw new TypeError("getNumberOfChannels() must return a positive integer.");
+        }
+        this.timestamp = init.getTimestamp();
+        if (!Number.isFinite(this.timestamp)) {
+          throw new TypeError("getTimestamp() must return a finite number.");
+        }
+        this.duration = this.numberOfFrames / this.sampleRate;
       } else {
         if (!init || typeof init !== "object") {
           throw new TypeError("Invalid AudioDataInit: must be an object.");
@@ -19787,7 +20295,8 @@ var Mediabunny = (() => {
       if (this._closed) {
         throw new Error("AudioSample is closed.");
       }
-      const { planeIndex, format, frameCount: optFrameCount, frameOffset: optFrameOffset } = options;
+      const { format, frameCount: optFrameCount, frameOffset: optFrameOffset } = options;
+      let { planeIndex } = options;
       const srcFormat = this.format;
       const destFormat = format ?? this.format;
       if (!destFormat) throw new Error("Destination format not determined");
@@ -19837,11 +20346,42 @@ var Mediabunny = (() => {
           });
         }
       } else {
-        const uint8Data = this._data;
-        const srcView = toDataView(uint8Data);
         const readFn = getReadFunction(srcFormat);
         const srcBytesPerSample = getBytesPerSample(srcFormat);
         const srcIsPlanar = formatIsPlanar(srcFormat);
+        let uint8Data;
+        if (this._data instanceof AudioSampleResource) {
+          const getDataPlaneValidated = (index) => {
+            const result = this._data.getDataPlane(index);
+            if (!(result instanceof Uint8Array)) {
+              throw new TypeError("getDataPlane() must return a Uint8Array.");
+            }
+            const expectedSize = numFrames * srcBytesPerSample * (srcIsPlanar ? 1 : numChannels);
+            if (result.byteLength !== expectedSize) {
+              throw new TypeError(
+                `Data plane ${index} has invalid size. Expected exactly ${expectedSize} bytes, got ${result.byteLength} bytes.`
+              );
+            }
+            return result;
+          };
+          if (srcIsPlanar) {
+            if (destIsPlanar) {
+              uint8Data = getDataPlaneValidated(planeIndex);
+              planeIndex = 0;
+            } else {
+              uint8Data = new Uint8Array(numFrames * srcBytesPerSample * numChannels);
+              for (let ch = 0; ch < numChannels; ch++) {
+                const planeData = getDataPlaneValidated(ch);
+                uint8Data.set(planeData, ch * numFrames * srcBytesPerSample);
+              }
+            }
+          } else {
+            uint8Data = getDataPlaneValidated(0);
+          }
+        } else {
+          uint8Data = this._data;
+        }
+        const srcView = toDataView(uint8Data);
         for (let i = 0; i < copyFrameCount; i++) {
           if (destIsPlanar) {
             const destOffset = i * destBytesPerSample;
@@ -19875,7 +20415,11 @@ var Mediabunny = (() => {
       if (this._closed) {
         throw new Error("AudioSample is closed.");
       }
-      if (isAudioData(this._data)) {
+      if (this._data instanceof AudioSampleResource) {
+        const sample = new _AudioSample(this._data);
+        sample.setTimestamp(this.timestamp);
+        return sample;
+      } else if (isAudioData(this._data)) {
         const sample = new _AudioSample(this._data.clone());
         sample.setTimestamp(this.timestamp);
         return sample;
@@ -19899,7 +20443,12 @@ var Mediabunny = (() => {
         return;
       }
       finalizationRegistry?.unregister(this);
-      if (isAudioData(this._data)) {
+      if (this._data instanceof AudioSampleResource) {
+        this._data._referenceCount--;
+        if (this._data._referenceCount === 0) {
+          this._data.close();
+        }
+      } else if (isAudioData(this._data)) {
         this._data.close();
       } else {
         this._data = new Uint8Array(0);
@@ -19914,36 +20463,13 @@ var Mediabunny = (() => {
       if (this._closed) {
         throw new Error("AudioSample is closed.");
       }
-      if (isAudioData(this._data)) {
+      if (this._data instanceof AudioSampleResource) {
+        return this._createAudioDataFromData();
+      } else if (isAudioData(this._data)) {
         if (this._data.timestamp === this.microsecondTimestamp) {
           return this._data.clone();
         } else {
-          if (formatIsPlanar(this.format)) {
-            const size = this.allocationSize({ planeIndex: 0, format: this.format });
-            const data = new ArrayBuffer(size * this.numberOfChannels);
-            for (let i = 0; i < this.numberOfChannels; i++) {
-              this.copyTo(new Uint8Array(data, i * size, size), { planeIndex: i, format: this.format });
-            }
-            return new AudioData({
-              format: this.format,
-              sampleRate: this.sampleRate,
-              numberOfFrames: this.numberOfFrames,
-              numberOfChannels: this.numberOfChannels,
-              timestamp: this.microsecondTimestamp,
-              data
-            });
-          } else {
-            const data = new ArrayBuffer(this.allocationSize({ planeIndex: 0, format: this.format }));
-            this.copyTo(data, { planeIndex: 0, format: this.format });
-            return new AudioData({
-              format: this.format,
-              sampleRate: this.sampleRate,
-              numberOfFrames: this.numberOfFrames,
-              numberOfChannels: this.numberOfChannels,
-              timestamp: this.microsecondTimestamp,
-              data
-            });
-          }
+          return this._createAudioDataFromData();
         }
       } else {
         return new AudioData({
@@ -19957,6 +20483,35 @@ var Mediabunny = (() => {
         });
       }
     }
+    /** @internal */
+    _createAudioDataFromData() {
+      if (formatIsPlanar(this.format)) {
+        const size = this.allocationSize({ planeIndex: 0, format: this.format });
+        const data = new ArrayBuffer(size * this.numberOfChannels);
+        for (let i = 0; i < this.numberOfChannels; i++) {
+          this.copyTo(new Uint8Array(data, i * size, size), { planeIndex: i, format: this.format });
+        }
+        return new AudioData({
+          format: this.format,
+          sampleRate: this.sampleRate,
+          numberOfFrames: this.numberOfFrames,
+          numberOfChannels: this.numberOfChannels,
+          timestamp: this.microsecondTimestamp,
+          data
+        });
+      } else {
+        const data = new ArrayBuffer(this.allocationSize({ planeIndex: 0, format: this.format }));
+        this.copyTo(data, { planeIndex: 0, format: this.format });
+        return new AudioData({
+          format: this.format,
+          sampleRate: this.sampleRate,
+          numberOfFrames: this.numberOfFrames,
+          numberOfChannels: this.numberOfChannels,
+          timestamp: this.microsecondTimestamp,
+          data
+        });
+      }
+    }
     /** Convert this audio sample to an AudioBuffer for use with the Web Audio API. */
     toAudioBuffer() {
       if (this._closed) {
@@ -20270,9 +20825,9 @@ var Mediabunny = (() => {
           "When both config.transform.width and config.transform.height are provided, config.transform.fit must also be provided."
         );
       }
-      if (config.transform.fit !== void 0 && ["fill", "contain", "cover"].includes(config.sizeChangeBehavior)) {
+      if (config.transform.fit !== void 0 && ["fill", "contain", "cover"].includes(config.sizeChangeBehavior) && config.transform.fit !== config.sizeChangeBehavior) {
         throw new TypeError(
-          "config.transform.fit cannot be used when config.sizeChangeBehavior is 'fill', 'contain' or 'cover', as sizeChangeBehavior already determines the fitting algorithm."
+          "config.transform.fit, when provided, cannot differ from config.sizeChangeBehavior when config.sizeChangeBehavior is 'fill', 'contain' or 'cover', as sizeChangeBehavior already determines the fitting algorithm."
         );
       }
       if (config.transform.rotate !== void 0 && ![0, 90, 180, 270].includes(config.transform.rotate)) {
@@ -21117,7 +21672,7 @@ var Mediabunny = (() => {
   };
   var BaseMediaSampleSink = class {
     /** @internal */
-    mediaSamplesInRange(startTimestamp = 0, endTimestamp = Infinity, options) {
+    mediaSamplesInRange(startTimestamp = -Infinity, endTimestamp = Infinity, options) {
       validateTimestamp(startTimestamp);
       validateTimestamp(endTimestamp);
       const sampleQueue = [];
@@ -21414,7 +21969,6 @@ var Mediabunny = (() => {
     return decodedSampleQueueSize === 0 ? 40 : 8;
   };
   var VideoDecoderWrapper = class extends DecoderWrapper {
-    // For HEVC stuff
     constructor(onSample, onError, codec, decoderConfig, rotation, timeResolution) {
       super(onSample, onError);
       this.codec = codec;
@@ -21438,13 +21992,14 @@ var Mediabunny = (() => {
       this.colorQueue = [];
       this.alphaQueue = [];
       this.merger = null;
-      this.mergerCreationFailed = false;
       this.decodedAlphaChunkCount = 0;
       this.alphaDecoderQueueSize = 0;
       /** Each value is the number of decoded alpha chunks at which a null alpha frame should be added. */
       this.nullAlphaFrameQueue = [];
       this.currentAlphaPacketIndex = 0;
       this.alphaRaslSkipped = false;
+      // For HEVC stuff
+      this.frameHandlerSerializer = new CallSerializer();
       const MatchingCustomDecoder = customVideoDecoders.find((x) => x.supports(codec, decoderConfig));
       if (MatchingCustomDecoder) {
         this.customDecoder = new MatchingCustomDecoder();
@@ -21459,13 +22014,15 @@ var Mediabunny = (() => {
         void this.customDecoderCallSerializer.call(() => this.customDecoder.init());
       } else {
         const colorHandler = (frame) => {
-          if (this.alphaQueue.length > 0) {
-            const alphaFrame = this.alphaQueue.shift();
-            assert(alphaFrame !== void 0);
-            this.mergeAlpha(frame, alphaFrame);
-          } else {
-            this.colorQueue.push(frame);
-          }
+          this.frameHandlerSerializer.call(async () => {
+            if (this.alphaQueue.length > 0) {
+              const alphaFrame = this.alphaQueue.shift();
+              assert(alphaFrame !== void 0);
+              await this.mergeAlpha(frame, alphaFrame);
+            } else {
+              this.colorQueue.push(frame);
+            }
+          }).catch((error) => this.onError(error));
         };
         if (codec === "avc" && this.decoderConfig.description && isChromium()) {
           const record = deserializeAvcDecoderConfigurationRecord(toUint8Array(this.decoderConfig.description));
@@ -21546,41 +22103,36 @@ var Mediabunny = (() => {
       this.currentPacketIndex++;
     }
     decodeAlphaData(packet) {
-      if (!packet.sideData.alpha || this.mergerCreationFailed) {
+      if (!packet.sideData.alpha) {
         this.pushNullAlphaFrame();
         return;
       }
       if (!this.merger) {
-        try {
-          this.merger = new ColorAlphaMerger();
-        } catch (error) {
-          console.error("Due to an error, only color data will be decoded.", error);
-          this.mergerCreationFailed = true;
-          this.decodeAlphaData(packet);
-          return;
-        }
+        this.merger = new ColorAlphaMerger();
       }
       if (!this.alphaDecoder) {
         const alphaHandler = (frame) => {
-          this.alphaDecoderQueueSize--;
-          if (this.colorQueue.length > 0) {
-            const colorFrame = this.colorQueue.shift();
-            assert(colorFrame !== void 0);
-            this.mergeAlpha(colorFrame, frame);
-          } else {
-            this.alphaQueue.push(frame);
-          }
-          this.decodedAlphaChunkCount++;
-          while (this.nullAlphaFrameQueue.length > 0 && this.nullAlphaFrameQueue[0] === this.decodedAlphaChunkCount) {
-            this.nullAlphaFrameQueue.shift();
+          this.frameHandlerSerializer.call(async () => {
             if (this.colorQueue.length > 0) {
               const colorFrame = this.colorQueue.shift();
               assert(colorFrame !== void 0);
-              this.mergeAlpha(colorFrame, null);
+              await this.mergeAlpha(colorFrame, frame);
             } else {
-              this.alphaQueue.push(null);
+              this.alphaQueue.push(frame);
+            }
+            this.decodedAlphaChunkCount++;
+            while (this.nullAlphaFrameQueue.length > 0 && this.nullAlphaFrameQueue[0] === this.decodedAlphaChunkCount) {
+              this.nullAlphaFrameQueue.shift();
+              if (this.colorQueue.length > 0) {
+                const colorFrame = this.colorQueue.shift();
+                assert(colorFrame !== void 0);
+                await this.mergeAlpha(colorFrame, null);
+              } else {
+                this.alphaQueue.push(null);
+              }
             }
-          }
+            this.alphaDecoderQueueSize--;
+          }).catch((error) => this.onError(error));
         };
         const stack = new Error("Decoding error").stack;
         this.alphaDecoder = new VideoDecoder({
@@ -21662,20 +22214,14 @@ var Mediabunny = (() => {
       sample.setRotation(this.rotation);
       this.onSample(sample);
     }
-    mergeAlpha(color, alpha) {
+    async mergeAlpha(color, alpha) {
       if (!alpha) {
         const finalSample2 = new VideoSample(color);
         this.sampleHandler(finalSample2);
         return;
       }
       assert(this.merger);
-      this.merger.update(color, alpha);
-      color.close();
-      alpha.close();
-      const finalFrame = new VideoFrame(this.merger.canvas, {
-        timestamp: color.timestamp,
-        duration: color.duration ?? void 0
-      });
+      const finalFrame = await this.merger.update(color, alpha);
       const finalSample = new VideoSample(finalFrame);
       this.sampleHandler(finalSample);
     }
@@ -21688,6 +22234,7 @@ var Mediabunny = (() => {
           this.decoder.flush(),
           this.alphaDecoder?.flush()
         ]);
+        await this.frameHandlerSerializer.currentPromise;
         this.colorQueue.forEach((x) => x.close());
         this.colorQueue.length = 0;
         this.alphaQueue.forEach((x) => x?.close());
@@ -21727,29 +22274,57 @@ var Mediabunny = (() => {
       this.sampleQueue.length = 0;
     }
   };
-  var ColorAlphaMerger = class {
+  var mergerGpuUnavailable = false;
+  var _ColorAlphaMerger = class _ColorAlphaMerger {
     constructor() {
-      if (typeof OffscreenCanvas !== "undefined") {
-        this.canvas = new OffscreenCanvas(300, 150);
+      this.canvas = null;
+      this.gl = null;
+      this.program = null;
+      this.vao = null;
+      this.colorTexture = null;
+      this.alphaTexture = null;
+      this.worker = null;
+      this.pendingRequests = /* @__PURE__ */ new Map();
+      this.nextRequestId = 0;
+      const canMakeCanvas = typeof OffscreenCanvas !== "undefined" || typeof document !== "undefined" && typeof document.createElement === "function";
+      if (!_ColorAlphaMerger.forceCpu && canMakeCanvas && !mergerGpuUnavailable) {
+        try {
+          if (typeof OffscreenCanvas !== "undefined") {
+            this.canvas = new OffscreenCanvas(300, 150);
+          } else {
+            this.canvas = document.createElement("canvas");
+          }
+          const gl = this.canvas.getContext("webgl2", {
+            premultipliedAlpha: false
+          });
+          if (!gl) {
+            throw new Error("Couldn't acquire WebGL 2 context.");
+          }
+          this.gl = gl;
+          this.program = this.createProgram();
+          this.vao = this.createVAO();
+          this.colorTexture = this.createTexture();
+          this.alphaTexture = this.createTexture();
+          this.gl.useProgram(this.program);
+          this.gl.uniform1i(this.gl.getUniformLocation(this.program, "u_colorTexture"), 0);
+          this.gl.uniform1i(this.gl.getUniformLocation(this.program, "u_alphaTexture"), 1);
+        } catch (error) {
+          this.gl = null;
+          this.canvas = null;
+          mergerGpuUnavailable = true;
+          console.warn("Falling back to CPU for color/alpha merging.", error);
+        }
+      }
+    }
+    async update(color, alpha) {
+      if (this.gl) {
+        return this.updateGpu(color, alpha);
       } else {
-        this.canvas = document.createElement("canvas");
+        return this.updateCpu(color, alpha);
       }
-      const gl = this.canvas.getContext("webgl2", {
-        premultipliedAlpha: false
-      });
-      if (!gl) {
-        throw new Error("Couldn't acquire WebGL 2 context.");
-      }
-      this.gl = gl;
-      this.program = this.createProgram();
-      this.vao = this.createVAO();
-      this.colorTexture = this.createTexture();
-      this.alphaTexture = this.createTexture();
-      this.gl.useProgram(this.program);
-      this.gl.uniform1i(this.gl.getUniformLocation(this.program, "u_colorTexture"), 0);
-      this.gl.uniform1i(this.gl.getUniformLocation(this.program, "u_alphaTexture"), 1);
     }
     createProgram() {
+      assert(this.gl);
       const vertexShader = this.createShader(this.gl.VERTEX_SHADER, `#version 300 es
 			in vec2 a_position;
 			in vec2 a_texCoord;
@@ -21781,12 +22356,15 @@ var Mediabunny = (() => {
       return program;
     }
     createShader(type, source) {
+      assert(this.gl);
       const shader = this.gl.createShader(type);
       this.gl.shaderSource(shader, source);
       this.gl.compileShader(shader);
       return shader;
     }
     createVAO() {
+      assert(this.gl);
+      assert(this.program);
       const vao = this.gl.createVertexArray();
       this.gl.bindVertexArray(vao);
       const vertices = new Float32Array([
@@ -21819,6 +22397,7 @@ var Mediabunny = (() => {
       return vao;
     }
     createTexture() {
+      assert(this.gl);
       const texture = this.gl.createTexture();
       this.gl.bindTexture(this.gl.TEXTURE_2D, texture);
       this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_S, this.gl.CLAMP_TO_EDGE);
@@ -21827,7 +22406,9 @@ var Mediabunny = (() => {
       this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MAG_FILTER, this.gl.LINEAR);
       return texture;
     }
-    update(color, alpha) {
+    updateGpu(color, alpha) {
+      assert(this.gl);
+      assert(this.canvas);
       if (color.displayWidth !== this.canvas.width || color.displayHeight !== this.canvas.height) {
         this.canvas.width = color.displayWidth;
         this.canvas.height = color.displayHeight;
@@ -21842,11 +22423,215 @@ var Mediabunny = (() => {
       this.gl.clear(this.gl.COLOR_BUFFER_BIT);
       this.gl.bindVertexArray(this.vao);
       this.gl.drawArrays(this.gl.TRIANGLE_STRIP, 0, 4);
+      const finalFrame = new VideoFrame(this.canvas, {
+        timestamp: color.timestamp,
+        duration: color.duration ?? void 0
+      });
+      color.close();
+      alpha.close();
+      return finalFrame;
+    }
+    updateCpu(color, alpha) {
+      if (!this.worker) {
+        const blob = new Blob(
+          [`(${colorAlphaMergerWorkerCode.toString()})()`],
+          { type: "application/javascript" }
+        );
+        const url2 = URL.createObjectURL(blob);
+        this.worker = new Worker(url2);
+        URL.revokeObjectURL(url2);
+        this.worker.addEventListener("message", (event) => {
+          const data = event.data;
+          const pending2 = this.pendingRequests.get(data.id);
+          if (!pending2) {
+            return;
+          }
+          this.pendingRequests.delete(data.id);
+          if ("error" in data) {
+            pending2.reject(new Error(data.error));
+          } else {
+            pending2.resolve(data.frame);
+          }
+        });
+        this.worker.addEventListener("error", (event) => {
+          const error = new Error(event.message || "Color/alpha merge worker error.");
+          for (const pending2 of this.pendingRequests.values()) {
+            pending2.reject(error);
+          }
+          this.pendingRequests.clear();
+        });
+      }
+      const id = this.nextRequestId++;
+      const pending = promiseWithResolvers();
+      this.pendingRequests.set(id, pending);
+      this.worker.postMessage({ id, color, alpha }, { transfer: [color, alpha] });
+      return pending.promise;
     }
     close() {
-      this.gl.getExtension("WEBGL_lose_context")?.loseContext();
+      this.gl?.getExtension("WEBGL_lose_context")?.loseContext();
       this.gl = null;
-    }
+      this.canvas = null;
+      this.worker?.terminate();
+      this.worker = null;
+      const error = new Error("Color/alpha merger closed.");
+      for (const pending of this.pendingRequests.values()) {
+        pending.reject(error);
+      }
+      this.pendingRequests.clear();
+    }
+  };
+  _ColorAlphaMerger.forceCpu = true;
+  var ColorAlphaMerger = _ColorAlphaMerger;
+  var colorAlphaMergerWorkerCode = () => {
+    let cpuAlphaBuffer = null;
+    let cpuColorBuffer = null;
+    let chain = Promise.resolve();
+    self.addEventListener("message", (event) => {
+      const { id, color, alpha } = event.data;
+      chain = chain.then(async () => {
+        try {
+          const frame = await merge(color, alpha);
+          self.postMessage({ id, frame }, { transfer: [frame] });
+        } catch (error) {
+          self.postMessage({ id, error: error.message });
+        } finally {
+          color.close();
+          alpha.close();
+        }
+      });
+    });
+    const merge = async (color, alpha) => {
+      const format = color.format;
+      const alphaFormat = alpha.format;
+      if (!format || !alphaFormat) {
+        throw new Error("CPU color/alpha merging requires a known VideoFrame format.");
+      }
+      const colorIs10 = format.includes("P10");
+      const colorIs12 = format.includes("P12");
+      const alphaIs10 = alphaFormat.includes("P10");
+      const alphaIs12 = alphaFormat.includes("P12");
+      if (alphaIs10 !== colorIs10 || alphaIs12 !== colorIs12) {
+        throw new Error(
+          `CPU color/alpha merging requires the alpha frame to have the same bit depth as the color frame (color: '${format}', alpha: '${alphaFormat}').`
+        );
+      }
+      const width = color.codedWidth;
+      const height = color.codedHeight;
+      if (format === "RGBX" || format === "RGBA" || format === "BGRX" || format === "BGRA") {
+        return await mergeInterleavedRgba(color, alpha, width, height, format);
+      } else if (format === "I420" || format === "I420P10" || format === "I420P12" || format === "I422" || format === "I422P10" || format === "I422P12" || format === "I444" || format === "I444P10" || format === "I444P12") {
+        return await mergePlanarYuv(color, alpha, width, height, format);
+      } else if (format === "NV12") {
+        return await mergeNv12(color, alpha, width, height);
+      }
+      throw new Error(`CPU color/alpha merging does not support format '${format}'.`);
+    };
+    const mergeInterleavedRgba = async (color, alpha, width, height, format) => {
+      const pixelCount = width * height;
+      const output = new Uint8Array(pixelCount * 4);
+      await color.copyTo(output);
+      const alphaY = await readAlpha(alpha, width, height, 1);
+      for (let i = 0, j = 3; i < pixelCount; i++, j += 4) {
+        output[j] = alphaY[i];
+      }
+      const outputFormat = format === "RGBX" || format === "RGBA" ? "RGBA" : "BGRA";
+      const init = {
+        format: outputFormat,
+        codedWidth: width,
+        codedHeight: height,
+        timestamp: color.timestamp,
+        duration: color.duration ?? void 0,
+        transfer: [output.buffer]
+      };
+      return new VideoFrame(output, init);
+    };
+    const mergePlanarYuv = async (color, alpha, width, height, format) => {
+      const is10 = format.includes("P10");
+      const is12 = format.includes("P12");
+      const bytesPerSample = is10 || is12 ? 2 : 1;
+      let chromaW;
+      let chromaH;
+      if (format.startsWith("I420")) {
+        chromaW = Math.ceil(width / 2);
+        chromaH = Math.ceil(height / 2);
+      } else if (format.startsWith("I422")) {
+        chromaW = Math.ceil(width / 2);
+        chromaH = height;
+      } else {
+        chromaW = width;
+        chromaH = height;
+      }
+      const ySamples = width * height;
+      const uvSamples = chromaW * chromaH;
+      const yBytes = ySamples * bytesPerSample;
+      const uvBytes = uvSamples * bytesPerSample;
+      const aBytes = ySamples * bytesPerSample;
+      const outputBytes = yBytes + 2 * uvBytes + aBytes;
+      const output = new Uint8Array(outputBytes);
+      await color.copyTo(output);
+      const alphaY = await readAlpha(alpha, width, height, bytesPerSample);
+      const aOffset = yBytes + 2 * uvBytes;
+      output.set(alphaY, aOffset);
+      const outputFormat = format.slice(0, 4) + "A" + format.slice(4);
+      const init = {
+        format: outputFormat,
+        codedWidth: width,
+        codedHeight: height,
+        timestamp: color.timestamp,
+        duration: color.duration ?? void 0,
+        transfer: [output.buffer]
+      };
+      return new VideoFrame(output, init);
+    };
+    const mergeNv12 = async (color, alpha, width, height) => {
+      const ySize = width * height;
+      const chromaW = Math.ceil(width / 2);
+      const chromaH = Math.ceil(height / 2);
+      const uvSize = chromaW * chromaH;
+      const sourceSize = color.allocationSize();
+      if (!cpuColorBuffer || cpuColorBuffer.byteLength !== sourceSize) {
+        cpuColorBuffer = new Uint8Array(sourceSize);
+      }
+      await color.copyTo(cpuColorBuffer);
+      const output = new Uint8Array(ySize + 2 * uvSize + ySize);
+      output.set(cpuColorBuffer.subarray(0, ySize), 0);
+      const uOffset = ySize;
+      const vOffset = ySize + uvSize;
+      const uvStart = ySize;
+      for (let i = 0; i < uvSize; i++) {
+        output[uOffset + i] = cpuColorBuffer[uvStart + i * 2];
+        output[vOffset + i] = cpuColorBuffer[uvStart + i * 2 + 1];
+      }
+      const alphaY = await readAlpha(alpha, width, height, 1);
+      output.set(alphaY, ySize + 2 * uvSize);
+      const init = {
+        format: "I420A",
+        codedWidth: width,
+        codedHeight: height,
+        timestamp: color.timestamp,
+        duration: color.duration ?? void 0,
+        transfer: [output.buffer]
+      };
+      return new VideoFrame(output, init);
+    };
+    const readAlpha = async (alpha, width, height, bytesPerSample) => {
+      const size = alpha.allocationSize();
+      if (!cpuAlphaBuffer || cpuAlphaBuffer.byteLength !== size) {
+        cpuAlphaBuffer = new Uint8Array(size);
+      }
+      await alpha.copyTo(cpuAlphaBuffer);
+      const format = alpha.format;
+      if (format === "RGBA" || format === "BGRA" || format === "RGBX" || format === "BGRX") {
+        const rOffset = format === "RGBA" || format === "RGBX" ? 0 : 2;
+        const pixelCount = width * height;
+        for (let i = 0; i < pixelCount; i++) {
+          cpuAlphaBuffer[i] = cpuAlphaBuffer[i * 4 + rOffset];
+        }
+        return cpuAlphaBuffer.subarray(0, pixelCount);
+      } else {
+        return cpuAlphaBuffer.subarray(0, width * height * bytesPerSample);
+      }
+    };
   };
   var VideoSampleSink = class extends BaseMediaSampleSink {
     /** Creates a new {@link VideoSampleSink} for the given {@link InputVideoTrack}. */
@@ -21898,7 +22683,7 @@ var Mediabunny = (() => {
      * @param endTimestamp - The timestamp in seconds at which to stop yielding samples (exclusive).
      * @param options - Options used for the underlying packet retrieval.
      */
-    samples(startTimestamp = 0, endTimestamp = Infinity, options = {}) {
+    samples(startTimestamp, endTimestamp, options = {}) {
       return this.mediaSamplesInRange(startTimestamp, endTimestamp, options);
     }
     /**
@@ -21907,6 +22692,9 @@ var Mediabunny = (() => {
      * once, and is therefore more efficient than manually getting the sample for every timestamp. The iterator may
      * yield null if no frame is available for a given timestamp.
      *
+     * This method is good for sparse access of media data. If you want primarily sequential media access, prefer
+     * {@link VideoSampleSink.samples} instead.
+     *
      * @param timestamps - An iterable or async iterable of timestamps in seconds.
      * @param options - Options used for the underlying packet retrieval.
      */
@@ -22064,7 +22852,7 @@ var Mediabunny = (() => {
      * @param endTimestamp - The timestamp in seconds at which to stop yielding canvases (exclusive).
      * @param options - Options used for the underlying packet retrieval.
      */
-    async *canvases(startTimestamp = 0, endTimestamp = Infinity, options) {
+    async *canvases(startTimestamp, endTimestamp, options) {
       await this._ensureInit();
       yield* mapAsyncGenerator(
         this._videoSampleSink.samples(startTimestamp, endTimestamp, options),
@@ -22077,6 +22865,9 @@ var Mediabunny = (() => {
      * therefore more efficient than manually getting the canvas for every timestamp. The iterator may yield null if
      * no frame is available for a given timestamp.
      *
+     * This method is good for sparse access of media data. If you want primarily sequential media access, prefer
+     * {@link CanvasSink.canvases} instead.
+     *
      * @param timestamps - An iterable or async iterable of timestamps in seconds.
      * @param options - Options used for the underlying packet retrieval.
      */
@@ -22098,9 +22889,18 @@ var Mediabunny = (() => {
       // Internal state to accumulate a precise current timestamp based on audio durations, not the (potentially
       // inaccurate) packet timestamps.
       this.currentTimestamp = null;
+      // Chromium does not respect negative packet timestamps, so we must do the fixin' ourselves
+      this.expectedFirstTimestamp = null;
+      this.timestampOffset = 0;
       const sampleHandler = (sample) => {
-        if (this.currentTimestamp === null || Math.abs(sample.timestamp - this.currentTimestamp) >= sample.duration) {
-          this.currentTimestamp = sample.timestamp;
+        let sampleTimestamp = sample.timestamp;
+        if (this.expectedFirstTimestamp && this.currentTimestamp === null) {
+          this.timestampOffset = this.expectedFirstTimestamp - sampleTimestamp;
+          ;
+        }
+        sampleTimestamp += this.timestampOffset;
+        if (this.currentTimestamp === null || Math.abs(sampleTimestamp - this.currentTimestamp) >= sample.duration) {
+          this.currentTimestamp = sampleTimestamp;
         }
         const preciseTimestamp = this.currentTimestamp;
         this.currentTimestamp += sample.duration;
@@ -22156,16 +22956,20 @@ var Mediabunny = (() => {
         void this.customDecoderCallSerializer.call(() => this.customDecoder.decode(packet)).then(() => this.customDecoderQueueSize--);
       } else {
         assert(this.decoder);
+        this.expectedFirstTimestamp ??= packet.timestamp;
         this.decoder.decode(packet.toEncodedAudioChunk());
       }
     }
-    flush() {
+    async flush() {
       if (this.customDecoder) {
-        return this.customDecoderCallSerializer.call(() => this.customDecoder.flush());
+        await this.customDecoderCallSerializer.call(() => this.customDecoder.flush());
       } else {
         assert(this.decoder);
-        return this.decoder.flush();
+        await this.decoder.flush();
       }
+      this.currentTimestamp = null;
+      this.expectedFirstTimestamp = null;
+      this.timestampOffset = 0;
     }
     close() {
       if (this.customDecoder) {
@@ -22408,7 +23212,7 @@ var Mediabunny = (() => {
      * @param endTimestamp - The timestamp in seconds at which to stop yielding samples (exclusive).
      * @param options - Options used for the underlying packet retrieval.
      */
-    samples(startTimestamp = 0, endTimestamp = Infinity, options = {}) {
+    samples(startTimestamp, endTimestamp, options = {}) {
       return this.mediaSamplesInRange(startTimestamp, endTimestamp, options);
     }
     /**
@@ -22417,6 +23221,9 @@ var Mediabunny = (() => {
      * once, and is therefore more efficient than manually getting the sample for every timestamp. The iterator may
      * yield null if no sample is available for a given timestamp.
      *
+     * This method is good for sparse access of media data. If you want primarily sequential media access, prefer
+     * {@link AudioSampleSink.samples} instead.
+     *
      * @param timestamps - An iterable or async iterable of timestamps in seconds.
      * @param options - Options used for the underlying packet retrieval.
      */
@@ -22463,7 +23270,7 @@ var Mediabunny = (() => {
      * @param endTimestamp - The timestamp in seconds at which to stop yielding buffers (exclusive).
      * @param options - Options used for the underlying packet retrieval.
      */
-    buffers(startTimestamp = 0, endTimestamp = Infinity, options) {
+    buffers(startTimestamp, endTimestamp, options) {
       return mapAsyncGenerator(
         this._audioSampleSink.samples(startTimestamp, endTimestamp, options),
         (data) => this._audioSampleToWrappedArrayBuffer(data)
@@ -27814,7 +28621,7 @@ var Mediabunny = (() => {
       const timescale = computeRationalApproximation(
         1 / (track.metadata.frameRate ?? GLOBAL_TIMESCALE),
         1e6
-      ).denominator;
+      ).den;
       const displayAspectWidth = decoderConfig.displayAspectWidth;
       const displayAspectHeight = decoderConfig.displayAspectHeight;
       const pixelAspectRatio = displayAspectWidth === void 0 || displayAspectHeight === void 0 ? { num: 1, den: 1 } : simplifyRational({
@@ -31324,7 +32131,6 @@ ${cue.notes ?? ""}`;
       this.encoder = null;
       this.muxer = null;
       this.lastMultipleOfKeyFrameInterval = -1;
-      this.resizeCanvas = null;
       // Tracks the input dimensions of the first frame
       this.codedWidth = null;
       this.codedHeight = null;
@@ -31353,12 +32159,6 @@ ${cue.notes ?? ""}`;
        */
       this.error = null;
       this.lastMuxerPromise = Promise.resolve();
-      const sizeChangeBehavior = encodingConfig.sizeChangeBehavior ?? "deny";
-      if (["fill", "contain", "cover"].includes(sizeChangeBehavior) && encodingConfig.transform?.fit !== void 0) {
-        throw new TypeError(
-          `Cannot set 'fit' when 'sizeChangeBehavior' is '${sizeChangeBehavior}'. The size change behavior determines the fit in this case.`
-        );
-      }
     }
     async add(videoSample, shouldClose, encodeOptions) {
       const originalSample = videoSample;
@@ -31384,17 +32184,8 @@ ${cue.notes ?? ""}`;
         const hasTransformConfig = config.transform?.width !== void 0 || config.transform?.height !== void 0 || config.transform?.rotate !== void 0 || config.transform?.crop !== void 0 || config.transform?.force === true;
         const needsTransform = hasTransformConfig || isSizeChange && sizeChangeBehavior !== "passThrough";
         if (needsTransform) {
-          const rotation = normalizeRotation(videoSample.rotation + (config.transform?.rotate ?? 0));
-          const [rotatedWidth, rotatedHeight] = rotation % 180 === 0 ? [videoSample.codedWidth, videoSample.codedHeight] : [videoSample.codedHeight, videoSample.codedWidth];
-          let finalCrop = config.transform?.crop;
-          if (finalCrop) {
-            finalCrop = clampCropRectangle(finalCrop, rotatedWidth, rotatedHeight);
-          }
-          const cropWidth = finalCrop ? finalCrop.width : rotatedWidth;
-          const cropHeight = finalCrop ? finalCrop.height : rotatedHeight;
-          const originalAspectRatio = cropWidth / cropHeight;
-          let targetWidth;
-          let targetHeight;
+          let targetWidth = config.transform?.width;
+          let targetHeight = config.transform?.height;
           let appliedFit = config.transform?.fit ?? "fill";
           if (isSizeChange && sizeChangeBehavior !== "passThrough") {
             assert(this.outputWidth);
@@ -31403,69 +32194,24 @@ ${cue.notes ?? ""}`;
             targetWidth = this.outputWidth;
             targetHeight = this.outputHeight;
             appliedFit = sizeChangeBehavior;
-          } else {
-            if (config.transform?.width !== void 0 && config.transform?.height === void 0) {
-              targetWidth = config.transform.width;
-              targetHeight = ceilToMultipleOfTwo(Math.round(targetWidth / originalAspectRatio));
-            } else if (config.transform?.width === void 0 && config.transform?.height !== void 0) {
-              targetHeight = config.transform.height;
-              targetWidth = ceilToMultipleOfTwo(Math.round(targetHeight * originalAspectRatio));
-            } else if (config.transform?.width !== void 0 && config.transform?.height !== void 0) {
-              targetWidth = config.transform?.width;
-              targetHeight = config.transform?.height;
-            } else {
-              targetWidth = cropWidth;
-              targetHeight = cropHeight;
-            }
           }
-          if (this.outputWidth === null || this.outputHeight === null) {
-            this.outputWidth = targetWidth;
-            this.outputHeight = targetHeight;
-          }
-          let canvasIsNew = false;
-          if (!this.resizeCanvas) {
-            if (typeof document !== "undefined") {
-              this.resizeCanvas = document.createElement("canvas");
-              this.resizeCanvas.width = targetWidth;
-              this.resizeCanvas.height = targetHeight;
-            } else {
-              this.resizeCanvas = new OffscreenCanvas(targetWidth, targetHeight);
-            }
-            canvasIsNew = true;
-          } else if (this.resizeCanvas.width !== targetWidth || this.resizeCanvas.height !== targetHeight) {
-            this.resizeCanvas.width = targetWidth;
-            this.resizeCanvas.height = targetHeight;
-          }
-          const context = this.resizeCanvas.getContext("2d", {
-            // Firefox has VideoFrame glitches with opaque canvases
-            alpha: this.encodingConfig.alpha === "keep" || isFirefox()
-          });
-          assert(context);
-          if (typeof context.resetTransform === "function") {
-            context.resetTransform();
-          }
-          if (!canvasIsNew) {
-            if (isFirefox()) {
-              context.fillStyle = "black";
-              context.fillRect(0, 0, targetWidth, targetHeight);
-            } else {
-              context.clearRect(0, 0, targetWidth, targetHeight);
-            }
-          }
-          videoSample.drawWithFit(context, {
+          const transformed = await videoSample.transform({
+            width: targetWidth,
+            height: targetHeight,
+            roundDimensionsTo: 2,
+            crop: config.transform?.crop,
+            rotate: config.transform?.rotate,
             fit: appliedFit,
-            rotation,
-            crop: finalCrop
+            alpha: config.alpha
           });
+          if (this.outputWidth === null || this.outputHeight === null) {
+            this.outputWidth = transformed.displayWidth;
+            this.outputHeight = transformed.displayHeight;
+          }
           if (shouldClose) {
             videoSample.close();
           }
-          videoSample = new VideoSample(this.resizeCanvas, {
-            timestamp: videoSample.timestamp,
-            duration: videoSample.duration,
-            rotation: 0
-            // Rotation is now baked into the canvas
-          });
+          videoSample = transformed;
           shouldClose = true;
         } else {
           if (this.outputWidth === null || this.outputHeight === null) {
@@ -31605,24 +32351,12 @@ ${cue.notes ?? ""}`;
                 const width = videoFrame.displayWidth;
                 const height = videoFrame.displayHeight;
                 if (!this.splitter) {
-                  try {
-                    this.splitter = new ColorAlphaSplitter(width, height);
-                  } catch (error) {
-                    console.error("Due to an error, only color data will be encoded.", error);
-                    this.splitterCreationFailed = true;
-                    this.alphaFrameQueue.push(null);
-                    this.encoder.encode(videoFrame, finalEncodeOptions);
-                    videoFrame.close();
-                  }
-                }
-                if (this.splitter) {
-                  const colorFrame = this.splitter.extractColor(videoFrame);
-                  const alphaFrame = this.splitter.extractAlpha(videoFrame);
-                  this.alphaFrameQueue.push(alphaFrame);
-                  this.encoder.encode(colorFrame, finalEncodeOptions);
-                  colorFrame.close();
-                  videoFrame.close();
+                  this.splitter = new ColorAlphaSplitter(width, height);
                 }
+                const { colorFrame, alphaFrame } = await this.splitter.update(videoFrame);
+                this.alphaFrameQueue.push(alphaFrame);
+                this.encoder.encode(colorFrame, finalEncodeOptions);
+                colorFrame.close();
               }
             }
             if (this.encoder.encodeQueueSize >= 4) {
@@ -31849,35 +32583,78 @@ ${cue.notes ?? ""}`;
       }
     }
   };
-  var ColorAlphaSplitter = class {
+  var splitterGpuUnavailable = false;
+  var _ColorAlphaSplitter = class _ColorAlphaSplitter {
     constructor(initialWidth, initialHeight) {
-      this.lastFrame = null;
-      if (typeof OffscreenCanvas !== "undefined") {
-        this.canvas = new OffscreenCanvas(initialWidth, initialHeight);
+      this.canvas = null;
+      this.gl = null;
+      this.colorProgram = null;
+      this.alphaProgram = null;
+      this.vao = null;
+      this.sourceTexture = null;
+      this.alphaResolutionLocation = null;
+      this.worker = null;
+      this.pendingRequests = /* @__PURE__ */ new Map();
+      this.nextRequestId = 0;
+      const canMakeCanvas = typeof OffscreenCanvas !== "undefined" || typeof document !== "undefined" && typeof document.createElement === "function";
+      if (!_ColorAlphaSplitter.forceCpu && canMakeCanvas && !splitterGpuUnavailable) {
+        try {
+          if (typeof OffscreenCanvas !== "undefined") {
+            this.canvas = new OffscreenCanvas(initialWidth, initialHeight);
+          } else {
+            this.canvas = document.createElement("canvas");
+            this.canvas.width = initialWidth;
+            this.canvas.height = initialHeight;
+          }
+          const gl = this.canvas.getContext("webgl2", {
+            alpha: true
+            // Needed due to the YUV thing we do for alpha
+          });
+          if (!gl) {
+            throw new Error("Couldn't acquire WebGL 2 context.");
+          }
+          this.gl = gl;
+          this.colorProgram = this.createColorProgram();
+          this.alphaProgram = this.createAlphaProgram();
+          this.vao = this.createVAO();
+          this.sourceTexture = this.createTexture();
+          this.alphaResolutionLocation = this.gl.getUniformLocation(this.alphaProgram, "u_resolution");
+          this.gl.useProgram(this.colorProgram);
+          this.gl.uniform1i(this.gl.getUniformLocation(this.colorProgram, "u_sourceTexture"), 0);
+          this.gl.useProgram(this.alphaProgram);
+          this.gl.uniform1i(this.gl.getUniformLocation(this.alphaProgram, "u_sourceTexture"), 0);
+        } catch (error) {
+          this.gl = null;
+          this.canvas = null;
+          splitterGpuUnavailable = true;
+          console.warn("Falling back to CPU for color/alpha splitting.", error);
+        }
+      }
+    }
+    async update(sourceFrame) {
+      if (this.gl) {
+        return this.updateGpu(sourceFrame);
       } else {
-        this.canvas = document.createElement("canvas");
-        this.canvas.width = initialWidth;
-        this.canvas.height = initialHeight;
+        return this.updateCpu(sourceFrame);
       }
-      const gl = this.canvas.getContext("webgl2", {
-        alpha: true
-        // Needed due to the YUV thing we do for alpha
-      });
-      if (!gl) {
-        throw new Error("Couldn't acquire WebGL 2 context.");
-      }
-      this.gl = gl;
-      this.colorProgram = this.createColorProgram();
-      this.alphaProgram = this.createAlphaProgram();
-      this.vao = this.createVAO();
-      this.sourceTexture = this.createTexture();
-      this.alphaResolutionLocation = this.gl.getUniformLocation(this.alphaProgram, "u_resolution");
-      this.gl.useProgram(this.colorProgram);
-      this.gl.uniform1i(this.gl.getUniformLocation(this.colorProgram, "u_sourceTexture"), 0);
-      this.gl.useProgram(this.alphaProgram);
-      this.gl.uniform1i(this.gl.getUniformLocation(this.alphaProgram, "u_sourceTexture"), 0);
+    }
+    updateGpu(sourceFrame) {
+      assert(this.gl);
+      assert(this.canvas);
+      if (sourceFrame.displayWidth !== this.canvas.width || sourceFrame.displayHeight !== this.canvas.height) {
+        this.canvas.width = sourceFrame.displayWidth;
+        this.canvas.height = sourceFrame.displayHeight;
+      }
+      this.gl.activeTexture(this.gl.TEXTURE0);
+      this.gl.bindTexture(this.gl.TEXTURE_2D, this.sourceTexture);
+      this.gl.texImage2D(this.gl.TEXTURE_2D, 0, this.gl.RGBA, this.gl.RGBA, this.gl.UNSIGNED_BYTE, sourceFrame);
+      const colorFrame = this.runColorProgram(sourceFrame);
+      const alphaFrame = this.runAlphaProgram(sourceFrame);
+      sourceFrame.close();
+      return { colorFrame, alphaFrame };
     }
     createVertexShader() {
+      assert(this.gl);
       return this.createShader(this.gl.VERTEX_SHADER, `#version 300 es
 			in vec2 a_position;
 			in vec2 a_texCoord;
@@ -31890,6 +32667,7 @@ ${cue.notes ?? ""}`;
 		`);
     }
     createColorProgram() {
+      assert(this.gl);
       const vertexShader = this.createVertexShader();
       const fragmentShader = this.createShader(this.gl.FRAGMENT_SHADER, `#version 300 es
 			precision highp float;
@@ -31910,6 +32688,7 @@ ${cue.notes ?? ""}`;
       return program;
     }
     createAlphaProgram() {
+      assert(this.gl);
       const vertexShader = this.createVertexShader();
       const fragmentShader = this.createShader(this.gl.FRAGMENT_SHADER, `#version 300 es
 			precision highp float;
@@ -31963,6 +32742,7 @@ ${cue.notes ?? ""}`;
       return program;
     }
     createShader(type, source) {
+      assert(this.gl);
       const shader = this.gl.createShader(type);
       this.gl.shaderSource(shader, source);
       this.gl.compileShader(shader);
@@ -31972,6 +32752,8 @@ ${cue.notes ?? ""}`;
       return shader;
     }
     createVAO() {
+      assert(this.gl);
+      assert(this.colorProgram);
       const vao = this.gl.createVertexArray();
       this.gl.bindVertexArray(vao);
       const vertices = new Float32Array([
@@ -32004,6 +32786,7 @@ ${cue.notes ?? ""}`;
       return vao;
     }
     createTexture() {
+      assert(this.gl);
       const texture = this.gl.createTexture();
       this.gl.bindTexture(this.gl.TEXTURE_2D, texture);
       this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_S, this.gl.CLAMP_TO_EDGE);
@@ -32012,21 +32795,9 @@ ${cue.notes ?? ""}`;
       this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MAG_FILTER, this.gl.LINEAR);
       return texture;
     }
-    updateTexture(sourceFrame) {
-      if (this.lastFrame === sourceFrame) {
-        return;
-      }
-      if (sourceFrame.displayWidth !== this.canvas.width || sourceFrame.displayHeight !== this.canvas.height) {
-        this.canvas.width = sourceFrame.displayWidth;
-        this.canvas.height = sourceFrame.displayHeight;
-      }
-      this.gl.activeTexture(this.gl.TEXTURE0);
-      this.gl.bindTexture(this.gl.TEXTURE_2D, this.sourceTexture);
-      this.gl.texImage2D(this.gl.TEXTURE_2D, 0, this.gl.RGBA, this.gl.RGBA, this.gl.UNSIGNED_BYTE, sourceFrame);
-      this.lastFrame = sourceFrame;
-    }
-    extractColor(sourceFrame) {
-      this.updateTexture(sourceFrame);
+    runColorProgram(sourceFrame) {
+      assert(this.gl);
+      assert(this.canvas);
       this.gl.useProgram(this.colorProgram);
       this.gl.viewport(0, 0, this.canvas.width, this.canvas.height);
       this.gl.clear(this.gl.COLOR_BUFFER_BIT);
@@ -32038,8 +32809,9 @@ ${cue.notes ?? ""}`;
         alpha: "discard"
       });
     }
-    extractAlpha(sourceFrame) {
-      this.updateTexture(sourceFrame);
+    runAlphaProgram(sourceFrame) {
+      assert(this.gl);
+      assert(this.canvas);
       this.gl.useProgram(this.alphaProgram);
       this.gl.uniform2f(this.alphaResolutionLocation, this.canvas.width, this.canvas.height);
       this.gl.viewport(0, 0, this.canvas.width, this.canvas.height);
@@ -32065,11 +32837,180 @@ ${cue.notes ?? ""}`;
       };
       return new VideoFrame(yuv, init);
     }
+    updateCpu(sourceFrame) {
+      if (!this.worker) {
+        const blob = new Blob(
+          [`(${colorAlphaSplitterWorkerCode.toString()})()`],
+          { type: "application/javascript" }
+        );
+        const url2 = URL.createObjectURL(blob);
+        this.worker = new Worker(url2);
+        URL.revokeObjectURL(url2);
+        this.worker.addEventListener("message", (event) => {
+          const data = event.data;
+          const pending2 = this.pendingRequests.get(data.id);
+          if (!pending2) {
+            return;
+          }
+          this.pendingRequests.delete(data.id);
+          if ("error" in data) {
+            pending2.reject(new Error(data.error));
+          } else {
+            pending2.resolve({ colorFrame: data.colorFrame, alphaFrame: data.alphaFrame });
+          }
+        });
+        this.worker.addEventListener("error", (event) => {
+          const error = new Error(event.message || "Color/alpha splitter worker error.");
+          for (const pending2 of this.pendingRequests.values()) {
+            pending2.reject(error);
+          }
+          this.pendingRequests.clear();
+        });
+      }
+      const id = this.nextRequestId++;
+      const pending = promiseWithResolvers();
+      this.pendingRequests.set(id, pending);
+      this.worker.postMessage({ id, sourceFrame }, { transfer: [sourceFrame] });
+      return pending.promise;
+    }
     close() {
-      this.gl.getExtension("WEBGL_lose_context")?.loseContext();
+      this.gl?.getExtension("WEBGL_lose_context")?.loseContext();
       this.gl = null;
+      this.canvas = null;
+      this.worker?.terminate();
+      this.worker = null;
+      const error = new Error("Color/alpha splitter closed.");
+      for (const pending of this.pendingRequests.values()) {
+        pending.reject(error);
+      }
+      this.pendingRequests.clear();
     }
   };
+  _ColorAlphaSplitter.forceCpu = true;
+  var ColorAlphaSplitter = _ColorAlphaSplitter;
+  var colorAlphaSplitterWorkerCode = () => {
+    let cpuSourceBuffer = null;
+    let chain = Promise.resolve();
+    self.addEventListener("message", (event) => {
+      const { id, sourceFrame } = event.data;
+      chain = chain.then(async () => {
+        try {
+          const { colorFrame, alphaFrame } = await split(sourceFrame);
+          self.postMessage({ id, colorFrame, alphaFrame }, { transfer: [colorFrame, alphaFrame] });
+        } catch (error) {
+          self.postMessage({ id, error: error.message });
+        } finally {
+          sourceFrame.close();
+        }
+      });
+    });
+    const split = async (sourceFrame) => {
+      const format = sourceFrame.format;
+      if (!format) {
+        throw new Error("CPU color/alpha splitting requires a known VideoFrame format.");
+      }
+      const width = sourceFrame.codedWidth;
+      const height = sourceFrame.codedHeight;
+      const sourceSize = sourceFrame.allocationSize();
+      if (!cpuSourceBuffer || cpuSourceBuffer.byteLength !== sourceSize) {
+        cpuSourceBuffer = new Uint8Array(sourceSize);
+      }
+      await sourceFrame.copyTo(cpuSourceBuffer);
+      if (format === "RGBA" || format === "BGRA") {
+        return splitInterleavedRgba(cpuSourceBuffer, width, height, format, sourceFrame);
+      } else if (format === "I420A" || format === "I420AP10" || format === "I420AP12" || format === "I422A" || format === "I422AP10" || format === "I422AP12" || format === "I444A" || format === "I444AP10" || format === "I444AP12") {
+        return splitPlanarYuvA(cpuSourceBuffer, width, height, format, sourceFrame);
+      }
+      throw new Error(`CPU color/alpha splitting does not support format '${format}'.`);
+    };
+    const splitInterleavedRgba = (source, width, height, format, sourceFrame) => {
+      const pixelCount = width * height;
+      const chromaW = Math.ceil(width / 2);
+      const chromaH = Math.ceil(height / 2);
+      const alphaSize = pixelCount + chromaW * chromaH * 2;
+      const alphaBuffer = new Uint8Array(alphaSize);
+      for (let i = 0, j = 3; i < pixelCount; i++, j += 4) {
+        alphaBuffer[i] = source[j];
+      }
+      alphaBuffer.fill(128, pixelCount);
+      const colorFrame = new VideoFrame(source, {
+        format: format === "RGBA" ? "RGBX" : "BGRX",
+        codedWidth: width,
+        codedHeight: height,
+        timestamp: sourceFrame.timestamp,
+        duration: sourceFrame.duration ?? void 0
+        // No transfer!
+      });
+      const alphaInit = {
+        format: "I420",
+        codedWidth: width,
+        codedHeight: height,
+        timestamp: sourceFrame.timestamp,
+        duration: sourceFrame.duration ?? void 0,
+        transfer: [alphaBuffer.buffer]
+      };
+      const alphaFrame = new VideoFrame(alphaBuffer, alphaInit);
+      return { colorFrame, alphaFrame };
+    };
+    const splitPlanarYuvA = (source, width, height, format, sourceFrame) => {
+      const is10 = format.includes("P10");
+      const is12 = format.includes("P12");
+      const bytesPerSample = is10 || is12 ? 2 : 1;
+      let chromaW;
+      let chromaH;
+      if (format.startsWith("I420")) {
+        chromaW = Math.ceil(width / 2);
+        chromaH = Math.ceil(height / 2);
+      } else if (format.startsWith("I422")) {
+        chromaW = Math.ceil(width / 2);
+        chromaH = height;
+      } else {
+        chromaW = width;
+        chromaH = height;
+      }
+      const ySamples = width * height;
+      const uvSamples = chromaW * chromaH;
+      const yBytes = ySamples * bytesPerSample;
+      const uvBytes = uvSamples * bytesPerSample;
+      const aBytes = ySamples * bytesPerSample;
+      const colorBytes = yBytes + uvBytes * 2;
+      const colorFormat = format.replace("A", "");
+      const alphaChromaW = Math.ceil(width / 2);
+      const alphaChromaH = Math.ceil(height / 2);
+      const alphaUvSamples = alphaChromaW * alphaChromaH;
+      const alphaUvBytes = alphaUvSamples * bytesPerSample;
+      const alphaSize = aBytes + 2 * alphaUvBytes;
+      const alphaBuffer = new Uint8Array(alphaSize);
+      const aPlaneStart = colorBytes;
+      alphaBuffer.set(source.subarray(aPlaneStart, aPlaneStart + aBytes), 0);
+      const uvOffset = aBytes;
+      const neutralChroma = is10 ? 512 : is12 ? 2048 : 128;
+      if (bytesPerSample === 1) {
+        alphaBuffer.fill(neutralChroma, uvOffset);
+      } else {
+        const uvView = new Uint16Array(alphaBuffer.buffer, uvOffset, 2 * alphaUvSamples);
+        uvView.fill(neutralChroma);
+      }
+      const alphaFormat = is10 ? "I420P10" : is12 ? "I420P12" : "I420";
+      const colorFrame = new VideoFrame(source.subarray(0, colorBytes), {
+        format: colorFormat,
+        codedWidth: width,
+        codedHeight: height,
+        timestamp: sourceFrame.timestamp,
+        duration: sourceFrame.duration ?? void 0
+      });
+      const alphaInit = {
+        format: alphaFormat,
+        codedWidth: width,
+        codedHeight: height,
+        timestamp: sourceFrame.timestamp,
+        duration: sourceFrame.duration ?? void 0,
+        transfer: [alphaBuffer.buffer]
+      };
+      const alphaFrame = new VideoFrame(alphaBuffer, alphaInit);
+      return { colorFrame, alphaFrame };
+    };
+  };
   var VideoSampleSource = class extends VideoSource {
     /**
      * Creates a new {@link VideoSampleSource} whose samples are encoded according to the specified
@@ -36036,6 +36977,9 @@ The @mediabunny/mp3-encoder extension package provides support for encoding MP3.
         throw new Error("Conversion cannot be executed twice.");
       }
       this._executed = true;
+      for (const id of this._outputTrackIds) {
+        this._synchronizer.declareTrack(id);
+      }
       if (this.onProgress) {
         const uniqueUtilizedTracks = new Set(this.utilizedTracks);
         const durationPromises = [...uniqueUtilizedTracks].map(async (track) => {
@@ -36101,7 +37045,8 @@ The @mediabunny/mp3-encoder extension package provides support for encoding MP3.
         return;
       }
       let videoSource;
-      const totalRotation = normalizeRotation(await track.getRotation() + (trackOptions.rotate ?? 0));
+      const innateRotation = await track.getRotation();
+      const totalRotation = normalizeRotation(innateRotation + (trackOptions.rotate ?? 0));
       let outputTrackRotation = totalRotation;
       const canUseRotationMetadata = this.output.format.supportsVideoRotationMetadata && (trackOptions.allowRotationMetadata ?? true);
       const squarePixelWidth = await track.getSquarePixelWidth();
@@ -36191,10 +37136,10 @@ The @mediabunny/mp3-encoder extension package provides support for encoding MP3.
           keyFrameInterval: trackOptions.keyFrameInterval,
           sizeChangeBehavior: trackOptions.fit ?? "passThrough",
           alpha,
-          hardwareAcceleration: trackOptions.hardwareAcceleration
+          hardwareAcceleration: trackOptions.hardwareAcceleration,
+          transform: {}
         };
-        const source = new VideoSampleSource(encodingConfig);
-        videoSource = source;
+        assert(encodingConfig.transform);
         let needsRerender = width !== originalWidth || height !== originalHeight || totalRotation !== 0 && (!canUseRotationMetadata || trackOptions.process !== void 0) || !!crop || squarePixelWidth !== await track.getCodedWidth() || squarePixelHeight !== await track.getCodedHeight();
         if (!needsRerender) {
           const tempOutput = new Output({
@@ -36221,136 +37166,36 @@ The @mediabunny/mp3-encoder extension package provides support for encoding MP3.
             await tempOutput.cancel();
           }
         }
+        if (trackOptions.frameRate) {
+          encodingConfig.transform.frameRate = trackOptions.frameRate;
+        }
         if (needsRerender) {
           outputTrackRotation = 0;
-          this._trackPromises.push((async () => {
-            await this._started;
-            const sink = new CanvasSink(track, {
-              width,
-              height,
-              fit: trackOptions.fit ?? "fill",
-              rotation: totalRotation,
-              // Bake the rotation into the output
-              crop: trackOptions.crop,
-              poolSize: 1,
-              alpha: alpha === "keep"
-            });
-            const iterator = sink.canvases(this._startTimestamp, this._endTimestamp);
-            const frameRate = trackOptions.frameRate;
-            let lastCanvas = null;
-            let lastCanvasTimestamp = null;
-            let lastCanvasEndTimestamp = null;
-            const padFrames = async (until) => {
-              assert(lastCanvas);
-              assert(frameRate !== void 0);
-              const frameDifference = Math.round((until - lastCanvasTimestamp) * frameRate);
-              for (let i = 1; i < frameDifference; i++) {
-                const sample = new VideoSample(lastCanvas, {
-                  timestamp: lastCanvasTimestamp + i / frameRate,
-                  duration: 1 / frameRate
-                });
-                await this._registerVideoSample(trackOptions, outputTrackId, source, sample);
-                sample.close();
-              }
-            };
-            for await (const { canvas, timestamp, duration } of iterator) {
-              if (this._canceled) {
-                return;
-              }
-              let adjustedSampleTimestamp = Math.max(timestamp - this._startTimestamp, 0);
-              lastCanvasEndTimestamp = adjustedSampleTimestamp + duration;
-              if (frameRate !== void 0) {
-                const alignedTimestamp = floorToDivisor(adjustedSampleTimestamp, frameRate);
-                if (lastCanvas !== null) {
-                  if (alignedTimestamp <= lastCanvasTimestamp) {
-                    lastCanvas = canvas;
-                    lastCanvasTimestamp = alignedTimestamp;
-                    continue;
-                  } else {
-                    await padFrames(alignedTimestamp);
-                  }
-                }
-                adjustedSampleTimestamp = alignedTimestamp;
-              }
-              const sample = new VideoSample(canvas, {
-                timestamp: adjustedSampleTimestamp,
-                duration: frameRate !== void 0 ? 1 / frameRate : duration
-              });
-              await this._registerVideoSample(trackOptions, outputTrackId, source, sample);
+          encodingConfig.transform.width = width;
+          encodingConfig.transform.height = height;
+          encodingConfig.transform.fit = trackOptions.fit ?? "fill";
+          encodingConfig.transform.rotate = normalizeRotation(totalRotation - innateRotation);
+          encodingConfig.transform.crop = crop;
+          encodingConfig.transform.alpha = alpha;
+        }
+        const source = new VideoSampleSource(encodingConfig);
+        videoSource = source;
+        this._trackPromises.push((async () => {
+          await this._started;
+          const sink = new VideoSampleSink(track);
+          for await (const sample of sink.samples(this._startTimestamp, this._endTimestamp)) {
+            if (this._canceled) {
               sample.close();
-              if (frameRate !== void 0) {
-                lastCanvas = canvas;
-                lastCanvasTimestamp = adjustedSampleTimestamp;
-              }
-            }
-            if (lastCanvas) {
-              assert(lastCanvasEndTimestamp !== null);
-              assert(frameRate !== void 0);
-              await padFrames(floorToDivisor(lastCanvasEndTimestamp, frameRate));
-            }
-            source.close();
-            this._synchronizer.closeTrack(outputTrackId);
-          })());
-        } else {
-          this._trackPromises.push((async () => {
-            await this._started;
-            const sink = new VideoSampleSink(track);
-            const frameRate = trackOptions.frameRate;
-            let lastSample = null;
-            let lastSampleTimestamp = null;
-            let lastSampleEndTimestamp = null;
-            const padFrames = async (until) => {
-              assert(lastSample);
-              assert(frameRate !== void 0);
-              const frameDifference = Math.round((until - lastSampleTimestamp) * frameRate);
-              for (let i = 1; i < frameDifference; i++) {
-                lastSample.setTimestamp(lastSampleTimestamp + i / frameRate);
-                lastSample.setDuration(1 / frameRate);
-                await this._registerVideoSample(trackOptions, outputTrackId, source, lastSample);
-              }
-              lastSample.close();
-            };
-            for await (const sample of sink.samples(this._startTimestamp, this._endTimestamp)) {
-              if (this._canceled) {
-                sample.close();
-                lastSample?.close();
-                return;
-              }
-              let adjustedSampleTimestamp = Math.max(sample.timestamp - this._startTimestamp, 0);
-              lastSampleEndTimestamp = adjustedSampleTimestamp + sample.duration;
-              if (frameRate !== void 0) {
-                const alignedTimestamp = floorToDivisor(adjustedSampleTimestamp, frameRate);
-                if (lastSample !== null) {
-                  if (alignedTimestamp <= lastSampleTimestamp) {
-                    lastSample.close();
-                    lastSample = sample;
-                    lastSampleTimestamp = alignedTimestamp;
-                    continue;
-                  } else {
-                    await padFrames(alignedTimestamp);
-                  }
-                }
-                adjustedSampleTimestamp = alignedTimestamp;
-                sample.setDuration(1 / frameRate);
-              }
-              sample.setTimestamp(adjustedSampleTimestamp);
-              await this._registerVideoSample(trackOptions, outputTrackId, source, sample);
-              if (frameRate !== void 0) {
-                lastSample = sample;
-                lastSampleTimestamp = adjustedSampleTimestamp;
-              } else {
-                sample.close();
-              }
-            }
-            if (lastSample) {
-              assert(lastSampleEndTimestamp !== null);
-              assert(frameRate !== void 0);
-              await padFrames(floorToDivisor(lastSampleEndTimestamp, frameRate));
+              return;
             }
-            source.close();
-            this._synchronizer.closeTrack(outputTrackId);
-          })());
-        }
+            const adjustedSampleTimestamp = Math.max(sample.timestamp - this._startTimestamp, 0);
+            sample.setTimestamp(adjustedSampleTimestamp);
+            await this._registerVideoSample(trackOptions, outputTrackId, source, sample);
+            sample.close();
+          }
+          source.close();
+          this._synchronizer.closeTrack(outputTrackId);
+        })());
       }
       let ownGroup = null;
       if (!trackOptions.group) {
@@ -36668,32 +37513,22 @@ The @mediabunny/mp3-encoder extension package provides support for encoding MP3.
       this.name = "ConversionCanceledError";
     }
   };
-  var MAX_TIMESTAMP_GAP = 5;
+  var MAX_TIMESTAMP_GAP = 1;
   var TrackSynchronizer = class {
     constructor() {
       this.maxTimestamps = /* @__PURE__ */ new Map();
       // Track ID -> timestamp
       this.resolvers = [];
     }
-    computeMinAndMaybeResolve() {
-      let newMin = Infinity;
-      for (const [, timestamp] of this.maxTimestamps) {
-        newMin = Math.min(newMin, timestamp);
-      }
-      for (let i = 0; i < this.resolvers.length; i++) {
-        const entry = this.resolvers[i];
-        if (entry.timestamp - newMin < MAX_TIMESTAMP_GAP) {
-          entry.resolve();
-          this.resolvers.splice(i, 1);
-          i--;
-        }
-      }
-      return newMin;
+    declareTrack(trackId) {
+      this.maxTimestamps.set(trackId, 0);
     }
     shouldWait(trackId, timestamp) {
-      this.maxTimestamps.set(trackId, Math.max(timestamp, this.maxTimestamps.get(trackId) ?? -Infinity));
+      const currentValue = this.maxTimestamps.get(trackId);
+      assert(currentValue !== void 0);
+      this.maxTimestamps.set(trackId, Math.max(timestamp, currentValue));
       const newMin = this.computeMinAndMaybeResolve();
-      return timestamp - newMin >= MAX_TIMESTAMP_GAP;
+      return timestamp - newMin > MAX_TIMESTAMP_GAP;
     }
     wait(timestamp) {
       const { promise, resolve } = promiseWithResolvers();
@@ -36707,6 +37542,21 @@ The @mediabunny/mp3-encoder extension package provides support for encoding MP3.
       this.maxTimestamps.delete(trackId);
       this.computeMinAndMaybeResolve();
     }
+    computeMinAndMaybeResolve() {
+      let newMin = Infinity;
+      for (const [, timestamp] of this.maxTimestamps) {
+        newMin = Math.min(newMin, timestamp);
+      }
+      for (let i = 0; i < this.resolvers.length; i++) {
+        const entry = this.resolvers[i];
+        if (entry.timestamp - newMin < MAX_TIMESTAMP_GAP) {
+          entry.resolve();
+          this.resolvers.splice(i, 1);
+          i--;
+        }
+      }
+      return newMin;
+    }
   };
 
   // src/index.ts