npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

shaka-player-custom

v0.0.1

Published

DASH/EME video player library

Downloads

38

Readme

Shaka Player

Shaka Player is an open-source JavaScript library for adaptive media. It plays adaptive media formats (such as DASH and HLS) in a browser, without using plugins or Flash. Instead, Shaka Player uses the open web standards MediaSource Extensions and Encrypted Media Extensions.

Shaka Player also supports offline storage and playback of media using IndexedDB. Content can be stored on any browser. Storage of licenses depends on browser support.

Our main goal is to make it as easy as possible to stream adaptive bitrate video and audio using modern browser technologies. We try to keep the library light, simple, and free from third-party dependencies. Everything you need to build and deploy is in the sources.

For details on what's coming next, see our development roadmap.

Platform and browser support matrix

|Browser |Windows |Mac |Linux |Android |iOS >= 12 |ChromeOS|Other| |:---------:|:--------:|:-------:|:-------:|:-------:|:--------:|:------:|:---:| |Chrome¹ |Y |Y |Y |Y |Native|Y | - | |Firefox¹ |Y |Y |Y |untested⁵|Native| - | - | |Edge¹ |Y | - | - | - | - | - | - | |Edge Chromium|Y |Y |Y |untested⁵|Native| - | - | |IE | N | - | - | - | - | - | - | |Safari¹ | - |Y | - | - |iPadOS 13Native| - | - | |Opera¹ |untested⁵ |untested⁵|untested⁵|untested⁵|Native| - | - | |Chromecast²| - | - | - | - | - | - |Y| |Tizen TV³ | - | - | - | - | - | - |Y| |WebOS⁶ | - | - | - | - | - | - |Y| |Xbox One | - | - | - | - | - | - |Y|

NOTES:

  • ¹: On macOS, only Safari 12+ is supported. On iOS, only iOS 12+ is supported. Older versions will be rejected.
  • ²: The latest stable Chromecast firmware is tested. Both sender and receiver can be implemented with Shaka Player.
  • ³: Tizen 2017 model is actively tested and supported by the Shaka Player team. Tizen 2016 model is community-supported and untested by us.
  • ⁵: These are expected to work, but are not actively tested by the Shaka Player team.
  • ⁶: These are expected to work, but are community-supported and untested by us.
    • Official support for LG WebOS TV: https://github.com/shaka-project/shaka-player/issues/1330

We support iOS 12+ through Apple's native HLS player. We provide the same top-level API, but we just set the video's src element to the manifest/media. So we are dependent on the browser supporting the manifests.

Shaka Player Embedded (for native iOS)

We have another project called Shaka Player Embedded which offers the same features and similar APIs for native apps on iOS. This project uses its own media stack, which allows it to play content that would otherwise not be supported. This supports both DASH and HLS manifests.

Manifest format support matrix

|Format|Video On-Demand|Live |Event|In-Progress Recording| |:----:|:-------------:|:---:|:---:|:-------------------:| |DASH |Y |Y| - |Y | |HLS |Y |Y|Y| - |

You can also create a manifest parser plugin to support custom manifest formats.

DASH features

DASH features supported:

  • VOD, Live, and In-Progress Recordings (dynamic VOD content)
  • MPD@timeShiftBufferDepth for seeking backward in Live streams
  • Multi-period content (static and dynamic)
  • Xlink elements (actuate=onLoad only, resolve-to-zero, fallback content)
  • All forms of segment index info: SegmentBase@indexRange, SegmentTimeline, SegmentTemplate@duration, SegmentTemplate@index, SegmentList
  • Multi-codec/multi-container manifests (we will negotiate support with the browser and choose the best ones)
  • Encrypted content (including custom ContentProtection schemas, PSSH in the manifest)
  • Key rotation
  • Trick mode tracks
  • WebVTT and TTML
  • CEA-608/708 captions

DASH features not supported:

  • Xlink with actuate=onRequest
  • Manifests without any segment info: https://github.com/shaka-project/shaka-player/issues/1088
  • Changing codecs during a presentation (unsupported by MSE)
  • Multiple trick mode tracks for the same resolution at varying framerates or bitrates
  • Timescales so large that timestamps cannot be represented as integers in JavaScript (2^53): https://github.com/shaka-project/shaka-player/issues/1667

HLS features

Only supported on browsers with SourceBuffer.mode=sequence support

HLS features supported:

  • VOD, Live, and Event types
  • Low-latency streaming with partial segments, preload hints, and delta updates
  • Discontinuity
  • ISO-BMFF / MP4 / CMAF support
  • MPEG-2 TS support (transmuxing provided by mux.js v5.7.0+, must be separately included)
  • WebVTT and TTML
  • CEA-608/708 captions
  • Encrypted content with PlayReady and Widevine
  • Encrypted content with FairPlay (Safari on macOS and iOS 12+ only)
  • Raw AAC, MP3, etc (without an MP4 container)

