remotion 4.0.15 → 4.0.17

package/dist/cjs/resolve-video-config.js

@@ -17,11 +17,15 @@ const resolveVideoConfig = ({ composition, editorProps: editorPropsOrUndefined,
             abortSignal: signal,
         })
         : null;
+    const fallbackProps = {
+        ...((_c = composition.defaultProps) !== null && _c !== void 0 ? _c : {}),
+        ...(inputProps !== null && inputProps !== void 0 ? inputProps : {}),
+    };
     if (calculatedProm !== null &&
         typeof calculatedProm === 'object' &&
         'then' in calculatedProm) {
         return calculatedProm.then((c) => {
-            var _a, _b, _c;
+            var _a, _b;
             const { height, width, durationInFrames, fps } = validateCalculated({
                 calculated: c,
                 composition,
@@ -33,7 +37,7 @@ const resolveVideoConfig = ({ composition, editorProps: editorPropsOrUndefined,
                 durationInFrames,
                 id: composition.id,
                 defaultProps: (_a = composition.defaultProps) !== null && _a !== void 0 ? _a : {},
-                props: (_c = (_b = c.props) !== null && _b !== void 0 ? _b : composition.defaultProps) !== null && _c !== void 0 ? _c : {},
+                props: (_b = c.props) !== null && _b !== void 0 ? _b : fallbackProps,
             };
         });
     }
@@ -45,11 +49,8 @@ const resolveVideoConfig = ({ composition, editorProps: editorPropsOrUndefined,
         return {
             ...data,
             id: composition.id,
-            defaultProps: (_c = composition.defaultProps) !== null && _c !== void 0 ? _c : {},
-            props: {
-                ...((_d = composition.defaultProps) !== null && _d !== void 0 ? _d : {}),
-                ...(inputProps !== null && inputProps !== void 0 ? inputProps : {}),
-            },
+            defaultProps: (_d = composition.defaultProps) !== null && _d !== void 0 ? _d : {},
+            props: fallbackProps,
         };
     }
     return {

package/dist/cjs/use-media-playback.js

@@ -32,8 +32,18 @@ const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybac
         if (!src) {
             throw new Error(`No 'src' attribute was passed to the ${tagName} element.`);
         }
-        mediaRef.current.playbackRate = Math.max(0, playbackRate);
-        const shouldBeTime = (0, get_current_time_js_1.getMediaTime)({
+        const playbackRateToSet = Math.max(0, playbackRate);
+        if (mediaRef.current.playbackRate !== playbackRateToSet) {
+            mediaRef.current.playbackRate = playbackRateToSet;
+        }
+        // Let's throttle the seeking to only every 10 frames when a video is playing to avoid bottlenecking
+        // the video tag.
+        if (playing) {
+            if (absoluteFrame % 10 !== 0) {
+                return;
+            }
+        }
+        const desiredUnclampedTime = (0, get_current_time_js_1.getMediaTime)({
             fps,
             frame,
             src,
@@ -41,15 +51,20 @@ const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybac
             startFrom: -mediaStartsAt,
             mediaType,
         });
+        const { duration } = mediaRef.current;
+        const shouldBeTime = !Number.isNaN(duration) && Number.isFinite(duration)
+            ? Math.min(duration, desiredUnclampedTime)
+            : desiredUnclampedTime;
         const isTime = mediaRef.current.currentTime;
         const timeShift = Math.abs(shouldBeTime - isTime);
-        if (timeShift > acceptableTimeshift && !mediaRef.current.ended) {
+        if (timeShift > acceptableTimeshift) {
             // If scrubbing around, adjust timing
-            // or if time shift is bigger than 0.2sec
+            // or if time shift is bigger than 0.45sec
             mediaRef.current.currentTime = shouldBeTime;
             if (!onlyWarnForMediaSeekingError) {
                 (0, warn_about_non_seekable_media_js_1.warnAboutNonSeekableMedia)(mediaRef.current, onlyWarnForMediaSeekingError ? 'console-warning' : 'console-error');
             }
+            return;
         }
         // Only perform a seek if the time is not already the same.
         // Chrome rounds to 6 digits, so 0.033333333 -> 0.033333,
@@ -57,15 +72,15 @@ const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybac
         // Refer to the https://github.com/remotion-dev/video-buffering-example
         // which is fixed by only seeking conditionally.
         const makesSenseToSeek = Math.abs(mediaRef.current.currentTime - shouldBeTime) > 0.00001;
+        if (!makesSenseToSeek) {
+            return;
+        }
         if (!playing || absoluteFrame === 0) {
-            if (makesSenseToSeek) {
-                mediaRef.current.currentTime = shouldBeTime;
-            }
+            mediaRef.current.currentTime = shouldBeTime;
+            return;
         }
         if (mediaRef.current.paused && !mediaRef.current.ended && playing) {
-            if (makesSenseToSeek) {
-                mediaRef.current.currentTime = shouldBeTime;
-            }
+            mediaRef.current.currentTime = shouldBeTime;
             (0, play_and_handle_not_allowed_error_js_1.playAndHandleNotAllowedError)(mediaRef, mediaType);
         }
     }, [

package/dist/cjs/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "4.0.15";
+export declare const VERSION = "4.0.17";

package/dist/cjs/version.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.VERSION = void 0;
 // Automatically generated on publish
-exports.VERSION = '4.0.15';
+exports.VERSION = '4.0.17';

package/dist/esm/index.mjs

@@ -59,7 +59,7 @@ function truthy(value) {
 }
 
 // Automatically generated on publish
-const VERSION = '4.0.15';
+const VERSION = '4.0.17';
 
 const checkMultipleRemotionVersions = () => {
     if (typeof globalThis === 'undefined') {
@@ -549,11 +549,15 @@ const resolveVideoConfig = ({ composition, editorProps: editorPropsOrUndefined,
             abortSignal: signal,
         })
         : null;
+    const fallbackProps = {
+        ...((_c = composition.defaultProps) !== null && _c !== void 0 ? _c : {}),
+        ...(inputProps !== null && inputProps !== void 0 ? inputProps : {}),
+    };
     if (calculatedProm !== null &&
         typeof calculatedProm === 'object' &&
         'then' in calculatedProm) {
         return calculatedProm.then((c) => {
-            var _a, _b, _c;
+            var _a, _b;
             const { height, width, durationInFrames, fps } = validateCalculated({
                 calculated: c,
                 composition,
@@ -565,7 +569,7 @@ const resolveVideoConfig = ({ composition, editorProps: editorPropsOrUndefined,
                 durationInFrames,
                 id: composition.id,
                 defaultProps: (_a = composition.defaultProps) !== null && _a !== void 0 ? _a : {},
-                props: (_c = (_b = c.props) !== null && _b !== void 0 ? _b : composition.defaultProps) !== null && _c !== void 0 ? _c : {},
+                props: (_b = c.props) !== null && _b !== void 0 ? _b : fallbackProps,
             };
         });
     }
@@ -577,11 +581,8 @@ const resolveVideoConfig = ({ composition, editorProps: editorPropsOrUndefined,
         return {
             ...data,
             id: composition.id,
-            defaultProps: (_c = composition.defaultProps) !== null && _c !== void 0 ? _c : {},
-            props: {
-                ...((_d = composition.defaultProps) !== null && _d !== void 0 ? _d : {}),
-                ...(inputProps !== null && inputProps !== void 0 ? inputProps : {}),
-            },
+            defaultProps: (_d = composition.defaultProps) !== null && _d !== void 0 ? _d : {},
+            props: fallbackProps,
         };
     }
     return {
@@ -1776,7 +1777,14 @@ const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybac
         if (mediaRef.current.playbackRate !== playbackRateToSet) {
             mediaRef.current.playbackRate = playbackRateToSet;
         }
-        const _shouldBeTime = getMediaTime({
+        // Let's throttle the seeking to only every 10 frames when a video is playing to avoid bottlenecking
+        // the video tag.
+        if (playing) {
+            if (absoluteFrame % 10 !== 0) {
+                return;
+            }
+        }
+        const desiredUnclampedTime = getMediaTime({
             fps,
             frame,
             src,
@@ -1786,18 +1794,18 @@ const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybac
         });
         const { duration } = mediaRef.current;
         const shouldBeTime = !Number.isNaN(duration) && Number.isFinite(duration)
-            ? Math.min(duration, _shouldBeTime)
-            : _shouldBeTime;
+            ? Math.min(duration, desiredUnclampedTime)
+            : desiredUnclampedTime;
         const isTime = mediaRef.current.currentTime;
         const timeShift = Math.abs(shouldBeTime - isTime);
         if (timeShift > acceptableTimeshift) {
             // If scrubbing around, adjust timing
             // or if time shift is bigger than 0.45sec
-            console.log('seekingA', timeShift, mediaRef.current.currentTime, shouldBeTime);
             mediaRef.current.currentTime = shouldBeTime;
             if (!onlyWarnForMediaSeekingError) {
                 warnAboutNonSeekableMedia(mediaRef.current, onlyWarnForMediaSeekingError ? 'console-warning' : 'console-error');
             }
+            return;
         }
         // Only perform a seek if the time is not already the same.
         // Chrome rounds to 6 digits, so 0.033333333 -> 0.033333,
@@ -1805,17 +1813,15 @@ const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybac
         // Refer to the https://github.com/remotion-dev/video-buffering-example
         // which is fixed by only seeking conditionally.
         const makesSenseToSeek = Math.abs(mediaRef.current.currentTime - shouldBeTime) > 0.00001;
+        if (!makesSenseToSeek) {
+            return;
+        }
         if (!playing || absoluteFrame === 0) {
-            if (makesSenseToSeek) {
-                console.log('seekingB');
-                mediaRef.current.currentTime = shouldBeTime;
-            }
+            mediaRef.current.currentTime = shouldBeTime;
+            return;
         }
         if (mediaRef.current.paused && !mediaRef.current.ended && playing) {
-            if (makesSenseToSeek) {
-                console.log('seekingC');
-                mediaRef.current.currentTime = shouldBeTime;
-            }
+            mediaRef.current.currentTime = shouldBeTime;
             playAndHandleNotAllowedError(mediaRef, mediaType);
         }
     }, [

package/dist/esm/version.mjs

@@ -1,4 +1,4 @@
 // Automatically generated on publish
-const VERSION = '4.0.15';
+const VERSION = '4.0.17';
 
 export { VERSION };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "remotion",
-  "version": "4.0.15",
+  "version": "4.0.17",
   "description": "Render videos in React",
   "main": "dist/cjs/index.js",
   "types": "dist/cjs/index.d.ts",