explaingit

mrousavy/react-native-vision-camera

9,392TypeScriptAudience · developerComplexity · 3/5Setup · moderate

TLDR

VisionCamera is a React Native camera library for iOS and Android that supports 4K/8K capture, 240 FPS video, barcode scanning, HDR, and real-time per-frame AI processing via JavaScript Frame Processors.

Mindmap

mindmap
  root((VisionCamera))
    What it does
      Camera library
      iOS and Android
      React Native
    Features
      Photo and video capture
      4K and 8K support
      Up to 240 FPS
      QR and barcode scan
      HDR and night mode
    Frame Processors
      Per-frame JavaScript
      AI object detection
      Facial recognition
    Tech
      C++ and GPU accelerated
      Metal on iOS
      Vulkan on Android
    Audience
      Mobile developers
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Add full-featured photo and video capture to a React Native mobile app with support for 4K resolution and HDR.

USE CASE 2

Build a real-time QR code or barcode scanner in a React Native app using the built-in scanning support.

USE CASE 3

Run a custom AI model on live camera frames in JavaScript using Frame Processors for facial recognition or object detection.

USE CASE 4

Record high-frame-rate video up to 240 FPS in a mobile app backed by GPU-accelerated image processing.

Tech stack

TypeScriptReact NativeC++SwiftKotlinMetalVulkan

Getting it running

Difficulty · moderate Time to first run · 30min

Requires pod install in the iOS directory to link native C++ dependencies after npm install.

In plain English

VisionCamera is a camera library for React Native, which is a framework for building mobile apps using JavaScript. It provides access to the device camera on both iOS and Android, exposing a wide range of features that the built-in React Native camera support does not cover. The library is built and maintained by Margelo, a mobile app development studio. The feature list covers photo and video capture, QR code and barcode scanning, adjustable resolution up to 4K and 8K images, frame rates between 30 and 240 FPS, HDR and night modes, and smooth zooming powered by a separate animation library called Reanimated. One of the more advanced features is Frame Processors, which lets developers write custom JavaScript functions that run on each camera frame in real time. The README lists facial recognition, AI object detection, and real-time video chat as example uses for this capability. Installation follows the standard React Native package pattern: install from npm, then run pod install in the iOS directory to link the native dependencies. The library includes a C++ and GPU-accelerated image resizer on both Metal for iOS and Vulkan for Android, which is what allows it to handle high-resolution and high-frame-rate work without dropping performance. The current version is V5. The previous V4 release has been archived in a separate repository and its documentation moved to a separate URL. A real-world app called ShadowLens, available on both the App Store and Google Play, was built using VisionCamera and serves as a public demonstration of what the library can do. Full documentation is at visioncamera.margelo.com.

Copy-paste prompts

Prompt 1
Set up VisionCamera V5 in a React Native app: walk me through the npm install, pod install, and the minimum code to show a live camera preview on iOS.
Prompt 2
I want to build a QR code scanner with VisionCamera in React Native. Show me a complete component that scans codes and displays the result on screen.
Prompt 3
Write a Frame Processor in VisionCamera that sends each camera frame to a TensorFlow Lite model for real-time object detection and draws bounding boxes on the preview.
Prompt 4
How do I record a 60 FPS video with VisionCamera, save it to the device gallery, and show a thumbnail after recording stops?
Prompt 5
Compare VisionCamera's Frame Processor approach to running ML inference on mobile versus sending frames to a cloud API, when does each approach make sense for a React Native app?
Open on GitHub → Explain another repo

← mrousavy on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.