Skip to content

Instantly share code, notes, and snippets.

@JonnyBurger
Created March 28, 2025 10:08
Show Gist options
  • Save JonnyBurger/c6992fe8ec77183311e74227af7d55ac to your computer and use it in GitHub Desktop.
Save JonnyBurger/c6992fe8ec77183311e74227af7d55ac to your computer and use it in GitHub Desktop.
Remotion video rendering issues and potential rate limiting.

rohitt24k - 3/27/2025, 1:27:33 PM

Hey guys, i am trying to render a video using remotion on lyambda but i am facing some issue related to

errro ----------- An error occurred on chunk 0: Error A delayRender() "Loading

even though other network components like images and audios are properly loading this is the testing composition i am using

import { Video } from 'remotion';

const P0Composition: React.FC = () => { return (

); };

export default P0Composition;

is there anything that i am missing? please help πŸ™

rohitt24k - 3/27/2025, 2:48:12 PM

i was able to solve this using the OffthreadVideo Component and now it works file but i want to loop the video so i used the LoopedOffthreadVideo Component now the rendering stops after 80% or 90% is done.

rohitt24k - 3/27/2025, 3:26:31 PM

still getting the same error

An error occurred on chunk 10: Error A delayRender() was called but not cleared after 28000ms. See https://remotion.dev/docs/timeout for help.

at node_modules/remotion/dist/esm/index.mjs:1535 1533 β”‚ const handle = Math.random(); 1534 β”‚ handles.push(handle); 1535 β”‚ const called = Error().stack?.replace(/^Error/g, "") ?? ""; 1536 β”‚ if (getRemotionEnvironment().isRendering) { 1537 β”‚ const timeoutToUse = (options?.timeoutInMilliseconds ?? (typeof window === "undefined" ? defaultTimeout : window.remotion_puppeteerTimeout ?? defaultTimeout)) - 2000; 1538 β”‚ if (typeof window !== "undefined") {

at src/remotion/utils/LoopableOffthreadVideo.tsx:15 13 β”‚ const LoopedOffthreadVideo: React.FC = (props) => { 14 β”‚ const [duration, setDuration] = useState<number | null>(null); 15 β”‚ const [handle] = useState(() => delayRender()); 16 β”‚ const { fps } = useVideoConfig(); 17 β”‚

rohitt24k - 3/27/2025, 3:27:24 PM

if the video is long enough and doesn't need to loop then its fine but if the video is short and needs to loop i am facing the delayRender issue

jonnyburger - 3/28/2025, 9:24:43 AM

first step: make sure you have added this continueRender(), https://github.com/remotion-dev/remotion/blob/9c34f7475255344450c7a2c32da77cfd6204238c/packages/example/src/LoopedOffthreadVideo.tsx#L40 we have updated the snippet recently

if that still doesn't work, can you send the video that you want to loop? https://remotion.dev/report please also mention the remotion version

jonnyburger - 3/28/2025, 9:25:12 AM

ah I see you already posted it

jonnyburger - 3/28/2025, 9:27:05 AM

I think you run into pexels rate limiting πŸ™ƒ if you request the video a lot from the same IP, they are heavily throttling, we see it a lot on pexels videos

consider re-hosting that pexels video yourself

# Technical Note: Remotion Video Rendering Issues

## Problem
Users are experiencing errors related to video rendering using the `<Video />` and `LoopedOffthreadVideo` components in Remotion. The main error reported is:

An error occurred on chunk 0: Error A delayRender() "Loading


This issue arises particularly when the video is short and needs to loop, leading to rendering stopping after 80% or 90% completion. The problem may also be related to the network component and rate limiting by video hosting services such as Pexels.

## Causes
1. **Timeout in Delay Render**: The `delayRender()` function is not cleared within the expected time frame.
2. **Short Video Loops**: When attempting to loop shorter videos, issues with rendering completion may surface.
3. **Rate Limiting**: Repeated requests to the same video hosted on Pexels can trigger rate limiting from their servers.

## Steps to Fix

1. **Implement continueRender()**:
   Ensure that you call `continueRender()` after the video duration is loaded. Update your looping video component to follow the latest snippet provided [here](https://github.com/remotion-dev/remotion/blob/9c34f7475255344450c7a2c32da77cfd6204238c/packages/example/src/LoopedOffthreadVideo.tsx#L40).

   Example usage:
   ```javascript
   const LoopedOffthreadVideo: React.FC<RemotionOffthreadVideoProps> = (props) => {
       const [duration, setDuration] = useState<number | null>(null);
       const [handle] = useState(() => delayRender());
       const { fps } = useVideoConfig();
       
       // Ensure to call continueRender() with the handle
       // ...
   };
  1. Host the Video Yourself: If the video continues to present issues, consider re-hosting the video file on a personal server or cloud storage to avoid Pexels' rate limiting. This will help ensure smoother playback and loading.

  2. Test with Different Videos: If the problem persists, try using different video files or formats to rule out any specific issues with the video itself. It may also be beneficial to test the setup with videos that are known to have a longer duration or that do not need to loop.

  3. Provide Version Information: If further issues arise, please provide the video you want to loop and mention the version of Remotion you are using. This information will assist in troubleshooting.

Additional Notes

  • Monitor your requests to the video hosting service to prevent hitting their rate limits.
  • Keep your project dependencies updated to the latest versions to avoid compatibility issues.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment