@100mslive/hls-stats

@100mslive/hms-stats

A simple library for HLS stats for Hls.js.

Installation

yarn add @100mslive/hls-stats

or

npm install --save @100mslive/hls-stats

Usage

initialization

import Hls from "hls.js";

/**
 * Initialize Hls.js and attach the video element.
 */
const hlsInstance = new Hls();
hlsInstance.loadSource(hlsUrl);
hlsInstance.attachMedia(videoEl);

/**
 * initialize HlsStats
 */
const hlsStats = new HlsStats(hlsController.getHlsJsInstance(), videoEl);

Subscribing to Stats

hlsStats have a subscribe function which takes two parameter. a callbackFn and an interval in ms. The interval tells how frequent you want hls-stats to report back to you. Default is 2000ms

const unsubscribe = hlsStats.subscribe(state => {
    // ...
});

the subscribe() also returns a reference to unsubscribe() function which could later be used to unsubscribe from your subscription

Exposed Stats

hls-stats currently exposes the following stats

Name	Description	Unit	Usage
bandwidthEstimate	The current bandwidth, as seen by the player	bits per second	Use this to show the current network speed of the user
bitrate	server indicated bitrate of current layer of hls stream	bits per second	Use to know the bitrate required for current layer
bufferedDuration	buffered duration from the current position	ms	This can be used to show how much data is buffered from the current location (forward buffer)
distanceFromLiveEdge	The distance from the live edge	ms	Used to know currently buffered duration ahead
droppedFrames	The number of dropped frames till now		Used to calculate the total num of dropped frames
videoSize.width videoSize.height	The width and height of the video	px	Used to know the resolution being played
watchDuration	Total duration watched	ms	used to know the overall watch duration (not the stream length)