@remotion/media 4.0.352 → 4.0.354

package/dist/video/media-player.js

@@ -1,6 +1,7 @@
 import { ALL_FORMATS, AudioBufferSink, CanvasSink, Input, UrlSource, } from 'mediabunny';
-import { Log } from '../log';
-const SEEK_THRESHOLD = 0.05;
+import { Internals } from 'remotion';
+import { sleep, withTimeout } from './timeout-utils';
+export const SEEK_THRESHOLD = 0.05;
 export class MediaPlayer {
     constructor({ canvas, src, logLevel, sharedAudioContext, }) {
         this.canvasSink = null;
@@ -10,37 +11,26 @@ export class MediaPlayer {
         this.audioBufferIterator = null;
         this.queuedAudioNodes = new Set();
         this.gainNode = null;
-        this.expectedAudioTime = 0;
-        this.sharedAudioContext = null;
-        this.mediaTimeOffset = 0;
+        // audioDelay = mediaTimestamp + audioSyncAnchor - sharedAudioContext.currentTime
+        this.audioSyncAnchor = 0;
         this.playing = false;
         this.animationFrameId = null;
-        this.asyncId = 0;
+        this.videoAsyncId = 0;
         this.initialized = false;
         this.totalDuration = 0;
-        this.actualFps = null;
         // for remotion buffer state
-        this.isStalled = false;
-        this.lastAudioProgressAtMs = 0;
-        this.lastNetworkActivityAtMs = 0;
-        this.isNetworkActive = false;
-        this.isSeeking = false;
-        // A/V sync coordination
-        this.canStartAudio = false;
+        this.isBuffering = false;
+        this.audioBufferHealth = 0;
+        this.audioIteratorStarted = false;
+        this.HEALTHY_BUFER_THRESHOLD_SECONDS = 1;
+        this.input = null;
         this.render = () => {
-            const currentPlaybackTime = this.getPlaybackTime();
-            if (this.nextFrame && this.nextFrame.timestamp <= currentPlaybackTime) {
-                Log.trace(this.logLevel, `[MediaPlayer] Drawing frame at ${this.nextFrame.timestamp.toFixed(3)}s (playback time: ${currentPlaybackTime.toFixed(3)}s)`);
-                this.context.drawImage(this.nextFrame.canvas, 0, 0);
-                // For video-only content, track video progress as audio progress
-                if (!this.audioSink) {
-                    this.resetAudioProgressStopwatch();
-                }
-                this.nextFrame = null;
-                this.updateNextFrame();
+            if (this.isBuffering) {
+                this.maybeForceResumeFromBuffering();
+            }
+            if (this.shouldRenderFrame()) {
+                this.drawCurrentFrame();
             }
-            this.updateStalledState();
-            // continue render loop only if playing
             if (this.playing) {
                 this.animationFrameId = requestAnimationFrame(this.render);
             }
@@ -48,122 +38,107 @@ export class MediaPlayer {
                 this.animationFrameId = null;
             }
         };
+        this.startAudioIterator = async (timeToSeek) => {
+            if (!this.hasAudio())
+                return;
+            // Clean up existing audio iterator
+            await this.audioBufferIterator?.return();
+            this.audioIteratorStarted = false;
+            this.audioBufferHealth = 0;
+            try {
+                this.audioBufferIterator = this.audioSink.buffers(timeToSeek);
+                this.runAudioIterator();
+            }
+            catch (error) {
+                Internals.Log.error({ logLevel: this.logLevel, tag: '@remotion/media' }, '[MediaPlayer] Failed to start audio iterator', error);
+            }
+        };
         this.startVideoIterator = async (timeToSeek) => {
             if (!this.canvasSink) {
                 return;
             }
-            this.asyncId++;
-            const currentAsyncId = this.asyncId;
+            this.videoAsyncId++;
+            const currentAsyncId = this.videoAsyncId;
             await this.videoFrameIterator?.return();
             this.videoFrameIterator = this.canvasSink.canvases(timeToSeek);
             try {
                 const firstFrame = (await this.videoFrameIterator.next()).value ?? null;
                 const secondFrame = (await this.videoFrameIterator.next()).value ?? null;
-                if (currentAsyncId !== this.asyncId) {
-                    Log.trace(this.logLevel, `[MediaPlayer] Race condition detected, aborting startVideoIterator for ${timeToSeek.toFixed(3)}s`);
+                if (currentAsyncId !== this.videoAsyncId) {
                     return;
                 }
                 if (firstFrame) {
-                    Log.trace(this.logLevel, `[MediaPlayer] Drew initial frame ${firstFrame.timestamp.toFixed(3)}s`);
+                    Internals.Log.trace({ logLevel: this.logLevel, tag: '@remotion/media' }, `[MediaPlayer] Drew initial frame ${firstFrame.timestamp.toFixed(3)}s`);
                     this.context.drawImage(firstFrame.canvas, 0, 0);
-                    // For video-only content, track video progress as audio progress
-                    if (!this.audioSink) {
-                        this.resetAudioProgressStopwatch();
-                    }
-                    this.canStartAudio = true;
-                    this.isSeeking = false;
-                    this.tryStartAudio();
                 }
                 this.nextFrame = secondFrame ?? null;
                 if (secondFrame) {
-                    Log.trace(this.logLevel, `[MediaPlayer] Buffered next frame ${secondFrame.timestamp.toFixed(3)}s`);
-                    // For video-only content, track video progress as audio progress
-                    if (!this.audioSink) {
-                        this.resetAudioProgressStopwatch();
-                    }
-                    if (!this.canStartAudio) {
-                        this.canStartAudio = true;
-                        this.tryStartAudio();
-                    }
+                    Internals.Log.trace({ logLevel: this.logLevel, tag: '@remotion/media' }, `[MediaPlayer] Buffered next frame ${secondFrame.timestamp.toFixed(3)}s`);
                 }
-                this.updateStalledState();
             }
             catch (error) {
-                Log.error('[MediaPlayer] Failed to start video iterator', error);
+                Internals.Log.error({ logLevel: this.logLevel, tag: '@remotion/media' }, '[MediaPlayer] Failed to start video iterator', error);
             }
         };
         this.updateNextFrame = async () => {
             if (!this.videoFrameIterator) {
                 return;
             }
-            const currentAsyncId = this.asyncId;
             try {
                 while (true) {
                     const newNextFrame = (await this.videoFrameIterator.next()).value ?? null;
                     if (!newNextFrame) {
                         break;
                     }
-                    if (currentAsyncId !== this.asyncId) {
-                        Log.trace(this.logLevel, `[MediaPlayer] Race condition detected in updateNextFrame`);
-                        break;
-                    }
                     if (newNextFrame.timestamp <= this.getPlaybackTime()) {
-                        Log.trace(this.logLevel, `[MediaPlayer] Drawing immediate frame ${newNextFrame.timestamp.toFixed(3)}s`);
-                        this.context.drawImage(newNextFrame.canvas, 0, 0);
-                        // For video-only content, track video progress as audio progress
-                        if (!this.audioSink) {
-                            this.resetAudioProgressStopwatch();
-                        }
+                        continue;
                     }
                     else {
                         this.nextFrame = newNextFrame;
-                        Log.trace(this.logLevel, `[MediaPlayer] Buffered next frame ${newNextFrame.timestamp.toFixed(3)}s`);
-                        // For video-only content, track video progress as audio progress
-                        if (!this.audioSink) {
-                            this.resetAudioProgressStopwatch();
-                        }
-                        // Open audio gate when new frames become available
-                        if (!this.canStartAudio) {
-                            this.canStartAudio = true;
-                            this.tryStartAudio();
-                        }
+                        Internals.Log.trace({ logLevel: this.logLevel, tag: '@remotion/media' }, `[MediaPlayer] Buffered next frame ${newNextFrame.timestamp.toFixed(3)}s`);
                         break;
                     }
                 }
             }
             catch (error) {
-                Log.error('[MediaPlayer] Failed to update next frame', error);
+                Internals.Log.error({ logLevel: this.logLevel, tag: '@remotion/media' }, '[MediaPlayer] Failed to update next frame', error);
             }
-            this.updateStalledState();
         };
+        this.bufferingStartedAtMs = null;
+        this.minBufferingTimeoutMs = 500;
         this.runAudioIterator = async () => {
-            if (!this.audioSink ||
-                !this.sharedAudioContext ||
-                !this.audioBufferIterator ||
-                !this.gainNode) {
+            if (!this.hasAudio() || !this.audioBufferIterator)
                 return;
-            }
             try {
-                this.expectedAudioTime = this.sharedAudioContext.currentTime;
-                for await (const { buffer, timestamp } of this.audioBufferIterator) {
-                    const node = this.sharedAudioContext.createBufferSource();
-                    node.buffer = buffer;
-                    node.connect(this.gainNode);
-                    if (this.expectedAudioTime >= this.sharedAudioContext.currentTime) {
-                        node.start(this.expectedAudioTime);
+                let totalBufferDuration = 0;
+                let isFirstBuffer = true;
+                this.audioIteratorStarted = true;
+                while (true) {
+                    const BUFFERING_TIMEOUT_MS = 50;
+                    let result;
+                    try {
+                        result = await withTimeout(this.audioBufferIterator.next(), BUFFERING_TIMEOUT_MS, 'Iterator timeout');
                     }
-                    else {
-                        const offset = this.sharedAudioContext.currentTime - this.expectedAudioTime;
-                        node.start(this.sharedAudioContext.currentTime, offset);
+                    catch {
+                        this.setBufferingState(true);
+                        await sleep(10);
+                        continue;
+                    }
+                    if (result.done || !result.value) {
+                        break;
+                    }
+                    const { buffer, timestamp, duration } = result.value;
+                    totalBufferDuration += duration;
+                    this.audioBufferHealth = Math.max(0, totalBufferDuration);
+                    this.maybeResumeFromBuffering(totalBufferDuration);
+                    if (this.playing) {
+                        if (isFirstBuffer) {
+                            this.audioSyncAnchor =
+                                this.sharedAudioContext.currentTime - timestamp;
+                            isFirstBuffer = false;
+                        }
+                        this.scheduleAudioChunk(buffer, timestamp);
                     }
-                    this.queuedAudioNodes.add(node);
-                    node.onended = () => {
-                        this.queuedAudioNodes.delete(node);
-                    };
-                    this.expectedAudioTime += buffer.duration;
-                    this.updateStalledState();
-                    // If we're more than a second ahead of the current playback time, let's slow down the loop until time has
-                    // passed. Use timestamp for throttling logic as it represents media time.
                     if (timestamp - this.getPlaybackTime() >= 1) {
                         await new Promise((resolve) => {
                             const check = () => {
@@ -180,13 +155,13 @@ export class MediaPlayer {
                 }
             }
             catch (error) {
-                Log.error('[MediaPlayer] Failed to run audio iterator', error);
+                Internals.Log.error({ logLevel: this.logLevel, tag: '@remotion/media' }, '[MediaPlayer] Failed to run audio iterator', error);
             }
         };
         this.canvas = canvas;
         this.src = src;
         this.logLevel = logLevel ?? 'info';
-        this.sharedAudioContext = sharedAudioContext || null;
+        this.sharedAudioContext = sharedAudioContext;
         const context = canvas.getContext('2d', {
             alpha: false,
             desynchronized: true,
@@ -195,26 +170,24 @@ export class MediaPlayer {
             throw new Error('Could not get 2D context from canvas');
         }
         this.context = context;
-        // Initialize audio progress stopwatch
-        this.resetAudioProgressStopwatch();
-        Log.trace(this.logLevel, `[MediaPlayer] Created for src: ${src}`);
+    }
+    isReady() {
+        return this.initialized && Boolean(this.sharedAudioContext);
+    }
+    hasAudio() {
+        return Boolean(this.audioSink && this.sharedAudioContext && this.gainNode);
+    }
+    isCurrentlyBuffering() {
+        return this.isBuffering && Boolean(this.bufferingStartedAtMs);
     }
     async initialize(startTime = 0) {
-        if (this.initialized) {
-            Log.trace(this.logLevel, `[MediaPlayer] Already initialized, skipping`);
-            return;
-        }
         try {
-            Log.trace(this.logLevel, `[MediaPlayer] Initializing at startTime: ${startTime.toFixed(3)}s...`);
             const urlSource = new UrlSource(this.src);
-            urlSource.onread = () => {
-                this.lastNetworkActivityAtMs = this.getCurrentTimeMs();
-                this.isNetworkActive = true;
-            };
             const input = new Input({
                 source: urlSource,
                 formats: ALL_FORMATS,
             });
+            this.input = input;
             this.totalDuration = await input.computeDuration();
             const videoTrack = await input.getPrimaryVideoTrack();
             const audioTrack = await input.getPrimaryAudioTrack();
@@ -228,274 +201,161 @@ export class MediaPlayer {
                 });
                 this.canvas.width = videoTrack.displayWidth;
                 this.canvas.height = videoTrack.displayHeight;
-                // Extract actual FPS for stall detection
-                const packetStats = await videoTrack.computePacketStats();
-                this.actualFps = packetStats.averagePacketRate;
-                Log.trace(this.logLevel, `[MediaPlayer] Detected video FPS: ${this.actualFps}`);
             }
             if (audioTrack && this.sharedAudioContext) {
                 this.audioSink = new AudioBufferSink(audioTrack);
                 this.gainNode = this.sharedAudioContext.createGain();
                 this.gainNode.connect(this.sharedAudioContext.destination);
             }
-            // For audio-only content, allow audio to start immediately
-            if (!videoTrack && audioTrack) {
-                this.canStartAudio = true;
-            }
-            // Initialize timing offset based on actual starting position
             if (this.sharedAudioContext) {
-                this.mediaTimeOffset = this.sharedAudioContext.currentTime - startTime;
-                Log.trace(this.logLevel, `[MediaPlayer] Set mediaTimeOffset to ${this.mediaTimeOffset.toFixed(3)}s (audioContext: ${this.sharedAudioContext.currentTime.toFixed(3)}s, startTime: ${startTime.toFixed(3)}s)`);
-                this.lastAudioProgressAtMs = this.getCurrentTimeMs();
-                this.lastNetworkActivityAtMs = this.getCurrentTimeMs();
+                this.audioSyncAnchor = this.sharedAudioContext.currentTime - startTime;
             }
             this.initialized = true;
+            await this.startAudioIterator(startTime);
             await this.startVideoIterator(startTime);
             this.startRenderLoop();
-            Log.trace(this.logLevel, `[MediaPlayer] Initialized successfully with iterators started, duration: ${this.totalDuration}s`);
         }
         catch (error) {
-            Log.error('[MediaPlayer] Failed to initialize', error);
+            Internals.Log.error({ logLevel: this.logLevel, tag: '@remotion/media' }, '[MediaPlayer] Failed to initialize', error);
             throw error;
         }
     }
-    seekTo(time) {
-        if (!this.initialized || !this.sharedAudioContext) {
-            return;
-        }
-        // Ensure mediaTimeOffset is initialized (safety fallback)
-        if (this.mediaTimeOffset === 0) {
-            this.mediaTimeOffset = this.sharedAudioContext.currentTime - time;
-            Log.trace(this.logLevel, `[MediaPlayer] Late-initialized mediaTimeOffset to ${this.mediaTimeOffset.toFixed(3)}s`);
+    cleanupAudioQueue() {
+        for (const node of this.queuedAudioNodes) {
+            node.stop();
         }
+        this.queuedAudioNodes.clear();
+    }
+    async cleanAudioIteratorAndNodes() {
+        await this.audioBufferIterator?.return();
+        this.audioBufferIterator = null;
+        this.audioIteratorStarted = false;
+        this.audioBufferHealth = 0;
+        this.cleanupAudioQueue();
+    }
+    async seekTo(time) {
+        if (!this.isReady())
+            return;
         const newTime = Math.max(0, Math.min(time, this.totalDuration));
         const currentPlaybackTime = this.getPlaybackTime();
         const isSignificantSeek = Math.abs(newTime - currentPlaybackTime) > SEEK_THRESHOLD;
-        // Update offset to make audio context time correspond to new media time
-        this.mediaTimeOffset = this.sharedAudioContext.currentTime - newTime;
         if (isSignificantSeek) {
-            Log.trace(this.logLevel, `[MediaPlayer] Significant seek to ${newTime.toFixed(3)}s - creating new iterator`);
-            this.isSeeking = true;
-            this.canStartAudio = false;
-            this.updateStalledState();
-            // Stop existing audio first
-            if (this.playing && this.audioSink) {
-                this.audioBufferIterator?.return();
-                this.audioBufferIterator = null;
-                // Stop current audio nodes
-                for (const node of this.queuedAudioNodes) {
-                    node.stop();
-                }
-                this.queuedAudioNodes.clear();
-            }
-            // Start video iterator (which will open audio gate when ready)
-            this.startVideoIterator(newTime);
-        }
-        else {
-            Log.trace(this.logLevel, `[MediaPlayer] Minor time update to ${newTime.toFixed(3)}s - using existing iterator`);
-            // if paused, trigger a single frame update to show current position
-            if (!this.playing) {
-                this.renderSingleFrame();
-            }
-        }
-    }
-    async drawInitialFrame(time = 0) {
-        if (!this.initialized || !this.canvasSink) {
-            Log.trace(this.logLevel, `[MediaPlayer] Cannot draw initial frame - not initialized or no canvas sink`);
-            return;
-        }
-        try {
-            Log.trace(this.logLevel, `[MediaPlayer] Drawing initial frame at ${time.toFixed(3)}s`);
-            // create temporary iterator just to get the first frame
-            const tempIterator = this.canvasSink.canvases(time);
-            const firstFrame = (await tempIterator.next()).value;
-            if (firstFrame) {
-                this.context.drawImage(firstFrame.canvas, 0, 0);
-                Log.trace(this.logLevel, `[MediaPlayer] Drew initial frame at timestamp ${firstFrame.timestamp.toFixed(3)}s`);
-            }
-            else {
-                Log.trace(this.logLevel, `[MediaPlayer] No frame available at ${time.toFixed(3)}s`);
+            this.audioSyncAnchor = this.sharedAudioContext.currentTime - newTime;
+            if (this.audioSink) {
+                await this.cleanAudioIteratorAndNodes();
             }
-            // clean up the temporary iterator
-            await tempIterator.return();
+            await this.startAudioIterator(newTime);
+            await this.startVideoIterator(newTime);
         }
-        catch (error) {
-            Log.error('[MediaPlayer] Failed to draw initial frame', error);
+        if (!this.playing) {
+            this.render();
         }
     }
     async play() {
-        if (!this.initialized || !this.sharedAudioContext) {
+        if (!this.isReady())
             return;
-        }
         if (!this.playing) {
             if (this.sharedAudioContext.state === 'suspended') {
                 await this.sharedAudioContext.resume();
             }
             this.playing = true;
-            Log.trace(this.logLevel, `[MediaPlayer] Play - starting render loop`);
             this.startRenderLoop();
-            // Audio will start automatically when video signals readiness via tryStartAudio()
-            this.tryStartAudio();
         }
     }
     pause() {
-        if (this.playing) {
-            this.playing = false;
-            // stop audio iterator
-            this.audioBufferIterator?.return();
-            this.audioBufferIterator = null;
-            // stop all playing audio nodes
-            for (const node of this.queuedAudioNodes) {
-                node.stop();
-            }
-            this.queuedAudioNodes.clear();
-            Log.trace(this.logLevel, `[MediaPlayer] Pause - stopping render loop`);
-            this.stopRenderLoop();
-        }
+        this.playing = false;
+        this.cleanupAudioQueue();
+        this.stopRenderLoop();
     }
     dispose() {
-        Log.trace(this.logLevel, `[MediaPlayer] Disposing...`);
+        this.input?.dispose();
         this.stopRenderLoop();
-        // clean up video resources
         this.videoFrameIterator?.return();
-        this.videoFrameIterator = null;
-        this.nextFrame = null;
-        this.canvasSink = null;
-        // Clean up audio resources
-        for (const node of this.queuedAudioNodes) {
-            node.stop();
-        }
-        this.queuedAudioNodes.clear();
-        this.audioBufferIterator?.return();
-        this.audioBufferIterator = null;
-        this.audioSink = null;
-        this.gainNode = null;
-        this.initialized = false;
-        this.asyncId++;
-    }
-    get currentTime() {
-        return this.getPlaybackTime();
+        this.cleanAudioIteratorAndNodes();
+        this.videoAsyncId++;
     }
-    // current position in the media
     getPlaybackTime() {
-        if (!this.sharedAudioContext) {
-            return 0;
-        }
-        // Audio context is single source of truth
-        return this.sharedAudioContext.currentTime - this.mediaTimeOffset;
-    }
-    get duration() {
-        return this.totalDuration;
-    }
-    get isPlaying() {
-        return this.playing;
+        return this.sharedAudioContext.currentTime - this.audioSyncAnchor;
     }
-    get stalled() {
-        return this.isStalled;
+    scheduleAudioChunk(buffer, mediaTimestamp) {
+        const targetTime = mediaTimestamp + this.audioSyncAnchor;
+        const delay = targetTime - this.sharedAudioContext.currentTime;
+        const node = this.sharedAudioContext.createBufferSource();
+        node.buffer = buffer;
+        node.connect(this.gainNode);
+        if (delay >= 0) {
+            node.start(targetTime);
+        }
+        else {
+            node.start(this.sharedAudioContext.currentTime, -delay);
+        }
+        this.queuedAudioNodes.add(node);
+        node.onended = () => this.queuedAudioNodes.delete(node);
     }
-    onStalledChange(callback) {
-        this.onStalledChangeCallback = callback;
+    onBufferingChange(callback) {
+        this.onBufferingChangeCallback = callback;
     }
-    renderSingleFrame() {
-        const currentPlaybackTime = this.getPlaybackTime();
-        if (this.nextFrame && this.nextFrame.timestamp <= currentPlaybackTime) {
-            Log.trace(this.logLevel, `[MediaPlayer] Single frame update at ${this.nextFrame.timestamp.toFixed(3)}s`);
-            this.context.drawImage(this.nextFrame.canvas, 0, 0);
-            // For video-only content, track video progress as audio progress
-            if (!this.audioSink) {
-                this.resetAudioProgressStopwatch();
-            }
-            this.nextFrame = null;
-            this.updateNextFrame();
-        }
+    canRenderVideo() {
+        return (this.audioIteratorStarted &&
+            this.audioBufferHealth >= this.HEALTHY_BUFER_THRESHOLD_SECONDS);
     }
     startRenderLoop() {
         if (this.animationFrameId !== null) {
             return;
         }
-        Log.trace(this.logLevel, `[MediaPlayer] Starting render loop`);
         this.render();
     }
     stopRenderLoop() {
         if (this.animationFrameId !== null) {
             cancelAnimationFrame(this.animationFrameId);
             this.animationFrameId = null;
-            Log.trace(this.logLevel, `[MediaPlayer] Stopped render loop`);
         }
     }
-    // A/V sync coordination methods (WIP)
-    tryStartAudio() {
-        // Only start if: playing + audio exists + gate is open + not already started
-        if (this.playing &&
-            this.audioSink &&
-            this.canStartAudio &&
-            !this.audioBufferIterator) {
-            this.audioBufferIterator = this.audioSink.buffers(this.getPlaybackTime());
-            this.runAudioIterator();
-            this.resetAudioProgressStopwatch();
-            Log.trace(this.logLevel, '[MediaPlayer] Audio started - A/V sync established');
-        }
-    }
-    // Unified time reference for stall detection
-    getCurrentTimeMs() {
-        if (!this.sharedAudioContext) {
-            return performance.now();
-        }
-        return this.sharedAudioContext.currentTime * 1000;
+    shouldRenderFrame() {
+        return (!this.isBuffering &&
+            this.canRenderVideo() &&
+            this.nextFrame !== null &&
+            this.nextFrame.timestamp <= this.getPlaybackTime());
     }
-    // Stall detection methods
-    resetAudioProgressStopwatch() {
-        this.lastAudioProgressAtMs = this.getCurrentTimeMs();
-    }
-    getAudioLookaheadSec() {
-        if (!this.sharedAudioContext)
-            return 0;
-        return this.expectedAudioTime - this.sharedAudioContext.currentTime;
-    }
-    calculateAudioStallThresholdSec() {
-        return 0.2; // Need 200ms of audio scheduled ahead
+    drawCurrentFrame() {
+        this.context.drawImage(this.nextFrame.canvas, 0, 0);
+        this.nextFrame = null;
+        this.updateNextFrame();
     }
-    isNetworkStalled() {
-        const nowMs = this.getCurrentTimeMs();
-        const timeSinceNetworkMs = nowMs - this.lastNetworkActivityAtMs;
-        if (timeSinceNetworkMs > 100) {
-            this.isNetworkActive = false;
+    setBufferingState(isBuffering) {
+        if (this.isBuffering !== isBuffering) {
+            this.isBuffering = isBuffering;
+            if (isBuffering) {
+                this.bufferingStartedAtMs = performance.now();
+                this.onBufferingChangeCallback?.(true);
+            }
+            else {
+                this.bufferingStartedAtMs = null;
+                this.onBufferingChangeCallback?.(false);
+            }
         }
-        return !this.isNetworkActive && timeSinceNetworkMs >= 500;
     }
-    checkVideoStall() {
-        if (!this.actualFps)
-            return false;
-        const nowMs = this.getCurrentTimeMs();
-        const frameIntervalMs = 1000 / this.actualFps;
-        const STALL_FRAME_COUNT = 6;
-        const calculatedThresholdMs = frameIntervalMs * STALL_FRAME_COUNT;
-        const MIN_THRESHOLD_MS = 150;
-        const MAX_THRESHOLD_MS = 300;
-        const threshold = Math.min(Math.max(calculatedThresholdMs, MIN_THRESHOLD_MS), MAX_THRESHOLD_MS);
-        // Use a separate video progress tracker for video-only content
-        const timeSinceVideoProgressMs = nowMs - this.lastAudioProgressAtMs; // Reuse for now
-        return (!this.nextFrame &&
-            timeSinceVideoProgressMs > threshold &&
-            this.playing &&
-            this.currentTime < this.duration);
-    }
-    checkIfStalled() {
-        // Only check what matters for playback readiness
-        if (this.audioSink && this.playing) {
-            const audioLookaheadSec = this.getAudioLookaheadSec();
-            const isAudioStarved = audioLookaheadSec < this.calculateAudioStallThresholdSec();
-            return isAudioStarved && this.isNetworkStalled();
-        }
-        // Video-only fallback
-        if (!this.audioSink) {
-            return this.checkVideoStall() && this.isNetworkStalled();
+    maybeResumeFromBuffering(currentBufferDuration) {
+        if (!this.isCurrentlyBuffering())
+            return;
+        const now = performance.now();
+        const bufferingDuration = now - this.bufferingStartedAtMs;
+        const minTimeElapsed = bufferingDuration >= this.minBufferingTimeoutMs;
+        const bufferHealthy = currentBufferDuration >= this.HEALTHY_BUFER_THRESHOLD_SECONDS;
+        if (minTimeElapsed && bufferHealthy) {
+            Internals.Log.trace({ logLevel: this.logLevel, tag: '@remotion/media' }, `[MediaPlayer] Resuming from buffering after ${bufferingDuration}ms - buffer recovered`);
+            this.setBufferingState(false);
         }
-        return false; // Remove: return this.isSeeking;
     }
-    updateStalledState() {
-        const isStalled = this.checkIfStalled();
-        this.isStalled = isStalled;
-        this.onStalledChangeCallback?.(isStalled);
+    maybeForceResumeFromBuffering() {
+        if (!this.isCurrentlyBuffering())
+            return;
+        const now = performance.now();
+        const bufferingDuration = now - this.bufferingStartedAtMs;
+        const forceTimeout = bufferingDuration > this.minBufferingTimeoutMs * 10;
+        if (forceTimeout) {
+            Internals.Log.trace({ logLevel: this.logLevel, tag: '@remotion/media' }, `[MediaPlayer] Force resuming from buffering after ${bufferingDuration}ms`);
+            this.setBufferingState(false);
+        }
     }
 }

package/dist/video/new-video-for-preview.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { type LogLevel } from '../log';
+import type { LogLevel } from 'remotion';
 type NewVideoForPreviewProps = {
     readonly src: string;
     readonly style?: React.CSSProperties;