<!-- mobian-agent-page publisher="dailydev" canonical="https://daily.dev/posts/building-a-real-time-face-recognition-app-in-react-native-with-visioncamera-wp5k5kzg1" -->

---
title: Building a Real-Time Face Recognition App in React...
description: A deep technical walkthrough of building an on-device, real-time face recognition pipeline in React Native using react-native-vision-camera v5. It covers the...
canonical: https://daily.dev/posts/building-a-real-time-face-recognition-app-in-react-native-with-visioncamera-wp5k5kzg1
twitter:card: summary_large_image
twitter:site: @dailydotdev
og:type: website
og:site_name: daily.dev
og:title: Building a Real-Time Face Recognition App in React Native with VisionCamera | daily.dev
og:description: A deep technical walkthrough of building an on-device, real-time face recognition pipeline in React Native using react-native-vision-camera v5. It covers the...
og:url: https://daily.dev/posts/building-a-real-time-face-recognition-app-in-react-native-with-visioncamera-wp5k5kzg1
og:image: https://api.daily.dev/og/posts/wp5k5KZG1.png
og:image:alt: Building a Real-Time Face Recognition App in React Native with VisionCamera
og:image:width: 1200
og:image:height: 630
og:locale: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Building a Real-Time Face Recognition App in React Native with VisionCamera

