Skip to content

TheWidlarzGroup/react-native-video

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

React Native Video Component

The most battle-tested open-source video player component for React Native with support for DRM, offline playback, HLS/DASH streaming, and more.

๐Ÿ” Features

  • ๐Ÿ“ฑ Plays all video formats natively supported by iOS/Android
  • โ–ถ๏ธ Local and remote playback
  • ๐Ÿ” Streaming: HLS โ€ข DASH โ€ข SmoothStreaming
  • ๐Ÿ” DRM: Widevine & FairPlay (See free DRM stream example)
  • ๐Ÿ“ด Offline playback, video download, support for side-tracks and side-captions (via optional SDK)
  • ๐ŸŽš๏ธ Fine-grained control over tracks, buffering & events
  • ๐Ÿงฉ Expo plugin support
  • ๐ŸŒ Basic Web Support
  • ๐Ÿ“ฑ Picture in Picture
  • ๐Ÿ“บ TV Support

โœจ Project Status

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.


๐Ÿ“š Documentation & Examples

๐Ÿš€ Quick Start

Install

# Install dependencies
yarn add react-native-video

# Install pods
cd ios && pod install

Usage

import Video from 'react-native-video';

export default () => (
  <Video
    source={{ uri: 'https://www.w3schools.com/html/mov_bbb.mp4' }}
    style={{ width: '100%', aspectRatio: 16 / 9 }}
    controls
  />
);

๐Ÿงฉ Plugins

Offline SDK Preview

1 ยท ๐Ÿ“ฅ Offline SDK

Need Offline Video Playback in React Native?

If you're building a video-first app and need to download HLS streams for offline playback, you're in the right place.

This SDK supports:

  • ๐ŸŽž Offline HLS playback
  • ๐ŸŽง Multi-language audio track downloads
  • ๐Ÿ’ฌ Subtitles support
  • ๐Ÿ” DRM license handling
  • ๐Ÿ“Š Analytics & state tracking

๐Ÿ”‘ How to get access?

  • Get a free trial (no credit card required)
  • Use our starter project to see it in action
  • Integrates with both v6 and v7 versions

๐Ÿ‘‰ Start Free Trial on the SDK Platform โ†’


2 ยท ๐Ÿงช Architecture

Write your own plugins to extend library logic, attach analytics or add custom workflows - without forking the core SDK.
โ†’ Plugin documentation


๐Ÿ’ผ TWG Services & Products

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 [email protected]

๐ŸŒ Social

๐Ÿ“ฐ Community & Media

  • ๐Ÿ—ฝ 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 ยป