getRemotionEnvironment()<AvailableFrom v="4.0.25" />

With the getRemotionEnvironment() function, you can retrieve information about the current Remotion Environment.

:::info Consider using the useRemotionEnvironment() hook instead, as it is future-proof for browser rendering scenarios. ::: It returns an object with the following properties:

• isStudio: Whether the function got called in the Remotion Studio.
• isRendering: Whether the function got called in a render. Also available in the calculateMetadata() function.
• isPlayer: Whether a <Player> is mounted on the current page.
• isReadOnlyStudio: Whether in a statically deployed studio, where the @remotion/studio APIs cannot be used (available from v4.0.238)
• isClientSideRendering: Whether the function got called in a client-side rendering context (available from v4.0.344)

This can be useful if you want components or functions to behave differently depending on the environment.

Example

import React from 'react';
import {getRemotionEnvironment} from 'remotion';

export const MyComp: React.FC = () => {
  const {isStudio, isPlayer, isRendering} = getRemotionEnvironment();

  if (isStudio) {
    return <div>I'm in the Studio!</div>;
  }

  if (isPlayer) {
    return <div>I'm in the Player!</div>;
  }

  if (isRendering) {
    return <div>I'm Rendering</div>;
  }

  return <div>Hello World!</div>;
};

A more realistic use case: You might want to debounce a request during editing in the Remotion Studio, but not during rendering. See: debouncing requests

Compatibility

See also

• Source code for this function
• useRemotionEnvironment() - a new preferred way to get the environment information
• useVideoConfig()
• <OffthreadVideo/> while rendering