HLS features not supported:

  • Key rotation: https://github.com/shaka-project/shaka-player/issues/917
  • I-frame-only playlists: https://github.com/shaka-project/shaka-player/issues/742
  • Low-latency streaming with blocking playlist reload

DRM support matrix

|Browser |Widevine |PlayReady|FairPlay |ClearKey⁶ | |:--------:|:--------:|:-------:|:-------:|:--------:| |Chrome¹ |Y | - | - |Y | |Firefox² |Y | - | - |Y | |Edge³ | - |Y | - | - | |Edge Chromium|Y |Y | - |Y | |Safari | - | - |Y | - | |Opera |untested⁵ | - | - |untested⁵ | |Chromecast|Y |Y | - |untested⁵ | |Tizen TV |Y |Y | - |untested⁵ | |WebOS⁷ |untested⁷ |untested⁷| - |untested⁷ | |Xbox One | - |Y | - | - |

Other DRM systems should work out of the box if they are interoperable and compliant to the EME spec.

NOTES:

  • ¹: Only official Chrome builds contain the Widevine CDM. Chromium built from source does not support DRM.
  • ²: DRM must be enabled by the user. The first time a Firefox user visits a site with encrypted media, the user will be prompted to enable DRM.
  • ³: PlayReady in Edge does not seem to work on a VM or over Remote Desktop.
  • ⁵: These are expected to work, but are not actively tested by the Shaka Player team.
  • ⁶: ClearKey is a useful tool for debugging, and does not provide actual content security.
  • ⁷: These are expected to work, but are community-supported and untested by us.

|Manifest |Widevine |PlayReady|FairPlay |ClearKey | |:--------:|:--------:|:-------:|:-------:|:--------:| |DASH |Y |Y | - |Y | |HLS |Y |Y |Y ¹ | - |

NOTES:

  • ¹: By default, FairPlay is handled using Apple's native HLS player, when on Safari. We do support FairPlay through MSE/EME, however. See the streaming.useNativeHlsOnSafari configuration value.

Media container and subtitle support

Shaka Player supports:

  • ISO-BMFF / CMAF / MP4
    • Depends on browser support for the container via MediaSource
    • Can parse "sidx" box for DASH's SegmentBase@indexRange and SegmentTemplate@index
    • Can find and parse "tfdt" box to find segment start time in HLS
  • WebM
    • Depends on browser support for the container via MediaSource
    • Can parse cueing data elements for DASH's SegmentBase@indexRange and SegmentTemplate@index
    • Not supported in HLS
  • MPEG-2 TS
    • With help from mux.js v5.7.0+, can be played on any browser which supports MP4
    • Can find and parse timestamps to find segment start time in HLS
  • WebVTT
    • Supported in both text form and embedded in MP4
  • TTML
    • Supported in both XML form and embedded in MP4
  • CEA-608
    • Supported embedded in MP4
    • With help from mux.js v5.7.0+, supported embedded in TS
  • CEA-708
    • Supported embedded in MP4
    • With help from mux.js v5.7.0+, supported embedded in TS
  • SubRip (SRT)
    • UTF-8 encoding only
  • LyRiCs (LRC)
    • UTF-8 encoding only
  • SubStation Alpha (SSA, ASS)
    • UTF-8 encoding only
  • SubViewer (SBV)
    • UTF-8 encoding only

Subtitles are rendered by the browser by default. Applications can create a text display plugin for customer rendering to go beyond browser-supported attributes.

Documentation & Important Links

FAQ

For general help and before filing any bugs, please read the FAQ.

Contributing

If you have improvements or fixes, we would love to have your contributions. Please read CONTRIBUTING.md for more information on the process we would like contributors to follow.

Framework Integrations

The Shaka team doesn't have the bandwidth and experience to provide guidance and support for integrating Shaka Player with specific frameworks, but some of our users have successfully done so and created tutorials to help other beginners.

Shaka + ReactJS integrations:

  • https://github.com/matvp91/shaka-player-react
  • https://github.com/amit08255/shaka-player-react-with-ui-config

Shaka + Next.js integration:

  • https://github.com/amit08255/shaka-player-react-with-ui-config/tree/master/nextjs-shaka-player

Shaka + Vue.js integrations:

  • https://github.com/davidjamesherzog/shaka-player-vuejs

Shaka + Nuxt.js integration:

  • https://github.com/davidjamesherzog/shaka-player-nuxtjs

Shaka + video.js integration:

  • https://github.com/davidjamesherzog/videojs-shaka

Shaka + Angular integration:

  • https://github.com/PatrickKalkman/shaka-player-angular

If you have published Shaka Integration code/tutorials, please feel free to submit PRs to add them to this list, we will gladly approve!