Skip to content
ByteArk

ByteArk Player

One player, every site and app

An HTML5 video player you can embed on the web and in native apps, with content protection, ads and analytics built in. Write the config once and reuse it on every platform.

Try for freeRead the docs
  • Smooth playback on any device
  • Built-in content protection
  • Ads and analytics included

Set up once, use everywhere

Every framework, every platform

Web and native apps share the same core, so options and plugins behave the same everywhere.

  • HTML / CDNWeb
  • ReactWeb
  • VueWeb
  • AngularWeb
  • Next.jsReact · SSR
  • NuxtVue · SSR
  • iOSNative · AVPlayer
  • AndroidNative · ExoPlayer
  • FlutterNative · iOS + Android

Why ByteArk Player

One player that does it all

Full platform coverage, content protection and monetization, built in.

Every platform

Web and native apps in one player

Embed on the web with a CDN script or the React, Vue and Angular packages (with SSR on Next.js and Nuxt), and in apps with native iOS, Android and Flutter SDKs. Every platform runs the same core.

  • Web: HTML/CDN, React, Vue, Angular
  • SSR: Next.js and Nuxt
  • Native: iOS, Android and Flutter

Content protection

Keep your videos from being copied

DRM that covers every device family, plus automatic browser capability checks before playback, keeps premium content safe.

  • Widevine (Chrome/Android) and FairPlay (Safari/iOS)
  • Per-video protection settings
  • Automatic browser support detection

Monetize and measure

Ads and analytics, in the player

Turn on a plugin to play Google IMA / VAST ads as pre-, mid- and post-roll, and connect ByteArk Lighthouse to see viewing behavior. It takes a few lines of configuration.

  • Pre-, mid- and post-roll ads via Google IMA
  • Connect Lighthouse for views and retention
  • Toggle features from one configuration

Try it

Press play

The player below is the real ByteArk Player, not a mockup.

Live example: an HLS stream played by ByteArk Player

Getting started

Embed the player in 3 steps

One reusable config across every framework. Add optional features whenever you need them.

  1. 1.Install

    Add the CDN script to your site, install the React, Vue or Angular package, or the native iOS, Android or Flutter SDK.

  2. 2.Add a video and configure

    Set the video source (URL) with options for autoplay, aspect ratio and UI language.

  3. 3.Turn on add-ons

    Add DRM, ads and analytics in the same config.

React example
npm install byteark-player-react
import { ByteArkPlayerContainer } from 'byteark-player-react'

export function Watch() {
  return (
    <ByteArkPlayerContainer
      fluid
      aspectRatio="16:9"
      autoplay="any"
      sources={[{
        src: 'https://example.com/video/playlist.m3u8',
        type: 'application/x-mpegURL',
      }]}
    />
  )
}

All in one player

Production-ready features

Everything a professional player needs, switched on through config.

  • Plays in every browser

    Built on Video.js and the HTML5 standard, so it plays in every modern browser without plugins.

  • Use your team's framework

    Ready-made React, Vue and Angular packages wrap the same core, so options behave the same across frameworks.

  • Native mobile SDKs

    Embed in iOS (AVPlayer), Android (ExoPlayer) and Flutter apps for smooth mobile playback.

  • Works with Next.js and Nuxt

    Supports Server-Side Rendering via dynamic import or ClientOnly.

  • Smooth on any connection

    Plays HLS with Adaptive Bitrate, or lets viewers pick (720p, 1080p, Auto).

  • DRM protection

    Supports Widevine, FairPlay and HLS ClearKey, configurable per video.

  • Monetize with ads

    Insert VAST pre-, mid- and post-roll ads via Google IMA, with markers and measurement.

  • Measure viewing

    Connect ByteArk Lighthouse to capture views, watch time and retention, with user and video metadata.

  • Timeline previews

    Show storyboard thumbnails while scrubbing so viewers find the moment they want fast.

All features

Every capability, by category

The full ByteArk Player feature list.

  • Playback & quality6

    • HLS & MPEG-DASH · VOD and Live
    • Adaptive Bitrate · Quality follows connection speed
    • Manual quality · 720p / 1080p / Auto
    • Playback speed control
    • Live + DVR · Watch live and rewind
    • Autoplay modes · muted / viewable / focus

  • Content protection5

    • Widevine · Chrome / Android
    • FairPlay · Safari / iOS
    • HLS ClearKey encryption
    • Per-video license settings
    • Automatic browser support detection

  • Ad revenue5

    • Google IMA ads · VAST / VPAID
    • Pre / Mid / Post-roll
    • Flexible ad timing · seconds / timecode / %
    • Ad markers on the timeline
    • Full set of tracking events

  • Viewing analytics4

    • Connect ByteArk Lighthouse · views, watch time, retention
    • Retention chart overlay · See drop-off on the timeline
    • Attach user and video metadata
    • Automatic playback-stuck detection

  • Viewer experience10

    • Storyboard preview · Thumbnails while scrubbing
    • Volume Booster · Go beyond 100% volume
    • Picture-in-Picture
    • Skip Intro
    • Playlist and next video
    • Recommendations at the end
    • Share button · Facebook / X / copy link
    • Subtitles / Captions
    • UI language (EN / TH)
    • Customizable error screen

  • Advanced6

    • VR / 360 · 360° video via WebGL
    • Chromecast · On the Android SDK
    • Audio track selection
    • Automatic landscape rotation
    • 10-second rewind and forward
    • Concurrent viewer count (Live)

A player that's production-ready from line one

Embed ByteArk Player today, then add DRM, ads and analytics when you're ready, all from one configuration.

Start freeTalk to sales