@remotion/renderer 4.0.501 → 4.0.502

package/dist/render-frames.js

@@ -15,6 +15,7 @@ const can_use_parallel_encoding_1 = require("./can-use-parallel-encoding");
 const cycle_browser_tabs_1 = require("./cycle-browser-tabs");
 const default_on_log_1 = require("./default-on-log");
 const find_closest_package_json_1 = require("./find-closest-package-json");
+const frame_range_1 = require("./frame-range");
 const get_concurrency_1 = require("./get-concurrency");
 const get_duration_from_frame_range_1 = require("./get-duration-from-frame-range");
 const get_extra_frames_to_capture_1 = require("./get-extra-frames-to-capture");
@@ -33,9 +34,10 @@ const render_frame_and_retry_target_close_1 = require("./render-frame-and-retry-
 const replace_browser_1 = require("./replace-browser");
 const validate_1 = require("./validate");
 const validate_scale_1 = require("./validate-scale");
+const validate_selected_frames_1 = require("./validate-selected-frames");
 const wrap_with_error_handling_1 = require("./wrap-with-error-handling");
 const MAX_RETRIES_PER_FRAME = 1;
-const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, serializedInputPropsWithCustomSchema, serializedResolvedPropsWithCustomSchema, jpegQuality, imageFormat, frameRange, onError, envVariables, onBrowserLog, onFrameBuffer, onDownload, pagesArray, serveUrl, composition, timeoutInMilliseconds, scale, resolvedConcurrency, everyNthFrame, proxyPort, cancelSignal, downloadMap, muted, makeBrowser, browserReplacer, sourceMapGetter, logLevel, indent, parallelEncodingEnabled, compositionStart, forSeamlessAacConcatenation, onArtifact, binariesDirectory, imageSequencePattern, mediaCacheSizeInBytes, onLog, darkMode, sampleRate, }) => {
+const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, serializedInputPropsWithCustomSchema, serializedResolvedPropsWithCustomSchema, jpegQuality, imageFormat, frameRange, frames, outputFramesInSequence, onError, envVariables, onBrowserLog, onFrameBuffer, onDownload, pagesArray, serveUrl, composition, timeoutInMilliseconds, scale, resolvedConcurrency, everyNthFrame, proxyPort, cancelSignal, downloadMap, muted, makeBrowser, browserReplacer, sourceMapGetter, logLevel, indent, parallelEncodingEnabled, compositionStart, forSeamlessAacConcatenation, onArtifact, binariesDirectory, imageSequencePattern, mediaCacheSizeInBytes, onLog, darkMode, sampleRate, }) => {
     if (outputDir) {
         if (!node_fs_1.default.existsSync(outputDir)) {
             node_fs_1.default.mkdirSync(outputDir, {
@@ -44,15 +46,26 @@ const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, serialized
         }
     }
     const downloadPromises = [];
-    const realFrameRange = (0, get_frame_to_render_1.getRealFrameRange)(composition.durationInFrames, frameRange);
-    const { extraFramesToCaptureAssetsBackend, extraFramesToCaptureAssetsFrontend, chunkLengthInSeconds, trimLeftOffset, trimRightOffset, } = (0, get_extra_frames_to_capture_1.getExtraFramesToCapture)({
+    const framesToRender = frames
+        ? (0, validate_selected_frames_1.validateSelectedFrames)({
+            frames,
+            durationInFrames: composition.durationInFrames,
+        })
+        : (0, get_duration_from_frame_range_1.getFramesToRender)((0, get_frame_to_render_1.getRealFrameRanges)(composition.durationInFrames, frameRange), everyNthFrame);
+    const realFrameRange = [
+        framesToRender[0],
+        framesToRender[framesToRender.length - 1],
+    ];
+    const { extraFramesToCaptureAssetsBackend, extraFramesToCaptureAssetsFrontend, chunkLengthInSeconds: seamlessChunkLengthInSeconds, trimLeftOffset, trimRightOffset, } = (0, get_extra_frames_to_capture_1.getExtraFramesToCapture)({
         fps: composition.fps,
         compositionStart,
         realFrameRange,
         forSeamlessAacConcatenation,
         sampleRate,
     });
-    const framesToRender = (0, get_duration_from_frame_range_1.getFramesToRender)(realFrameRange, everyNthFrame);
+    const chunkLengthInSeconds = forSeamlessAacConcatenation
+        ? seamlessChunkLengthInSeconds
+        : framesToRender.length / composition.fps;
     const lastFrame = framesToRender[framesToRender.length - 1];
     const concurrencyOrFramesToRender = Math.min(framesToRender.length, resolvedConcurrency);
     const makeNewPage = (frame, pageIndex) => {
@@ -93,7 +106,11 @@ const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, serialized
     };
     // If rendering a GIF and skipping frames, we must ensure it starts from 0
     // and then is consecutive so FFMPEG recognizes the sequence
-    const countType = everyNthFrame === 1 ? 'actual-frames' : 'from-zero';
+    const countType = outputFramesInSequence
+        ? 'from-zero'
+        : everyNthFrame === 1
+            ? 'actual-frames'
+            : 'from-zero';
     const filePadLength = (0, get_frame_padded_index_1.getFilePadLength)({
         lastFrame,
         totalFrames: framesToRender.length,
@@ -198,7 +215,7 @@ const innerRenderFrames = async ({ onFrameUpdate, outputDir, onStart, serialized
         frameCount: framesToRender.length,
     };
 };
-const internalRenderFramesRaw = ({ browserExecutable, cancelSignal, chromiumOptions, composition, concurrency, envVariables, everyNthFrame, frameRange, imageFormat, indent, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, onFrameUpdate, onStart, outputDir, port, puppeteerInstance, scale, server, timeoutInMilliseconds, logLevel, webpackBundleOrServeUrl, serializedInputPropsWithCustomSchema, serializedResolvedPropsWithCustomSchema, offthreadVideoCacheSizeInBytes, parallelEncodingEnabled, binariesDirectory, forSeamlessAacConcatenation, compositionStart, onBrowserDownload, onArtifact, chromeMode, offthreadVideoThreads, imageSequencePattern, mediaCacheSizeInBytes, onLog, sampleRate, }) => {
+const internalRenderFramesRaw = ({ browserExecutable, cancelSignal, chromiumOptions, composition, concurrency, envVariables, everyNthFrame, frameRange, frames, outputFramesInSequence, imageFormat, indent, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, onFrameUpdate, onStart, outputDir, port, puppeteerInstance, scale, server, timeoutInMilliseconds, logLevel, webpackBundleOrServeUrl, serializedInputPropsWithCustomSchema, serializedResolvedPropsWithCustomSchema, offthreadVideoCacheSizeInBytes, parallelEncodingEnabled, binariesDirectory, forSeamlessAacConcatenation, compositionStart, onBrowserDownload, onArtifact, chromeMode, offthreadVideoThreads, imageSequencePattern, mediaCacheSizeInBytes, onLog, sampleRate, }) => {
     (0, validate_1.validateDimension)(composition.height, 'height', 'in the `config` object passed to `renderFrames()`');
     (0, validate_1.validateDimension)(composition.width, 'width', 'in the `config` object passed to `renderFrames()`');
     (0, validate_1.validateFps)(composition.fps, 'in the `config` object of `renderFrames()`', false);
@@ -280,6 +297,8 @@ const internalRenderFramesRaw = ({ browserExecutable, cancelSignal, chromiumOpti
                     envVariables,
                     everyNthFrame,
                     frameRange,
+                    frames,
+                    outputFramesInSequence,
                     imageFormat,
                     jpegQuality,
                     muted,
@@ -356,10 +375,22 @@ exports.internalRenderFrames = (0, wrap_with_error_handling_1.wrapWithErrorHandl
  */
 const renderFrames = (options) => {
     var _a;
-    const { composition, inputProps, onFrameUpdate, onStart, outputDir, serveUrl, browserExecutable, cancelSignal, chromiumOptions, concurrency, dumpBrowserLogs, envVariables, everyNthFrame, frameRange, imageFormat, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, port, puppeteerInstance, scale, timeoutInMilliseconds, verbose, quality, logLevel: passedLogLevel, offthreadVideoCacheSizeInBytes, binariesDirectory, onBrowserDownload, onArtifact, chromeMode, offthreadVideoThreads, imageSequencePattern, mediaCacheSizeInBytes, sampleRate, } = options;
+    const { composition, inputProps, onFrameUpdate, onStart, outputDir, serveUrl, browserExecutable, cancelSignal, chromiumOptions, concurrency, dumpBrowserLogs, envVariables, everyNthFrame, frameRange, frames, imageFormat, jpegQuality, muted, onBrowserLog, onDownload, onFrameBuffer, port, puppeteerInstance, scale, timeoutInMilliseconds, verbose, quality, logLevel: passedLogLevel, offthreadVideoCacheSizeInBytes, binariesDirectory, onBrowserDownload, onArtifact, chromeMode, offthreadVideoThreads, imageSequencePattern, mediaCacheSizeInBytes, sampleRate, } = options;
     if (!composition) {
         throw new Error('No `composition` option has been specified for renderFrames()');
     }
+    if (frames !== undefined && frameRange !== undefined && frameRange !== null) {
+        throw new Error('The `frames` and `frameRange` options are mutually exclusive.');
+    }
+    if (frames !== undefined && everyNthFrame !== undefined) {
+        throw new Error('The `frames` and `everyNthFrame` options are mutually exclusive.');
+    }
+    const validatedFrames = frames === undefined
+        ? null
+        : (0, validate_selected_frames_1.validateSelectedFrames)({
+            frames,
+            durationInFrames: composition.durationInFrames,
+        });
     if (typeof jpegQuality !== 'undefined' && imageFormat !== 'jpeg') {
         throw new Error("You can only pass the `quality` option if `imageFormat` is 'jpeg'.");
     }
@@ -377,6 +408,10 @@ const renderFrames = (options) => {
         envVariables: envVariables !== null && envVariables !== void 0 ? envVariables : {},
         everyNthFrame: everyNthFrame !== null && everyNthFrame !== void 0 ? everyNthFrame : 1,
         frameRange: frameRange !== null && frameRange !== void 0 ? frameRange : null,
+        frames: validatedFrames,
+        outputFramesInSequence: frameRange !== undefined &&
+            frameRange !== null &&
+            (0, frame_range_1.isMultipleFrameRanges)(frameRange),
         imageFormat: imageFormat !== null && imageFormat !== void 0 ? imageFormat : 'jpeg',
         indent,
         jpegQuality: jpegQuality !== null && jpegQuality !== void 0 ? jpegQuality : jpeg_quality_1.DEFAULT_JPEG_QUALITY,

package/dist/render-media.js

@@ -199,9 +199,11 @@ const internalRenderMediaRaw = ({ proResProfile, x264Preset, gopSize, crf, compo
         height: heightEvenDimensions,
         width: widthEvenDimensions,
     };
-    const realFrameRange = (0, get_frame_to_render_1.getRealFrameRange)(composition.durationInFrames, frameRange);
-    const totalFramesToRender = (0, get_duration_from_frame_range_1.getFramesToRender)(realFrameRange, everyNthFrame).length;
-    logger_1.Log.verbose({ indent, logLevel, tag: 'renderMedia()' }, `Rendering frames ${realFrameRange.join('-')}`);
+    const realFrameRanges = (0, get_frame_to_render_1.getRealFrameRanges)(composition.durationInFrames, frameRange);
+    const framesToRender = (0, get_duration_from_frame_range_1.getFramesToRender)(realFrameRanges, everyNthFrame);
+    const totalFramesToRender = framesToRender.length;
+    const lastFrameToRender = framesToRender[framesToRender.length - 1];
+    logger_1.Log.verbose({ indent, logLevel, tag: 'renderMedia()' }, `Rendering frames ${realFrameRanges.map((range) => range.join('-')).join(', ')}`);
     const callUpdate = () => {
         const encoded = Math.round(0.8 * encodedFrames + 0.2 * muxedFrames);
         onProgress === null || onProgress === void 0 ? void 0 : onProgress({
@@ -221,7 +223,7 @@ const internalRenderMediaRaw = ({ proResProfile, x264Preset, gopSize, crf, compo
     cancelSignal === null || cancelSignal === void 0 ? void 0 : cancelSignal(() => {
         cancelRenderFrames.cancel();
     });
-    const { waitForRightTimeOfFrameToBeInserted, setFrameToStitch, waitForFinish } = (0, ensure_frames_in_order_1.ensureFramesInOrder)(realFrameRange);
+    const { waitForRightTimeOfFrameToBeInserted, setFrameToStitch, waitForFinish } = (0, ensure_frames_in_order_1.ensureFramesInOrder)(framesToRender);
     const fps = composition.fps / everyNthFrame;
     (0, validate_1.validateFps)(fps, 'in "renderMedia()"', codec === 'gif');
     const createPrestitcherIfNecessary = () => {
@@ -352,11 +354,14 @@ const internalRenderMediaRaw = ({ proResProfile, x264Preset, gopSize, crf, compo
                 imageFormat,
                 jpegQuality,
                 frameRange,
+                frames: null,
+                outputFramesInSequence: true,
                 puppeteerInstance,
                 everyNthFrame,
                 onFrameBuffer: parallelEncoding
                     ? async (buffer, frame) => {
                         var _a;
+                        var _b;
                         await waitForRightTimeOfFrameToBeInserted(frame);
                         if (cancelled) {
                             return;
@@ -371,7 +376,8 @@ const internalRenderMediaRaw = ({ proResProfile, x264Preset, gopSize, crf, compo
                         }
                         (_a = stitcherFfmpeg === null || stitcherFfmpeg === void 0 ? void 0 : stitcherFfmpeg.stdin) === null || _a === void 0 ? void 0 : _a.write(buffer);
                         (0, perf_1.stopPerfMeasure)(id);
-                        setFrameToStitch(Math.min(realFrameRange[1] + 1, frame + everyNthFrame));
+                        const frameIndex = framesToRender.indexOf(frame);
+                        setFrameToStitch((_b = framesToRender[frameIndex + 1]) !== null && _b !== void 0 ? _b : lastFrameToRender + 1);
                     }
                     : null,
                 webpackBundleOrServeUrl: serveUrl,

package/dist/validate-selected-frames.d.ts

@@ -0,0 +1,4 @@
+export declare const validateSelectedFrames: ({ frames, durationInFrames, }: {
+    frames: unknown;
+    durationInFrames: number | null;
+}) => number[];

package/dist/validate-selected-frames.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateSelectedFrames = void 0;
+const validateSelectedFrames = ({ frames, durationInFrames, }) => {
+    if (!Array.isArray(frames)) {
+        throw new TypeError('The `frames` option must be an array of frame numbers.');
+    }
+    if (frames.length === 0) {
+        throw new TypeError('The `frames` option must contain at least one frame.');
+    }
+    for (const frame of frames) {
+        if (typeof frame !== 'number') {
+            throw new TypeError(`The \`frames\` option must contain only numbers, but got ${typeof frame}.`);
+        }
+        if (!Number.isFinite(frame)) {
+            throw new TypeError(`The \`frames\` option must contain only finite numbers, but got ${frame}.`);
+        }
+        if (!Number.isInteger(frame)) {
+            throw new TypeError(`The \`frames\` option must contain only integers, but got ${frame}.`);
+        }
+        if (frame < 0) {
+            throw new TypeError(`The \`frames\` option must contain only non-negative numbers, but got ${frame}.`);
+        }
+        if (durationInFrames !== null && frame >= durationInFrames) {
+            throw new RangeError(`Frame ${frame} is out of range, must be between 0 and ${durationInFrames - 1}.`);
+        }
+    }
+    const uniqueFrames = new Set(frames);
+    if (uniqueFrames.size !== frames.length) {
+        throw new TypeError('The `frames` option must not contain duplicate frames.');
+    }
+    return [...frames].sort((a, b) => a - b);
+};
+exports.validateSelectedFrames = validateSelectedFrames;

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/renderer"
 	},
 	"name": "@remotion/renderer",
-	"version": "4.0.501",
+	"version": "4.0.502",
 	"description": "Render Remotion videos using Node.js or Bun",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",
@@ -22,11 +22,11 @@
 	},
 	"dependencies": {
 		"execa": "5.1.1",
-		"remotion": "4.0.501",
-		"@remotion/streaming": "4.0.501",
+		"remotion": "4.0.502",
+		"@remotion/streaming": "4.0.502",
 		"source-map": "0.8.0",
 		"ws": "8.21.0",
-		"@remotion/licensing": "4.0.501"
+		"@remotion/licensing": "4.0.502"
 	},
 	"peerDependencies": {
 		"react": ">=16.8.0",
@@ -40,19 +40,19 @@
 		"react-dom": "19.2.3",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1",
 		"@types/ws": "8.5.10",
-		"@remotion/example-videos": "4.0.501",
-		"@remotion/eslint-config-internal": "4.0.501",
+		"@remotion/example-videos": "4.0.502",
+		"@remotion/eslint-config-internal": "4.0.502",
 		"eslint": "9.19.0",
 		"@types/node": "20.12.14"
 	},
 	"optionalDependencies": {
-		"@remotion/compositor-darwin-arm64": "4.0.501",
-		"@remotion/compositor-darwin-x64": "4.0.501",
-		"@remotion/compositor-linux-arm64-gnu": "4.0.501",
-		"@remotion/compositor-linux-arm64-musl": "4.0.501",
-		"@remotion/compositor-linux-x64-gnu": "4.0.501",
-		"@remotion/compositor-linux-x64-musl": "4.0.501",
-		"@remotion/compositor-win32-x64-msvc": "4.0.501"
+		"@remotion/compositor-darwin-arm64": "4.0.502",
+		"@remotion/compositor-darwin-x64": "4.0.502",
+		"@remotion/compositor-linux-arm64-gnu": "4.0.502",
+		"@remotion/compositor-linux-arm64-musl": "4.0.502",
+		"@remotion/compositor-linux-x64-gnu": "4.0.502",
+		"@remotion/compositor-linux-x64-musl": "4.0.502",
+		"@remotion/compositor-win32-x64-msvc": "4.0.502"
 	},
 	"keywords": [
 		"remotion",