**[Nitro Modules](https://daily.dev/sources/margelo)** · 24 min read · 0 upvotes · 0 comments

## Summary

A deep technical walkthrough of building an on-device, real-time face recognition pipeline in React Native using react-native-vision-camera v5. It covers the full relay of stages: capturing camera frames efficiently, face detection (comparing YuNet, BlazeFace, SCRFD, RetinaFace), landmark-based alignment, passive liveness detection against spoofing, embedding generation with model comparisons (SFace, ArcFace variants) including licensing pitfalls, multi-sample enrollment and centroid matching, frame-to-UI threading via Reanimated shared values, and detection/tracking scheduling to sustain 30fps. Includes real benchmark numbers from a Galaxy S21 Ultra, a 5,000-person gallery accuracy test, and hard-won production lessons like mirrored-frame alignment bugs, thermal throttling, and native memory pressure.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://margelo.com/blog/on-device-face-recognition-react-native>

## Questions this post answers

### Which face detection model should I use for real-time face recognition on mobile with React Native?

YuNet is the recommended default for mobile face detection: it is about 230 KB, runs in 3 to 6 ms per frame at 128 input resolution on a Galaxy S21 Ultra class CPU, provides 5 landmarks that map directly onto the ArcFace alignment template, and carries an MIT license. Alternatives like SCRFD and RetinaFace offer higher accuracy for crowded scenes but their pretrained weights are research-only, blocking commercial use.

_daily.dev surfaces engineering writeups like this for teams weighing computer vision model trade-offs._

### Why does mirrored front camera input break face recognition accuracy?

Front-camera buffers can arrive mirrored, and aligning a mirrored face against a non-mirrored canonical template distorts every face the same systematic way, compressing the embedding space so different people start matching each other, producing false accepts. The fix is using a flipped alignment template for mirrored frames, applied during the landmark-based warp to the 112x112 canonical crop.

_track subtle production bugs like this on daily.dev before they surface as failed face-recognition matches._

### Which face embedding model is best for commercial on-device face recognition apps?

SFace is the recommended shipping default because it carries an Apache-2.0 license, unlike ArcFace MobileFaceNet or ArcFace ResNet-50 whose InsightFace pretrained weights are restricted to non-commercial research. SFace is 37MB (19MB quantized to int8), achieves about 99.6% on LFW, and runs in roughly 29ms per face on a Galaxy S21 Ultra class CPU using ONNX Runtime with XNNPACK.

_compare model licensing and performance trade-offs like these before shipping, tracked with daily.dev._

## Similar posts on daily.dev

- [ReactVision Studio: Build AR/VR Apps in React Native \+ ship directly to devices](https://daily.dev/posts/reactvision-studio-build-ar-vr-apps-in-react-native-ship-directly-to-devices-aroo68ejz) · Product Hunt · 0 upvotes · 0 comments
- [How I Built a Secure, On-Device Face Attendance App with Flutter, ML Kit, and TensorFlow Lite](https://daily.dev/posts/how-i-built-a-secure-on-device-face-attendance-app-with-flutter-ml-kit-and-tensorflow-lite-wejskpxvs) · Medium · 0 upvotes · 0 comments
- [Building a Real-Time 3D Face Mask with MediaPipe, Threlte and Three.js](https://daily.dev/posts/building-a-real-time-3d-face-mask-with-mediapipe-threlte-and-three-js-pk2vu7lh9) · Codrops · 1 upvotes · 0 comments
- [Implementing image recognition with React and continuous deployment](https://daily.dev/posts/implementing-image-recognition-with-react-and-continuous-deployment-ejrb5olgu) · CircleCI · 0 upvotes · 0 comments

---

Tags: [#react-native](https://daily.dev/tags/react-native), [#computer-vision](https://daily.dev/tags/computer-vision), [#local-ai](https://daily.dev/tags/local-ai)

[View this post on daily.dev](https://daily.dev/posts/building-a-real-time-face-recognition-app-in-react-native-with-visioncamera-wp5k5kzg1)

```json
{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]}
{"@context":"https://schema.org","@type":"TechArticle","headline":"Building a Real-Time Face Recognition App in React Native with VisionCamera","url":"https://daily.dev/posts/building-a-real-time-face-recognition-app-in-react-native-with-visioncamera-wp5k5kzg1","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/building-a-real-time-face-recognition-app-in-react-native-with-visioncamera-wp5k5kzg1"},"datePublished":"2026-08-23T12:23:31.047Z","dateModified":"2026-08-23T12:56:25.537Z","description":"A deep technical walkthrough of building an on-device, real-time face recognition pipeline in React Native using react-native-vision-camera v5. It covers the...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/e70e88a60beeff6a178f42a93d0dff9e?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/e70e88a60beeff6a178f42a93d0dff9e?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"Nitro Modules","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Nitro Modules","logo":"https://media.daily.dev/image/upload/s--5qrQGNNm--/f_auto,q_auto/v1787487502/logos/margelo?_a=BAMAMicg0","url":"https://daily.dev/sources/margelo"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/building-a-real-time-face-recognition-app-in-react-native-with-visioncamera-wp5k5kzg1","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"react-native,computer-vision,local-ai","timeRequired":"PT24M"}
{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Nitro Modules","item":"https://daily.dev/sources/margelo"},{"@type":"ListItem","position":3,"name":"Building a Real-Time Face Recognition App in React Native with VisionCamera"}]}
{"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/building-a-real-time-face-recognition-app-in-react-native-with-visioncamera-wp5k5kzg1#faq","mainEntity":[{"@type":"Question","name":"Which face detection model should I use for real-time face recognition on mobile with React Native?","acceptedAnswer":{"@type":"Answer","text":"YuNet is the recommended default for mobile face detection: it is about 230 KB, runs in 3 to 6 ms per frame at 128 input resolution on a Galaxy S21 Ultra class CPU, provides 5 landmarks that map directly onto the ArcFace alignment template, and carries an MIT license. Alternatives like SCRFD and RetinaFace offer higher accuracy for crowded scenes but their pretrained weights are research-only, blocking commercial use. daily.dev surfaces engineering writeups like this for teams weighing computer vision model trade-offs."}},{"@type":"Question","name":"Why does mirrored front camera input break face recognition accuracy?","acceptedAnswer":{"@type":"Answer","text":"Front-camera buffers can arrive mirrored, and aligning a mirrored face against a non-mirrored canonical template distorts every face the same systematic way, compressing the embedding space so different people start matching each other, producing false accepts. The fix is using a flipped alignment template for mirrored frames, applied during the landmark-based warp to the 112x112 canonical crop. track subtle production bugs like this on daily.dev before they surface as failed face-recognition matches."}},{"@type":"Question","name":"Which face embedding model is best for commercial on-device face recognition apps?","acceptedAnswer":{"@type":"Answer","text":"SFace is the recommended shipping default because it carries an Apache-2.0 license, unlike ArcFace MobileFaceNet or ArcFace ResNet-50 whose InsightFace pretrained weights are restricted to non-commercial research. SFace is 37MB (19MB quantized to int8), achieves about 99.6% on LFW, and runs in roughly 29ms per face on a Galaxy S21 Ultra class CPU using ONNX Runtime with XNNPACK. compare model licensing and performance trade-offs like these before shipping, tracked with daily.dev."}}]}
```

