A <Video /> component for react-native
See the codeThe most battle-tested open-source video player component for React Native with support for DRM, offline playback, HLS/DASH streaming, and more.
[!IMPORTANT] This is a new version (v7) of
react-native-videothat is currently in active development. You can expect breaking changes and missing features.If you have any questions, please contact us at hi@thewidlarzgroup.com.
| Feature | Status |
|---|---|
| 📱 Plays all video formats natively supported by iOS/Android | ✅ Available |
| ▶️ Local and remote playback | ✅ Available |
| 🔁 Streaming: HLS • DASH • SmoothStreaming | ✅ Available |
| 🧩 Expo plugin support | ✅ Available |
| 📴 Offline playback, video download, support for side-tracks and side-captions (via optional SDK) | ✅ Available |
| 📱 Picture in Picture | ✅ Available |
| 🎚️ Fine-grained control over tracks, buffering & events | 🏗️ In Development |
| 🧠 Advanced control over playback and buffering | ✅ Available |
| 🔐 DRM: Widevine & FairPlay (See free DRM stream example) | ✅ Available |
| 🌐 Basic Web Support | ✅ Available |
| 📺 TV Support | 📝 TODO |
| 🥽 VisionOS Support | 📝 TODO |
| Version | State | Architecture |
|---|---|---|
| v5 and lower | ❌ End-of-life Commercial Support Available | Old Architecture |
| v6 | 🛠 Maintained (community + TWG) | Old + New (Interop Layer) |
| v7 | 🚀 Active Development | Old + New (Full Support) |
react-native-video v7 introduces full support for the new React Native architecture, unlocking better performance, improved consistency, and modern native modules.
npx skills add TheWidlarzGroup/react-native-videoreact-native-nitro-modules (>=0.31.10) - Please see nitro requirementsreact-native-video requires react-native-nitro-modules (>=0.31.10) in your project.
npm install react-native-nitro-modules
Then install react-native-video
# Install the beta version of react-native-video v7
npm install react-native-video@beta
# Install pods
cd ios && pod install
Without this patch you won't be able "recognize" errors, all will be thrown as unknown errors.
import { useVideoPlayer, VideoView } from 'react-native-video';
export default () => (
const player = useVideoPlayer(
'https://www.w3schools.com/html/mov_bbb.mp4',
(_player) => {
_player.play();
}
);
<VideoView
player={player}
style={{ width: '100%', aspectRatio: 16 / 9 }}
controls
/>
);
We see the need for a more feature-rich video player. There is a gap between open source and commercial players, and we want to fill that gap with plugins.
Are you using a commercial player just for 1-2 features? Maybe you are paying for a license just to get Caching, Ads, or Analytics? Let us know. We want to identify these missing pieces and build them, so you can switch back to open source.
This is what we have already. Check out!
-> Tell us what to build next ← or reach out to us sdk@thewidlarzgroup.com
| Offering | Description |
|---|---|
| Professional Support Packages | Priority bug-fixes, guaranteed SLAs, roadmap influence |
| Issue Booster | Fast-track urgent fixes with a pay‑per‑issue model |
| Offline Video SDK | Plug‑and‑play secure download solution for iOS & Android |
| Integration Support | Hands‑on help integrating video, DRM & offline into your app |
| Free DRM Token Generator | Generate Widevine / FairPlay tokens for testing |
| Ready Boilerplates | Ready-to-use apps with offline HLS/DASH DRM, video frame scrubbing, TikTok-style video feed, background uploads, Skia-based frame processor (R&D phase), and more |
| React Native Video Upgrade Guide | Common upgrade pitfalls & how to solve them |
See how TWG helped Learnn ship a world‑class player in record time - case study.
Contact us at hi@thewidlarzgroup.com
🗽 React Summit US – How TWG helped Learnn boost video performance on React Native.
Watch the talk »
🧨 v7 deep dive – Why we’re building v7 with Nitro Modules Watch on X »
🛠️ Well-maintained open-source library - What does it truly mean? - Bart's talk for React Native Warsaw Watch here »
📺 “Over the Top” Panel - Building Streaming Apps for Mobile, Web, and Smart TVs - Bart giving his insights on the industry Watch here »
(top 24 of 25)
11,399 followers · starred Apr 2016
146 followers · starred Aug 2024
425 followers · starred Dec 2017
269 followers · starred Aug 2022
A <Video /> component for react-native
See the codeThe most battle-tested open-source video player component for React Native with support for DRM, offline playback, HLS/DASH streaming, and more.
[!IMPORTANT] This is a new version (v7) of
react-native-videothat is currently in active development. You can expect breaking changes and missing features.If you have any questions, please contact us at hi@thewidlarzgroup.com.
| Feature | Status |
|---|---|
| 📱 Plays all video formats natively supported by iOS/Android | ✅ Available |
| ▶️ Local and remote playback | ✅ Available |
| 🔁 Streaming: HLS • DASH • SmoothStreaming | ✅ Available |
| 🧩 Expo plugin support | ✅ Available |
| 📴 Offline playback, video download, support for side-tracks and side-captions (via optional SDK) | ✅ Available |
| 📱 Picture in Picture | ✅ Available |
| 🎚️ Fine-grained control over tracks, buffering & events | 🏗️ In Development |
| 🧠 Advanced control over playback and buffering | ✅ Available |
| 🔐 DRM: Widevine & FairPlay (See free DRM stream example) | ✅ Available |
| 🌐 Basic Web Support | ✅ Available |
| 📺 TV Support | 📝 TODO |
| 🥽 VisionOS Support | 📝 TODO |
| Version | State | Architecture |
|---|---|---|
| v5 and lower | ❌ End-of-life Commercial Support Available | Old Architecture |
| v6 | 🛠 Maintained (community + TWG) | Old + New (Interop Layer) |
| v7 | 🚀 Active Development | Old + New (Full Support) |
react-native-video v7 introduces full support for the new React Native architecture, unlocking better performance, improved consistency, and modern native modules.
npx skills add TheWidlarzGroup/react-native-videoreact-native-nitro-modules (>=0.31.10) - Please see nitro requirementsreact-native-video requires react-native-nitro-modules (>=0.31.10) in your project.
npm install react-native-nitro-modules
Then install react-native-video
# Install the beta version of react-native-video v7
npm install react-native-video@beta
# Install pods
cd ios && pod install
Without this patch you won't be able "recognize" errors, all will be thrown as unknown errors.
import { useVideoPlayer, VideoView } from 'react-native-video';
export default () => (
const player = useVideoPlayer(
'https://www.w3schools.com/html/mov_bbb.mp4',
(_player) => {
_player.play();
}
);
<VideoView
player={player}
style={{ width: '100%', aspectRatio: 16 / 9 }}
controls
/>
);
We see the need for a more feature-rich video player. There is a gap between open source and commercial players, and we want to fill that gap with plugins.
Are you using a commercial player just for 1-2 features? Maybe you are paying for a license just to get Caching, Ads, or Analytics? Let us know. We want to identify these missing pieces and build them, so you can switch back to open source.
This is what we have already. Check out!
-> Tell us what to build next ← or reach out to us sdk@thewidlarzgroup.com
| Offering | Description |
|---|---|
| Professional Support Packages | Priority bug-fixes, guaranteed SLAs, roadmap influence |
| Issue Booster | Fast-track urgent fixes with a pay‑per‑issue model |
| Offline Video SDK | Plug‑and‑play secure download solution for iOS & Android |
| Integration Support | Hands‑on help integrating video, DRM & offline into your app |
| Free DRM Token Generator | Generate Widevine / FairPlay tokens for testing |
| Ready Boilerplates | Ready-to-use apps with offline HLS/DASH DRM, video frame scrubbing, TikTok-style video feed, background uploads, Skia-based frame processor (R&D phase), and more |
| React Native Video Upgrade Guide | Common upgrade pitfalls & how to solve them |
See how TWG helped Learnn ship a world‑class player in record time - case study.
Contact us at hi@thewidlarzgroup.com
🗽 React Summit US – How TWG helped Learnn boost video performance on React Native.
Watch the talk »
🧨 v7 deep dive – Why we’re building v7 with Nitro Modules Watch on X »
🛠️ Well-maintained open-source library - What does it truly mean? - Bart's talk for React Native Warsaw Watch here »
📺 “Over the Top” Panel - Building Streaming Apps for Mobile, Web, and Smart TVs - Bart giving his insights on the industry Watch here »
(top 24 of 25)
11,399 followers · starred Apr 2016
146 followers · starred Aug 2024
425 followers · starred Dec 2017
269 followers · starred Aug 2022