diff --git a/src/components/nodes/EaseCurveNode.tsx b/src/components/nodes/EaseCurveNode.tsx
index 4fe82284..c27aa275 100644
--- a/src/components/nodes/EaseCurveNode.tsx
+++ b/src/components/nodes/EaseCurveNode.tsx
@@ -8,6 +8,7 @@ import { useCommentNavigation } from "@/hooks/useCommentNavigation";
 import { useWorkflowStore } from "@/store/workflowStore";
 import { EaseCurveNodeData } from "@/types";
 import { checkEncoderSupport } from "@/hooks/useStitchVideos";
+import { useVideoBlobUrl } from "@/hooks/useVideoBlobUrl";
 import { CubicBezierEditor } from "@/components/CubicBezierEditor";
 import {
   EASING_PRESETS,
@@ -46,6 +47,7 @@ export function EaseCurveNode({ id, data, selected }: NodeProps<EaseCurveNodeTyp
   const edges = useWorkflowStore((state) => state.edges);
   const removeEdge = useWorkflowStore((state) => state.removeEdge);
   const { setNodes } = useReactFlow();
+  const videoBlobUrl = useVideoBlobUrl(nodeData.outputVideo ?? null);
 
   const [activeTab, setActiveTab] = useState<"editor" | "video">("editor");
   const [showPresets, setShowPresets] = useState(false);
@@ -493,7 +495,7 @@ export function EaseCurveNode({ id, data, selected }: NodeProps<EaseCurveNodeTyp
             {nodeData.outputVideo ? (
               <div className="relative flex-1 min-h-0">
                 <video
-                  src={nodeData.outputVideo}
+                  src={videoBlobUrl ?? undefined}
                   controls
                   autoPlay
                   loop
diff --git a/src/components/nodes/GenerateVideoNode.tsx b/src/components/nodes/GenerateVideoNode.tsx
index 6eef7ac2..c9f8f2a5 100644
--- a/src/components/nodes/GenerateVideoNode.tsx
+++ b/src/components/nodes/GenerateVideoNode.tsx
@@ -13,6 +13,7 @@ import { ModelSearchDialog } from "@/components/modals/ModelSearchDialog";
 import { useToast } from "@/components/Toast";
 import { getVideoDimensions, calculateNodeSizePreservingHeight } from "@/utils/nodeDimensions";
 import { ProviderBadge } from "./ProviderBadge";
+import { useVideoBlobUrl } from "@/hooks/useVideoBlobUrl";
 
 // Video generation capabilities
 const VIDEO_CAPABILITIES: ModelCapability[] = ["text-to-video", "image-to-video"];
@@ -31,6 +32,7 @@ export function GenerateVideoNode({ id, data, selected }: NodeProps<GenerateVide
   const [modelsFetchError, setModelsFetchError] = useState<string | null>(null);
   const [isBrowseDialogOpen, setIsBrowseDialogOpen] = useState(false);
   const [isLoadingCarouselVideo, setIsLoadingCarouselVideo] = useState(false);
+  const videoBlobUrl = useVideoBlobUrl(nodeData.outputVideo ?? null);
 
   // Get the current selected provider (default to fal since Gemini doesn't do video)
   const currentProvider: ProviderType = nodeData.selectedModel?.provider || "fal";
@@ -559,7 +561,7 @@ export function GenerateVideoNode({ id, data, selected }: NodeProps<GenerateVide
           <div className="relative w-full flex-1 min-h-0">
             <video
               key={nodeData.videoHistory?.[nodeData.selectedVideoHistoryIndex || 0]?.id}
-              src={nodeData.outputVideo}
+              src={videoBlobUrl ?? undefined}
               controls
               autoPlay
               loop
diff --git a/src/components/nodes/OutputNode.tsx b/src/components/nodes/OutputNode.tsx
index 40b7d8f8..463bf13b 100644
--- a/src/components/nodes/OutputNode.tsx
+++ b/src/components/nodes/OutputNode.tsx
@@ -6,6 +6,7 @@ import { BaseNode } from "./BaseNode";
 import { useCommentNavigation } from "@/hooks/useCommentNavigation";
 import { useWorkflowStore } from "@/store/workflowStore";
 import { OutputNodeData } from "@/types";
+import { useVideoBlobUrl } from "@/hooks/useVideoBlobUrl";
 
 type OutputNodeType = Node<OutputNodeData, "output">;
 
@@ -40,6 +41,8 @@ export function OutputNode({ id, data, selected }: NodeProps<OutputNodeType>) {
     return nodeData.image;
   }, [nodeData.audio, nodeData.video, nodeData.image]);
 
+  const videoBlobUrl = useVideoBlobUrl(isVideo ? contentSrc ?? null : null);
+
   const handleDownload = useCallback(async () => {
     if (!contentSrc) return;
 
@@ -123,7 +126,7 @@ export function OutputNode({ id, data, selected }: NodeProps<OutputNodeType>) {
               >
                 {isVideo ? (
                   <video
-                    src={contentSrc}
+                    src={videoBlobUrl ?? undefined}
                     controls
                     loop
                     muted
@@ -180,7 +183,7 @@ export function OutputNode({ id, data, selected }: NodeProps<OutputNodeType>) {
           <div className="relative max-w-full max-h-full">
             {isVideo ? (
               <video
-                src={contentSrc}
+                src={videoBlobUrl ?? undefined}
                 controls
                 loop
                 autoPlay
diff --git a/src/components/nodes/VideoStitchNode.tsx b/src/components/nodes/VideoStitchNode.tsx
index b40618d3..accee880 100644
--- a/src/components/nodes/VideoStitchNode.tsx
+++ b/src/components/nodes/VideoStitchNode.tsx
@@ -7,6 +7,7 @@ import { useCommentNavigation } from "@/hooks/useCommentNavigation";
 import { useWorkflowStore } from "@/store/workflowStore";
 import { VideoStitchNodeData } from "@/types";
 import { checkEncoderSupport } from "@/hooks/useStitchVideos";
+import { useVideoBlobUrl } from "@/hooks/useVideoBlobUrl";
 
 type VideoStitchNodeType = Node<VideoStitchNodeData, "videoStitch">;
 
@@ -20,6 +21,7 @@ export function VideoStitchNode({ id, data, selected }: NodeProps<VideoStitchNod
   const regenerateNode = useWorkflowStore((state) => state.regenerateNode);
   const isRunning = useWorkflowStore((state) => state.isRunning);
   const removeEdge = useWorkflowStore((state) => state.removeEdge);
+  const videoBlobUrl = useVideoBlobUrl(nodeData.outputVideo ?? null);
 
   // Check encoder support on mount
   useEffect(() => {
@@ -549,7 +551,7 @@ export function VideoStitchNode({ id, data, selected }: NodeProps<VideoStitchNod
         {nodeData.outputVideo && nodeData.status !== "loading" && (
           <div className="relative flex-1 min-h-0">
             <video
-              src={nodeData.outputVideo}
+              src={videoBlobUrl ?? undefined}
               controls
               autoPlay
               loop
diff --git a/src/components/nodes/VideoTrimNode.tsx b/src/components/nodes/VideoTrimNode.tsx
index b53b6785..786cd033 100644
--- a/src/components/nodes/VideoTrimNode.tsx
+++ b/src/components/nodes/VideoTrimNode.tsx
@@ -7,6 +7,7 @@ import { useCommentNavigation } from "@/hooks/useCommentNavigation";
 import { useWorkflowStore } from "@/store/workflowStore";
 import { VideoTrimNodeData } from "@/types";
 import { checkEncoderSupport } from "@/hooks/useStitchVideos";
+import { useVideoBlobUrl } from "@/hooks/useVideoBlobUrl";
 
 type VideoTrimNodeType = Node<VideoTrimNodeData, "videoTrim">;
 
@@ -154,6 +155,7 @@ export function VideoTrimNode({ id, data, selected }: NodeProps<VideoTrimNodeTyp
 
   // Which video URL to show in preview
   const previewUrl = showOutput && nodeData.outputVideo ? nodeData.outputVideo : sourceVideoUrl;
+  const previewBlobUrl = useVideoBlobUrl(previewUrl);
 
   // Compute slider thumb position percentages for the visual range highlight
   const startPct = duration > 0 ? (startTime / duration) * 100 : 0;
@@ -285,7 +287,7 @@ export function VideoTrimNode({ id, data, selected }: NodeProps<VideoTrimNodeTyp
           {previewUrl ? (
             <video
               key={previewUrl}
-              src={previewUrl}
+              src={previewBlobUrl ?? undefined}
               controls
               playsInline
               muted
diff --git a/src/hooks/useVideoBlobUrl.ts b/src/hooks/useVideoBlobUrl.ts
new file mode 100644
index 00000000..7ca8de87
--- /dev/null
+++ b/src/hooks/useVideoBlobUrl.ts
@@ -0,0 +1,82 @@
+import { useEffect, useRef, useState } from "react";
+
+/**
+ * Converts data URL video sources to blob URLs for efficient playback.
+ *
+ * Data URLs force Chrome to re-parse base64 on each access. With autoPlay loop,
+ * this happens continuously and can freeze the main thread on weak GPUs.
+ * Blob URLs back the same data with an in-memory Blob that Chrome's media
+ * pipeline handles natively.
+ *
+ * - If input is null, returns null
+ * - If input is already a blob URL or HTTP URL, returns it as-is
+ * - If input is a data URL, immediately returns it as fallback, then swaps
+ *   to a blob URL once conversion completes (~50ms)
+ * - Revokes previous blob URLs on input change and unmount
+ */
+export function useVideoBlobUrl(videoUrl: string | null): string | null {
+  const [blobUrl, setBlobUrl] = useState<string | null>(null);
+  const prevBlobUrlRef = useRef<string | null>(null);
+  const prevInputRef = useRef<string | null>(null);
+
+  useEffect(() => {
+    // Input unchanged — skip
+    if (videoUrl === prevInputRef.current) return;
+    prevInputRef.current = videoUrl;
+
+    // Revoke previous blob URL
+    if (prevBlobUrlRef.current) {
+      URL.revokeObjectURL(prevBlobUrlRef.current);
+      prevBlobUrlRef.current = null;
+    }
+
+    // Null input
+    if (!videoUrl) {
+      setBlobUrl(null);
+      return;
+    }
+
+    // Already a blob URL or HTTP URL — pass through
+    if (videoUrl.startsWith("blob:") || videoUrl.startsWith("http")) {
+      setBlobUrl(videoUrl);
+      return;
+    }
+
+    // Data URL — return it immediately as fallback, then convert async
+    if (videoUrl.startsWith("data:")) {
+      setBlobUrl(videoUrl);
+
+      let cancelled = false;
+      fetch(videoUrl)
+        .then((r) => r.blob())
+        .then((blob) => {
+          if (cancelled) return;
+          const url = URL.createObjectURL(blob);
+          prevBlobUrlRef.current = url;
+          setBlobUrl(url);
+        })
+        .catch(() => {
+          // Conversion failed — keep using the data URL fallback
+        });
+
+      return () => {
+        cancelled = true;
+      };
+    }
+
+    // Unknown format — pass through
+    setBlobUrl(videoUrl);
+  }, [videoUrl]);
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      if (prevBlobUrlRef.current) {
+        URL.revokeObjectURL(prevBlobUrlRef.current);
+        prevBlobUrlRef.current = null;
+      }
+    };
+  }, []);
+
+  return blobUrl;
+}