Navigate:
React Native Video
~$NATI0.1%

react-native-video: Video player component for React Native

Native iOS/Android video playback with streaming and DRM.

LIVE RANKINGS • 12:28 PM • STEADY
OVERALL
#360
46
MOBILE & DESKTOP
#36
1
30 DAY RANKING TREND
ovr#360
·Mobil#36
STARS
7.7K
FORKS
3.0K
7D STARS
+9
7D FORKS
0
See Repo:
Share:

Learn more about React Native Video

React Native Video is a cross-platform component library that provides native video playback capabilities for React Native applications on iOS and Android devices. The library bridges native video player implementations on each platform, exposing a unified React component interface that wraps AVPlayer on iOS and ExoPlayer on Android. It supports advanced features including adaptive bitrate streaming protocols like HLS and DASH, digital rights management through platform-specific DRM systems, and hardware-accelerated decoding for efficient performance. The component integrates into React Native's architecture by implementing native modules that communicate with JavaScript through the bridge, allowing developers to control playback state, handle events, and configure video properties declaratively. This approach leverages each platform's optimized media frameworks while maintaining a consistent API surface across operating systems.

React Native Video

1

DRM and Adaptive Streaming

Built-in Widevine and FairPlay DRM with native HLS, DASH, and SmoothStreaming support. Handles adaptive bitrate streaming without additional configuration or third-party dependencies.

2

New Architecture Compatible

Version 7 fully supports React Native's new architecture through an interoperability layer. Version 6 maintains backward compatibility for gradual migration paths.

3

Granular Playback Control

Configurable API for audio/subtitle track selection, buffer management, and playback event handling. Provides low-level control over native player behavior through the JavaScript bridge.


import React from 'react';
import Video from 'react-native-video';

const VideoPlayer = () => {
  return (
    <Video
      source={{ uri: 'https://example.com/video.mp4' }}
      style={{ width: '100%', height: 300 }}
      controls={true}
      paused={false}
    />
  );
};


[ EXPLORE MORE ]

Related Repositories

Discover similar tools and frameworks used by developers