Version 4 is in alpha. It can still change between releases, and it isn't on npm yet. Version 3 docs
Introduction
A React video player you compose from a small kernel and the plugins you pick.
React Video Kit is a video player built from parts. The kernel plays a video and keeps state. Everything else, from fullscreen to HLS to ads, is a plugin you add by importing it, so anything you don't use isn't in your bundle.
"use client";import { defaultPlugins, VideoPlayer } from "react-video-kit/player";const plugins = defaultPlugins();export default function ComposeReady() { return ( <VideoPlayer src="/media/sample-720.mp4" poster="/media/poster.jpg" plugins={plugins} /> );}What's different
It costs what you use. The kernel is about 5 KB, and a complete player is about 17 KB, both brotli and without React. Every plugin page lists what that plugin adds, measured from the built package. hls.js and dash.js load only when a source needs them.
Playback doesn't render React. Time never enters the store. The timeline and clock write straight to the DOM, so a playing video causes no React commits at all. How that works.
You choose how much you compose. Use the ready-made player, arrange the styled parts yourself, or take the unstyled primitives and bring your own design. Compare the three.
It's built for everyone watching. Sliders are real range inputs, menus support the keyboard, and the layout responds to the player's own size rather than the window's. Right-to-left layouts mirror, and reduced motion is respected.
Where to go next
Install it and play a video in a few minutes.
Everything optional, from captions to casting.
Build a player, and copy the code it generates.
What changed, and a bridge for custom controls.
How it's tested
Unit tests run on React 18 and 19. Browser tests play real video on Chromium, Firefox, and WebKit, including HLS, DASH, simulated live streams, VAST ads, and Clear Key encrypted media.
If something misbehaves on your device or service, please open an issue.