@remotion/renderer 3.0.30 → 3.1.1

package/dist/assets/download-and-map-assets-to-file.js

@@ -26,8 +26,11 @@ const waitForAssetToBeDownloaded = ({ src, downloadDir, }) => {
     }
     return new Promise((resolve) => {
         listeners[src][downloadDir].push(() => {
-            var _a;
-            resolve((_a = hasBeenDownloadedMap[src]) === null || _a === void 0 ? void 0 : _a[downloadDir]);
+            const srcMap = hasBeenDownloadedMap[src];
+            if (!srcMap || !srcMap[downloadDir]) {
+                throw new Error('Expected file for ' + src + 'to be available in ' + downloadDir);
+            }
+            resolve(srcMap[downloadDir]);
         });
     });
 };
@@ -38,7 +41,6 @@ const notifyAssetIsDownloaded = ({ src, downloadDir, to, }) => {
     if (!listeners[src][downloadDir]) {
         listeners[src][downloadDir] = [];
     }
-    listeners[src][downloadDir].forEach((fn) => fn());
     if (!isDownloadingMap[src]) {
         isDownloadingMap[src] = {};
     }
@@ -47,6 +49,7 @@ const notifyAssetIsDownloaded = ({ src, downloadDir, to, }) => {
         hasBeenDownloadedMap[src] = {};
     }
     hasBeenDownloadedMap[src][downloadDir] = to;
+    listeners[src][downloadDir].forEach((fn) => fn());
 };
 const validateMimeType = (mimeType, src) => {
     if (!mimeType.includes('/')) {

package/dist/browser/NetworkManager.js

@@ -141,11 +141,7 @@ _NetworkManager_client = new WeakMap(), _NetworkManager_frameManager = new WeakM
     if (!request) {
         return;
     }
-    const extraInfos = __classPrivateFieldGet(this, _NetworkManager_networkEventManager, "f").responseExtraInfo(responseReceived.requestId);
-    if (extraInfos.length) {
-        console.log(new Error('Unexpected extraInfo events for request ' +
-            responseReceived.requestId));
-    }
+    __classPrivateFieldGet(this, _NetworkManager_networkEventManager, "f").responseExtraInfo(responseReceived.requestId);
     const response = new HTTPResponse_1.HTTPResponse(responseReceived.response, extraInfo);
     request._response = response;
 }, _NetworkManager_onResponseReceived = function _NetworkManager_onResponseReceived(event) {

package/dist/codec-supports-media.d.ts

@@ -0,0 +1,7 @@
+import type { Codec } from 'remotion';
+declare type MediaSupport = {
+    video: boolean;
+    audio: boolean;
+};
+export declare const codecSupportsMedia: (codec: Codec) => MediaSupport;
+export {};

package/dist/codec-supports-media.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.codecSupportsMedia = void 0;
+const support = {
+    'h264-mkv': {
+        audio: true,
+        video: true,
+    },
+    aac: {
+        audio: true,
+        video: false,
+    },
+    gif: {
+        video: true,
+        audio: false,
+    },
+    h264: {
+        video: true,
+        audio: true,
+    },
+    h265: {
+        video: true,
+        audio: true,
+    },
+    mp3: {
+        audio: true,
+        video: false,
+    },
+    prores: {
+        audio: true,
+        video: true,
+    },
+    vp8: {
+        audio: true,
+        video: true,
+    },
+    vp9: {
+        audio: true,
+        video: true,
+    },
+    wav: {
+        audio: true,
+        video: false,
+    },
+};
+const codecSupportsMedia = (codec) => {
+    return support[codec];
+};
+exports.codecSupportsMedia = codecSupportsMedia;

package/dist/combine-videos.d.ts

@@ -1,5 +1,5 @@
 import type { Codec } from 'remotion';
-export declare const combineVideos: ({ files, filelistDir, output, onProgress, numberOfFrames, codec, fps, }: {
+export declare const combineVideos: ({ files, filelistDir, output, onProgress, numberOfFrames, codec, fps, numberOfGifLoops, }: {
     files: string[];
     filelistDir: string;
     output: string;
@@ -7,4 +7,5 @@ export declare const combineVideos: ({ files, filelistDir, output, onProgress, n
     numberOfFrames: number;
     codec: Codec;
     fps: number;
+    numberOfGifLoops: number | null;
 }) => Promise<void>;

package/dist/combine-videos.js

@@ -11,7 +11,7 @@ const path_1 = require("path");
 const remotion_1 = require("remotion");
 const get_audio_codec_name_1 = require("./get-audio-codec-name");
 const parse_ffmpeg_progress_1 = require("./parse-ffmpeg-progress");
-const combineVideos = async ({ files, filelistDir, output, onProgress, numberOfFrames, codec, fps, }) => {
+const combineVideos = async ({ files, filelistDir, output, onProgress, numberOfFrames, codec, fps, numberOfGifLoops, }) => {
     var _a;
     const fileList = files.map((p) => `file '${p}'`).join('\n');
     const fileListTxt = (0, path_1.join)(filelistDir, 'files.txt');
@@ -26,8 +26,14 @@ const combineVideos = async ({ files, filelistDir, output, onProgress, numberOfF
             '0',
             '-i',
             fileListTxt,
+            numberOfGifLoops === null ? null : '-loop',
+            numberOfGifLoops === null
+                ? null
+                : typeof numberOfGifLoops === 'number'
+                    ? String(numberOfGifLoops)
+                    : '-1',
             remotion_1.Internals.isAudioCodec(codec) ? null : '-c:v',
-            remotion_1.Internals.isAudioCodec(codec) ? null : 'copy',
+            remotion_1.Internals.isAudioCodec(codec) ? null : codec === 'gif' ? 'gif' : 'copy',
             '-c:a',
             (0, get_audio_codec_name_1.getAudioCodecName)(codec),
             // Set max bitrate up to 1024kbps, will choose lower if that's too much

package/dist/convert-number-of-gif-loops-to-ffmpeg.d.ts

@@ -0,0 +1 @@
+export declare const convertNumberOfGifLoopsToFfmpegSyntax: (loops: number | null) => string;

package/dist/convert-number-of-gif-loops-to-ffmpeg.js

@@ -0,0 +1,17 @@
+"use strict";
+// https://superuser.com/questions/1607099/how-to-control-gif-loop-settings-in-ffmpeg
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.convertNumberOfGifLoopsToFfmpegSyntax = void 0;
+const convertNumberOfGifLoopsToFfmpegSyntax = (loops) => {
+    // Infinite loop
+    if (loops === null) {
+        return '0';
+    }
+    // No loops
+    if (loops === 0) {
+        return '-1';
+    }
+    // N amount of loops
+    return String(loops);
+};
+exports.convertNumberOfGifLoopsToFfmpegSyntax = convertNumberOfGifLoopsToFfmpegSyntax;

package/dist/ensure-frames-in-order.d.ts

@@ -1,4 +1,4 @@
-export declare const ensureFramesInOrder: (frameRange: [number, number]) => {
+export declare const ensureFramesInOrder: (framesToRender: number[]) => {
     waitForRightTimeOfFrameToBeInserted: (frameToBe: number) => Promise<void>;
     setFrameToStitch: (f: number) => void;
     waitForFinish: () => Promise<void>;

package/dist/ensure-frames-in-order.js

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ensureFramesInOrder = void 0;
-const ensureFramesInOrder = (frameRange) => {
-    let [frameToStitch, finalFrame] = frameRange;
+const ensureFramesInOrder = (framesToRender) => {
+    let [frameToStitch] = framesToRender;
+    const finalFrame = framesToRender[framesToRender.length - 1];
     let waiters = [];
     const resolveWaiters = () => {
         for (const waiter of waiters.slice(0)) {

package/dist/ensure-presentation-timestamp.d.ts

@@ -1 +1 @@
-export declare const ensurePresentationTimestamps: (src: string) => Promise<void>;
+export declare const ensurePresentationTimestamps: (src: string) => Promise<string>;

package/dist/ensure-presentation-timestamp.js

@@ -5,7 +5,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ensurePresentationTimestamps = void 0;
 const execa_1 = __importDefault(require("execa"));
-const promises_1 = require("fs/promises");
 const path_1 = __importDefault(require("path"));
 const remotion_1 = require("remotion");
 const guess_extension_for_media_1 = require("./guess-extension-for-media");
@@ -28,18 +27,19 @@ const getTemporaryOutputName = async (src) => {
         .join(path_1.default.sep);
 };
 const ensurePresentationTimestamps = async (src) => {
-    if (ensureFileHasPresentationTimestamp[src] === 'encoding') {
+    const elem = ensureFileHasPresentationTimestamp[src];
+    if ((elem === null || elem === void 0 ? void 0 : elem.type) === 'encoding') {
         return new Promise((resolve) => {
             callbacks.push({
                 src,
-                fn: () => resolve(),
+                fn: (newSrc) => resolve(newSrc),
             });
         });
     }
-    if (ensureFileHasPresentationTimestamp[src] === 'done') {
-        return;
+    if ((elem === null || elem === void 0 ? void 0 : elem.type) === 'done') {
+        return elem.src;
     }
-    ensureFileHasPresentationTimestamp[src] = 'encoding';
+    ensureFileHasPresentationTimestamp[src] = { type: 'encoding' };
     // If there is no file extension for the video, then we need to tempoa
     const output = await getTemporaryOutputName(src);
     await (0, execa_1.default)('ffmpeg', [
@@ -54,15 +54,14 @@ const ensurePresentationTimestamps = async (src) => {
         output,
         '-y',
     ]);
-    await (0, promises_1.unlink)(src);
-    await (0, promises_1.rename)(output, src);
     callbacks = callbacks.filter((c) => {
         if (c.src === src) {
-            c.fn();
+            c.fn(output);
             return false;
         }
         return true;
     });
-    ensureFileHasPresentationTimestamp[src] = 'done';
+    ensureFileHasPresentationTimestamp[src] = { type: 'done', src: output };
+    return output;
 };
 exports.ensurePresentationTimestamps = ensurePresentationTimestamps;

package/dist/extract-frame-from-video.js

@@ -158,8 +158,10 @@ const getLastFrameOfVideo = async (options) => {
     return result;
 };
 exports.getLastFrameOfVideo = getLastFrameOfVideo;
-const extractFrameFromVideoFn = async ({ time, src, ffmpegExecutable, ffprobeExecutable, imageFormat, }) => {
-    await (0, ensure_presentation_timestamp_1.ensurePresentationTimestamps)(src);
+const extractFrameFromVideoFn = async ({ time, ffmpegExecutable, ffprobeExecutable, imageFormat, ...options }) => {
+    // We make a new copy of the video only for video because the conversion may affect
+    // audio rendering, so we work with 2 different files
+    const src = await (0, ensure_presentation_timestamp_1.ensurePresentationTimestamps)(options.src);
     const { specialVcodec, needsResize } = await (0, get_video_info_1.getVideoInfo)(src, ffprobeExecutable);
     if (specialVcodec === 'vp8') {
         return getFrameOfVideoSlow({

package/dist/get-codec-name.js

@@ -21,6 +21,9 @@ const getCodecName = (codec) => {
     if (codec === 'prores') {
         return 'prores_ks';
     }
+    if (codec === 'gif') {
+        return 'gif';
+    }
     throw new TypeError(`Cannot find FFMPEG codec for ${codec}`);
 };
 exports.getCodecName = getCodecName;

package/dist/get-duration-from-frame-range.d.ts

@@ -1,2 +1 @@
-import type { FrameRange } from 'remotion';
-export declare const getDurationFromFrameRange: (frameRange: FrameRange | null, durationInFrames: number) => number;
+export declare const getFramesToRender: (frameRange: [number, number], everyNthFrame: number) => number[];

package/dist/get-duration-from-frame-range.js

@@ -1,13 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getDurationFromFrameRange = void 0;
-const getDurationFromFrameRange = (frameRange, durationInFrames) => {
-    if (frameRange === null) {
-        return durationInFrames;
+exports.getFramesToRender = void 0;
+const getFramesToRender = (frameRange, everyNthFrame) => {
+    if (everyNthFrame === 0) {
+        throw new Error('everyNthFrame cannot be 0');
     }
-    if (typeof frameRange === 'number') {
-        return 1;
-    }
-    return frameRange[1] - frameRange[0] + 1;
+    return new Array(frameRange[1] - frameRange[0] + 1)
+        .fill(true)
+        .map((_, index) => {
+        return index + frameRange[0];
+    })
+        .filter((index) => {
+        return index % everyNthFrame === 0;
+    });
 };
-exports.getDurationFromFrameRange = getDurationFromFrameRange;
+exports.getFramesToRender = getFramesToRender;

package/dist/get-extension-from-codec.d.ts

@@ -1,2 +1,2 @@
 import type { Codec } from 'remotion';
-export declare const getFileExtensionFromCodec: (codec: Codec, type: 'chunk' | 'final') => "mp3" | "aac" | "wav" | "webm" | "mp4" | "mov" | "mkv";
+export declare const getFileExtensionFromCodec: (codec: Codec, type: 'chunk' | 'final') => "mp3" | "aac" | "wav" | "gif" | "webm" | "mp4" | "mov" | "mkv";

package/dist/get-extension-from-codec.js

@@ -23,6 +23,11 @@ const getFileExtensionFromCodec = (codec, type) => {
             return 'webm';
         case 'vp9':
             return 'webm';
+        case 'gif':
+            if (type === 'chunk') {
+                return 'mkv';
+            }
+            return 'gif';
         case 'wav':
             return 'wav';
         default:

package/dist/guess-extension-for-media.d.ts

@@ -1 +1 @@
-export declare const guessExtensionForVideo: (src: string) => Promise<"mp3" | "webm" | "wav" | "mp4">;
+export declare const guessExtensionForVideo: (src: string) => Promise<"mp3" | "wav" | "webm" | "mp4">;

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="node" />
 import execa from 'execa';
 import { SymbolicateableError } from './error-handling/symbolicateable-error';
 import { mimeContentType, mimeLookup } from './mime-types';
@@ -47,14 +48,14 @@ export declare const RenderInternals: {
         width: number;
         height: number;
         scale: number;
-        codec: "h264" | "h265" | "vp8" | "vp9" | "mp3" | "aac" | "wav" | "prores" | "h264-mkv";
+        codec: "h264" | "h265" | "vp8" | "vp9" | "mp3" | "aac" | "wav" | "prores" | "h264-mkv" | "gif";
     }) => void;
     normalizeServeUrl: (unnormalized: string) => string;
     spawnFfmpeg: (options: import("./stitch-frames-to-video").StitcherOptions) => Promise<{
         task: Promise<Buffer | null>;
         getLogs: () => string;
     }>;
-    getFileExtensionFromCodec: (codec: "h264" | "h265" | "vp8" | "vp9" | "mp3" | "aac" | "wav" | "prores" | "h264-mkv", type: "chunk" | "final") => "mp3" | "aac" | "wav" | "mp4" | "mkv" | "mov" | "webm";
+    getFileExtensionFromCodec: (codec: "h264" | "h265" | "vp8" | "vp9" | "mp3" | "aac" | "wav" | "prores" | "h264-mkv" | "gif", type: "chunk" | "final") => "mp3" | "aac" | "wav" | "gif" | "webm" | "mp4" | "mov" | "mkv";
     tmpDir: (str: string) => string;
     deleteDirectory: (directory: string) => Promise<void>;
     isServeUrl: (potentialUrl: string) => boolean;
@@ -78,7 +79,7 @@ export declare const RenderInternals: {
     parseStack: (stack: string[]) => import("./parse-browser-error-stack").UnsymbolicatedStackFrame[];
     symbolicateError: (symbolicateableError: SymbolicateableError) => Promise<import("./error-handling/handle-javascript-exception").ErrorWithStackFrame>;
     SymbolicateableError: typeof SymbolicateableError;
-    getDurationFromFrameRange: (frameRange: import("remotion").FrameRange | null, durationInFrames: number) => number;
+    getFramesToRender: (frameRange: [number, number], everyNthFrame: number) => number[];
     getExtensionOfFilename: (filename: string) => string | null;
     getDesiredPort: (desiredPort: number | undefined, from: number, to: number) => Promise<number>;
     isPathInside: (thePath: string, potentialParent: string) => boolean;
@@ -102,6 +103,7 @@ export declare const RenderInternals: {
     };
     registerErrorSymbolicationLock: () => number;
     unlockErrorSymbolicationLock: (id: number) => void;
+    canUseParallelEncoding: (codec: "h264" | "h265" | "vp8" | "vp9" | "mp3" | "aac" | "wav" | "prores" | "h264-mkv" | "gif") => boolean;
     mimeContentType: typeof mimeContentType;
     mimeLookup: typeof mimeLookup;
     validateConcurrency: (value: unknown, setting: string) => void;

package/dist/index.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.RenderInternals = exports.stitchFramesToVideo = exports.renderStill = exports.renderMedia = exports.renderFrames = exports.openBrowser = exports.makeCancelSignal = exports.getCompositions = exports.ErrorWithStackFrame = exports.combineVideos = void 0;
 const execa_1 = __importDefault(require("execa"));
 const download_file_1 = require("./assets/download-file");
+const can_use_parallel_encoding_1 = require("./can-use-parallel-encoding");
 const delete_directory_1 = require("./delete-directory");
 const ensure_output_directory_1 = require("./ensure-output-directory");
 const symbolicate_error_1 = require("./error-handling/symbolicate-error");
@@ -76,13 +77,14 @@ exports.RenderInternals = {
     parseStack: parse_browser_error_stack_1.parseStack,
     symbolicateError: symbolicate_error_1.symbolicateError,
     SymbolicateableError: symbolicateable_error_1.SymbolicateableError,
-    getDurationFromFrameRange: get_duration_from_frame_range_1.getDurationFromFrameRange,
+    getFramesToRender: get_duration_from_frame_range_1.getFramesToRender,
     getExtensionOfFilename: get_extension_of_filename_1.getExtensionOfFilename,
     getDesiredPort: get_port_1.getDesiredPort,
     isPathInside: is_path_inside_1.isPathInside,
     execa: execa_1.default,
     registerErrorSymbolicationLock: wait_for_symbolication_error_to_be_done_1.registerErrorSymbolicationLock,
     unlockErrorSymbolicationLock: wait_for_symbolication_error_to_be_done_1.unlockErrorSymbolicationLock,
+    canUseParallelEncoding: can_use_parallel_encoding_1.canUseParallelEncoding,
     mimeContentType: mime_types_1.mimeContentType,
     mimeLookup: mime_types_1.mimeLookup,
     validateConcurrency: validate_concurrency_1.validateConcurrency,

package/dist/mime-types.d.ts

@@ -1,2 +1,2 @@
 export declare function mimeLookup(path: string): string | false;
-export declare function mimeContentType(str: string): string | false;
+export declare function mimeContentType(str: string): false | string;

package/dist/mime-types.js

@@ -12,7 +12,7 @@ function mimeLookup(path) {
         return false;
     }
     // get the extension ("ext" or ".ext" or full path)
-    const ext = (0, path_1.extname)('x.' + path)
+    const ext = (0, path_1.extname)('.' + path)
         .toLowerCase()
         .substr(1);
     if (!ext) {
@@ -50,7 +50,7 @@ function populateMaps(exts, _types) {
                 }
             }
             // set the extension -> mime
-            _types[_ext] = type;
+            types[_ext] = type;
         }
     });
 }

package/dist/prespawn-ffmpeg.js

@@ -15,8 +15,8 @@ const prespawnFfmpeg = async (options) => {
     var _a, _b, _c, _d, _e, _f, _g;
     remotion_1.Internals.validateDimension(options.height, 'height', 'passed to `stitchFramesToVideo()`');
     remotion_1.Internals.validateDimension(options.width, 'width', 'passed to `stitchFramesToVideo()`');
-    remotion_1.Internals.validateFps(options.fps, 'passed to `stitchFramesToVideo()`');
     const codec = (_a = options.codec) !== null && _a !== void 0 ? _a : remotion_1.Internals.DEFAULT_CODEC;
+    remotion_1.Internals.validateFps(options.fps, 'in `stitchFramesToVideo()`', codec);
     (0, validate_even_dimensions_with_codec_1.validateEvenDimensionsWithCodec)({
         width: options.width,
         height: options.height,
@@ -45,7 +45,7 @@ const prespawnFfmpeg = async (options) => {
     remotion_1.Internals.validateSelectedCrfAndCodecCombination(crf, codec);
     remotion_1.Internals.validateSelectedPixelFormatAndCodecCombination(pixelFormat, codec);
     const ffmpegArgs = [
-        ['-r', String(options.fps)],
+        ['-r', options.fps.toFixed(2)],
         ...[
             ['-f', 'image2pipe'],
             ['-s', `${options.width}x${options.height}`],

package/dist/render-frames.d.ts

@@ -25,6 +25,7 @@ declare type RenderFramesOptions = {
     parallelism?: number | null;
     quality?: number;
     frameRange?: FrameRange | null;
+    everyNthFrame?: number;
     dumpBrowserLogs?: boolean;
     puppeteerInstance?: Browser;
     browserExecutable?: BrowserExecutable;

package/dist/render-frames.js

@@ -38,7 +38,7 @@ const getPool = async (pages) => {
     const pool = new pool_1.Pool(puppeteerPages);
     return pool;
 };
-const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, quality, imageFormat = image_format_1.DEFAULT_IMAGE_FORMAT, frameRange, puppeteerInstance, onError, envVariables, onBrowserLog, onFrameBuffer, onDownload, pagesArray, serveUrl, composition, timeoutInMilliseconds, scale, actualParallelism, downloadDir, proxyPort, cancelSignal, }) => {
+const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, quality, imageFormat = image_format_1.DEFAULT_IMAGE_FORMAT, frameRange, puppeteerInstance, onError, envVariables, onBrowserLog, onFrameBuffer, onDownload, pagesArray, serveUrl, composition, timeoutInMilliseconds, scale, actualParallelism, downloadDir, everyNthFrame = 1, proxyPort, cancelSignal, }) => {
     if (!puppeteerInstance) {
         throw new Error('no puppeteer instance passed to innerRenderFrames - internal error');
     }
@@ -51,7 +51,8 @@ const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, qual
     }
     const downloadPromises = [];
     const realFrameRange = (0, get_frame_to_render_1.getRealFrameRange)(composition.durationInFrames, frameRange !== null && frameRange !== void 0 ? frameRange : null);
-    const frameCount = (0, get_duration_from_frame_range_1.getDurationFromFrameRange)(realFrameRange, composition.durationInFrames);
+    const framesToRender = (0, get_duration_from_frame_range_1.getFramesToRender)(realFrameRange, everyNthFrame);
+    const lastFrame = framesToRender[framesToRender.length - 1];
     const pages = new Array(actualParallelism).fill(true).map(async () => {
         const page = await puppeteerInstance.newPage();
         pagesArray.push(page);
@@ -99,25 +100,20 @@ const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, qual
         page.off('console', logCallback);
         return page;
     });
-    const [firstFrameIndex, lastFrameIndex] = realFrameRange;
     // Substract one because 100 frames will be 00-99
     // --> 2 digits
-    const filePadLength = String(lastFrameIndex).length;
+    const filePadLength = String(lastFrame).length;
     let framesRendered = 0;
     const poolPromise = getPool(pages);
     onStart({
-        frameCount,
+        frameCount: framesToRender.length,
     });
-    const assets = new Array(frameCount).fill(undefined);
+    const assets = new Array(framesToRender.length).fill(undefined);
     let stopped = false;
     cancelSignal === null || cancelSignal === void 0 ? void 0 : cancelSignal(() => {
         stopped = true;
     });
-    const progress = Promise.all(new Array(frameCount)
-        .fill(Boolean)
-        .map((_x, i) => i)
-        .map(async (index) => {
-        const frame = realFrameRange[0] + index;
+    const progress = Promise.all(framesToRender.map(async (frame, index) => {
         const pool = await poolPromise;
         const freePage = await pool.acquire();
         if (stopped) {
@@ -176,13 +172,13 @@ const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, qual
         const compressedAssets = collectedAssets.map((asset) => remotion_1.Internals.AssetCompression.compressAsset(assets.filter(remotion_1.Internals.truthy).flat(1), asset));
         assets[index] = compressedAssets;
         compressedAssets.forEach((asset) => {
-            downloadPromises.push((0, download_and_map_assets_to_file_1.downloadAndMapAssetsToFileUrl)({
+            (0, download_and_map_assets_to_file_1.downloadAndMapAssetsToFileUrl)({
                 asset,
                 downloadDir,
                 onDownload,
             }).catch((err) => {
                 onError(new Error(`Error while downloading asset: ${err.stack}`));
-            }));
+            });
         });
         pool.release(freePage);
         framesRendered++;
@@ -196,10 +192,10 @@ const innerRenderFrames = ({ onFrameUpdate, outputDir, onStart, inputProps, qual
             assetsInfo: {
                 assets,
                 downloadDir,
-                firstFrameIndex,
                 imageSequenceName: `element-%0${filePadLength}d.${imageFormat}`,
+                firstFrameIndex: framesToRender[0],
             },
-            frameCount,
+            frameCount: framesToRender.length,
         };
         return returnValue;
     });
@@ -217,7 +213,7 @@ const renderFrames = (options) => {
     }
     remotion_1.Internals.validateDimension(composition.height, 'height', 'in the `config` object passed to `renderFrames()`');
     remotion_1.Internals.validateDimension(composition.width, 'width', 'in the `config` object passed to `renderFrames()`');
-    remotion_1.Internals.validateFps(composition.fps, 'in the `config` object of `renderFrames()`');
+    remotion_1.Internals.validateFps(composition.fps, 'in the `config` object of `renderFrames()`', null);
     remotion_1.Internals.validateDurationInFrames(composition.durationInFrames, 'in the `config` object passed to `renderFrames()`');
     if (options.quality !== undefined && options.imageFormat !== 'jpeg') {
         throw new Error("You can only pass the `quality` option if `imageFormat` is 'jpeg'.");

package/dist/render-media.d.ts

@@ -28,6 +28,8 @@ export declare type RenderMediaOptions = {
     envVariables?: Record<string, string>;
     quality?: number;
     frameRange?: FrameRange | null;
+    everyNthFrame?: number;
+    numberOfGifLoops?: number | null;
     puppeteerInstance?: PuppeteerBrowser;
     overwrite?: boolean;
     onProgress?: RenderMediaOnProgress;

package/dist/render-media.js

@@ -30,6 +30,7 @@ const validate_scale_1 = require("./validate-scale");
  * @link https://www.remotion.dev/docs/renderer/render-media
  */
 const renderMedia = ({ parallelism, proResProfile, crf, composition, imageFormat, ffmpegExecutable, ffprobeExecutable, inputProps, pixelFormat, codec, envVariables, quality, frameRange, puppeteerInstance, outputLocation, onProgress, overwrite, onDownload, dumpBrowserLogs, onBrowserLog, onStart, timeoutInMilliseconds, chromiumOptions, scale, browserExecutable, port, cancelSignal, ...options }) => {
+    var _a, _b;
     remotion_1.Internals.validateQuality(quality);
     if (typeof crf !== 'undefined' && crf !== null) {
         remotion_1.Internals.validateSelectedCrfAndCodecCombination(crf, codec);
@@ -38,6 +39,8 @@ const renderMedia = ({ parallelism, proResProfile, crf, composition, imageFormat
         (0, validate_output_filename_1.validateOutputFilename)(codec, (0, get_extension_of_filename_1.getExtensionOfFilename)(outputLocation));
     }
     (0, validate_scale_1.validateScale)(scale);
+    const everyNthFrame = (_a = options.everyNthFrame) !== null && _a !== void 0 ? _a : 1;
+    const numberOfGifLoops = (_b = options.numberOfGifLoops) !== null && _b !== void 0 ? _b : null;
     const serveUrl = (0, legacy_webpack_config_1.getServeUrlWithFallback)(options);
     let stitchStage = 'encoding';
     let stitcherFfmpeg;
@@ -80,12 +83,14 @@ const renderMedia = ({ parallelism, proResProfile, crf, composition, imageFormat
         cancelRenderFrames.cancel();
     });
     const { waitForRightTimeOfFrameToBeInserted, setFrameToStitch, waitForFinish } = (0, ensure_frames_in_order_1.ensureFramesInOrder)(realFrameRange);
+    const fps = composition.fps / (everyNthFrame !== null && everyNthFrame !== void 0 ? everyNthFrame : 1);
+    remotion_1.Internals.validateFps(fps, 'in "renderMedia()"', codec);
     const createPrestitcherIfNecessary = async () => {
         if (preEncodedFileLocation) {
             preStitcher = await (0, prespawn_ffmpeg_1.prespawnFfmpeg)({
                 width: composition.width * (scale !== null && scale !== void 0 ? scale : 1),
                 height: composition.height * (scale !== null && scale !== void 0 ? scale : 1),
-                fps: composition.fps,
+                fps,
                 outputLocation: preEncodedFileLocation,
                 pixelFormat,
                 codec,
@@ -137,6 +142,7 @@ const renderMedia = ({ parallelism, proResProfile, crf, composition, imageFormat
             quality,
             frameRange: frameRange !== null && frameRange !== void 0 ? frameRange : null,
             puppeteerInstance,
+            everyNthFrame,
             onFrameBuffer: parallelEncoding
                 ? async (buffer, frame) => {
                     var _a;
@@ -147,7 +153,7 @@ const renderMedia = ({ parallelism, proResProfile, crf, composition, imageFormat
                     const id = remotion_1.Internals.perf.startPerfMeasure('piping');
                     (_a = stitcherFfmpeg === null || stitcherFfmpeg === void 0 ? void 0 : stitcherFfmpeg.stdin) === null || _a === void 0 ? void 0 : _a.write(buffer);
                     remotion_1.Internals.perf.stopPerfMeasure(id);
-                    setFrameToStitch(frame + 1);
+                    setFrameToStitch(Math.min(realFrameRange[1] + 1, frame + everyNthFrame));
                 }
                 : undefined,
             serveUrl,
@@ -179,7 +185,7 @@ const renderMedia = ({ parallelism, proResProfile, crf, composition, imageFormat
             (0, stitch_frames_to_video_1.stitchFramesToVideo)({
                 width: composition.width * (scale !== null && scale !== void 0 ? scale : 1),
                 height: composition.height * (scale !== null && scale !== void 0 ? scale : 1),
-                fps: composition.fps,
+                fps,
                 outputLocation,
                 internalOptions: {
                     preEncodedFileLocation,
@@ -199,6 +205,7 @@ const renderMedia = ({ parallelism, proResProfile, crf, composition, imageFormat
                     callUpdate();
                 },
                 onDownload,
+                numberOfGifLoops,
                 verbose: remotion_1.Internals.Logging.isEqualOrBelowLogLevel(remotion_1.Internals.Logging.getLogLevel(), 'verbose'),
                 dir: outputDir !== null && outputDir !== void 0 ? outputDir : undefined,
                 cancelSignal: cancelStitcher.cancelSignal,
@@ -207,7 +214,7 @@ const renderMedia = ({ parallelism, proResProfile, crf, composition, imageFormat
         ]);
     })
         .then(([buffer, stitchStart]) => {
-        encodedFrames = (0, get_duration_from_frame_range_1.getDurationFromFrameRange)(frameRange !== null && frameRange !== void 0 ? frameRange : null, composition.durationInFrames);
+        encodedFrames = (0, get_duration_from_frame_range_1.getFramesToRender)(realFrameRange, everyNthFrame).length;
         encodedDoneIn = Date.now() - stitchStart;
         callUpdate();
         return buffer;

package/dist/render-still.js

@@ -45,7 +45,7 @@ const validate_scale_1 = require("./validate-scale");
 const innerRenderStill = async ({ composition, quality, imageFormat = 'png', serveUrl, puppeteerInstance, dumpBrowserLogs = false, onError, inputProps, envVariables, output, frame = 0, overwrite = true, browserExecutable, timeoutInMilliseconds, chromiumOptions, scale, proxyPort, cancelSignal, }) => {
     remotion_1.Internals.validateDimension(composition.height, 'height', 'in the `config` object passed to `renderStill()`');
     remotion_1.Internals.validateDimension(composition.width, 'width', 'in the `config` object passed to `renderStill()`');
-    remotion_1.Internals.validateFps(composition.fps, 'in the `config` object of `renderStill()`');
+    remotion_1.Internals.validateFps(composition.fps, 'in the `config` object of `renderStill()`', null);
     remotion_1.Internals.validateDurationInFrames(composition.durationInFrames, 'in the `config` object passed to `renderStill()`');
     remotion_1.Internals.validateNonNullImageFormat(imageFormat);
     remotion_1.Internals.validateFrame(frame, composition.durationInFrames);

package/dist/stitch-frames-to-video.d.ts

@@ -10,6 +10,7 @@ export declare type StitcherOptions = {
     force: boolean;
     assetsInfo: RenderAssetInfo;
     pixelFormat?: PixelFormat;
+    numberOfGifLoops?: number | null;
     codec?: Codec;
     crf?: number | null;
     onProgress?: (progress: number) => void;