fix(video): resolve playback freeze caused by aggressive re-seek

domains/video/components/preview/previewCanvasRenderer.ts

@@ -3,7 +3,7 @@
 import { MutableRefObject, RefObject } from "react";
 import { applyPixelPreviewScalePolicy, drawScaledImage, resizeCanvasForDpr } from "@/shared/utils";
 import { getCanvasColorsSync } from "@/shared/hooks";
-import { PLAYBACK } from "../../constants";
+
 import { Clip, VideoClip, VideoProject, VideoTrack, getClipPlaybackSpeed, getClipScaleX, getClipScaleY, getSourceTime } from "../../types";
 import { resolveClipPositionAtTimelineTime } from "../../utils/clipTransformKeyframes";
 import { drawCropOverlay, drawMaskRegionOverlay, drawTransformBoundsOverlay } from "./previewCanvasOverlayDrawing";
@@ -272,13 +272,13 @@ export function renderPreviewCanvasFrame(params: PreviewCanvasRenderParams) {
           continue;
         }
         const sourceTime = getSourceTime(clip, renderTime);
-        if (params.playback.isPlaying && Math.abs(videoElement.currentTime - sourceTime) > PLAYBACK.SEEK_DRIFT_THRESHOLD * 1.25) {
-          baseFrameReady = false;
-          continue;
-        }
         if (!params.playback.isPlaying && Math.abs(videoElement.currentTime - sourceTime) > 0.05) {
           videoElement.currentTime = sourceTime;
         }
+        // During playback, always draw whatever frame the video element has.
+        // The video is playing at the correct playbackRate, so the current
+        // frame is the best available — skipping it causes frozen display
+        // (the "1 FPS" symptom). Only mark not-ready when truly no data.
         sourceEl = videoElement;
       } else if (clip.type === "image") {
         let img = params.imageCacheRef.current.get(clip.sourceUrl);

domains/video/components/preview/usePreviewMediaPlaybackSync.ts

@@ -153,10 +153,14 @@ export function usePreviewMediaPlaybackSync(options: UsePreviewMediaPlaybackSync
         }
 
         const sourceTime = getSourceTime(clip, ct);
+        // During playback, use relaxed threshold to avoid re-seek storms that
+        // stall the decoder and cause frozen frames. The video element is
+        // already playing at the correct playbackRate — let it catch up
+        // naturally instead of constantly interrupting with seeks.
         const videoSeekThreshold =
           desiredState.isAudible && !isWebAudioReadyRef.current(clip.sourceUrl)
-            ? Math.max(PLAYBACK.SEEK_DRIFT_THRESHOLD, 0.45)
-            : PLAYBACK.SEEK_DRIFT_THRESHOLD;
+            ? Math.max(PLAYBACK.PLAYBACK_SEEK_DRIFT_THRESHOLD, 0.8)
+            : PLAYBACK.PLAYBACK_SEEK_DRIFT_THRESHOLD;
         if (
           Number.isFinite(sourceTime) &&
           hasFiniteMediaDuration(video) &&

domains/video/constants/videoConstants.ts

@@ -53,7 +53,11 @@ export const PLAYBACK = {
   DEFAULT_RATE: 1,
   FRAME_STEP: 1 / 30, // 30fps
   SYNC_INTERVAL_MS: 50, // media sync interval during playback
-  SEEK_DRIFT_THRESHOLD: 0.15, // seconds: visual media re-seek threshold
+  SEEK_DRIFT_THRESHOLD: 0.15, // seconds: visual media re-seek threshold (scrub/pause)
+  /** Relaxed drift threshold during active playback — avoids re-seek storms that
+   *  stall the decoder. The video element plays at the correct playbackRate,
+   *  so small drift is acceptable for smooth preview. */
+  PLAYBACK_SEEK_DRIFT_THRESHOLD: 0.8, // seconds: re-seek only when very far behind
   AUDIO_SEEK_DRIFT_THRESHOLD: 0.35, // seconds: fallback HTMLAudio seek threshold
   TIME_DISPLAY_THROTTLE_MS: 100, // throttle for time display updates
 } as const;