---
title: The Recorder
description: Understanding how to use the Recorder to start, pause, resume and stop a Video Recording
---

import { Tab, Tabs } from 'fumadocs-ui/components/tabs'

The [`Recorder`](/api/react-native-vision-camera/hybrid-objects/Recorder) allows recording video and audio data to a file.

It is often created by a [`CameraVideoOutput`](/api/react-native-vision-camera/hybrid-objects/CameraVideoOutput). See ["The Video Output"](video-output) for more information.

```ts
const videoOutput = ...
const recorder = await videoOutput.createRecorder({
  // ...options
})
```

### Setting maximum duration or file-size

To automatically stop a recording when a certain duration or file-size has been reached, use [`maxDuration`](/api/react-native-vision-camera/interfaces/RecorderSettings#maxduration) or [`maxFileSize`](/api/react-native-vision-camera/interfaces/RecorderSettings#maxfilesize):

```ts
const videoOutput = ...
const recorder = await videoOutput.createRecorder({
  maxDuration: 5,        // 5 seconds
  maxFileSize: 10000000, // ~10 MB
})
```

When the duration or file size has been reached, the [`onRecordingFinished(...)`](/api/react-native-vision-camera/hybrid-objects/Recorder#startrecording) callback will be called with a [`reason`](/api/react-native-vision-camera/type-aliases/RecordingFinishedReason) - either [`'max-duration'`](/api/react-native-vision-camera/type-aliases/RecordingFinishedReason) or [`'max-file-size'`](/api/react-native-vision-camera/type-aliases/RecordingFinishedReason).

### Starting a Recording

To start a Video Recording, use [`Recorder.startRecording(...)`](/api/react-native-vision-camera/hybrid-objects/Recorder#startrecording), which takes callbacks for recording events:

```ts
const recorder = ...
await recorder.startRecording(
  (path, reason) => console.log(`Recording finished! ${reason}`),
  (error) => console.error(`Recording error!`, error),
  () => console.log(`Recording paused!`),
  () => console.log(`Recording resumed!`)
)
```

#### Inspecting Progress

As a recording progresses, you can inspect the [`Recorder`](/api/react-native-vision-camera/hybrid-objects/Recorder)'s [`recordedDuration`](/api/react-native-vision-camera/hybrid-objects/Recorder#recordedduration) and [`recordedFileSize`](/api/react-native-vision-camera/hybrid-objects/Recorder#recordedfilesize) properties:

```ts
const recorder = ...
const interval = setInterval(() => {
  console.log(`Recorded ${recorder.recordedFileSize} bytes`)
}, 500)
```

The [`Recorder`](/api/react-native-vision-camera/hybrid-objects/Recorder) also exposes metadata about its state - like [`isRecording`](/api/react-native-vision-camera/hybrid-objects/Recorder#isrecording), [`isPaused`](/api/react-native-vision-camera/hybrid-objects/Recorder#ispaused) and [`filePath`](/api/react-native-vision-camera/hybrid-objects/Recorder#filepath).

`filePath` and the value passed to `onRecordingFinished` are plain filesystem paths instead of `file://` URLs; if another library expects a URI, prepend `file://` at the call site.

### Pausing/Resuming

To pause/resume Video Recordings, use [`Recorder.pauseRecording()`](/api/react-native-vision-camera/hybrid-objects/Recorder#pauserecording)/[`Recorder.resumeRecording()`](/api/react-native-vision-camera/hybrid-objects/Recorder#resumerecording), which also fires the `onRecordingPaused`/`onRecordingResumed` callbacks previously passed to the [`Recorder.startRecording(...)`](/api/react-native-vision-camera/hybrid-objects/Recorder#startrecording) function:

```ts
await recorder.pauseRecording()
await recorder.resumeRecording()
```

### Stopping a Recording

To finish a Video Recording, use [`Recorder.stopRecording()`](/api/react-native-vision-camera/hybrid-objects/Recorder#stoprecording), which requests the [`CameraVideoOutput`](/api/react-native-vision-camera/hybrid-objects/CameraVideoOutput) to stop after all Frames have been successfully written.

```ts
await recorder.stopRecording()
```

This method resolves once the stop has been requested, but it may take a few Frames or sometimes even multiple seconds before the Video Recording will be finished - for example when using Video Stabilization, or when the device is throttled due to high thermal conditions.

Once the Video Recording has been finished, the `onRecordingFinished` callback passed to the [`Recorder.startRecording(...)`](/api/react-native-vision-camera/hybrid-objects/Recorder#startrecording) function will be called.

### Cancelling a Recording

To cancel a Video Recording instead of stopping it, use [`cancelRecording()`](/api/react-native-vision-camera/hybrid-objects/Recorder#cancelrecording), which deletes the file and cleans up state.

```ts
await recorder.cancelRecording()
```

### Interruptions

The [`Recorder`](/api/react-native-vision-camera/hybrid-objects/Recorder) gracefully handles interruptions such as incoming calls, minimizing the app, or pipeline stalls - in this case your [`CameraSession`](/api/react-native-vision-camera/hybrid-objects/CameraSession)'s [`onInterruptionStarted`](/api/react-native-vision-camera/hybrid-objects/CameraSession#addoninterruptionstartedlistener) listener will get called.
If the Recording has to be paused, the `onRecordingPaused` callback previously passed to the [`Recorder.startRecording(...)`](/api/react-native-vision-camera/hybrid-objects/Recorder#startrecording) function will be called.

For incoming calls, the Recording doesn't have to be paused - only the audio track will be disabled, while video may continue to record.

By default, the [`CameraVideoOutput`](/api/react-native-vision-camera/hybrid-objects/CameraVideoOutput) stops an active recording when its input [`CameraDevice`](/api/react-native-vision-camera/hybrid-objects/CameraDevice) changes (e.g. when flipping from the [`'front'`](/api/react-native-vision-camera/type-aliases/CameraPosition) to the [`'back'`](/api/react-native-vision-camera/type-aliases/CameraPosition) Camera) - to continue recording in this case, create [a Persistent Video Output](video-output#persistent-video-outputs) instead.

### Don't re-use a `Recorder`

A [`Recorder`](/api/react-native-vision-camera/hybrid-objects/Recorder) is single-use, meaning you need to create a new [`Recorder`](/api/react-native-vision-camera/hybrid-objects/Recorder) to record a new Video.
