@mebius-io/web 0.4.6 → 0.4.8

package/dist/index.cjs

@@ -148,6 +148,8 @@ var WhipPublishTransport = class {
     this.signaling = signaling;
     this.pc = null;
     this.resourceUrl = null;
+    /** Bytes sent and packet counters at the previous getStats() call. */
+    this.lastOutbound = null;
   }
   async start(streamId, stream) {
     const pc = new RTCPeerConnection(DEFAULT_RTC_CONFIG);
@@ -180,26 +182,61 @@ var WhipPublishTransport = class {
     this.pc?.close();
     this.pc = null;
   }
+  /**
+   * Live broadcast statistics.
+   *
+   * Two corrections over the obvious reading of RTCStats:
+   *
+   * `bitrateKbps` is the delta of `outbound-rtp.bytesSent`, not
+   * `availableOutgoingBitrate`. The latter is the congestion controller's
+   * ESTIMATE of headroom, so a broadcaster on a fast link reported several
+   * megabits while actually sending a fraction of that — the dashboard's
+   * "bitrate adherence" score was measuring the network, not the encoder.
+   *
+   * `packetLossPct` comes from the receiver's report (`remote-inbound-rtp`),
+   * which is the only place that knows what did not arrive. It was never
+   * reported at all, and publishQualityScore treats a missing value as zero
+   * loss — so every publisher scored full marks on a fifth of the rubric no
+   * matter how bad the uplink was.
+   */
   async getStats() {
     if (!this.pc) return null;
     const report = await this.pc.getStats();
-    let bitrateKbps = 0;
-    let framesPerSecond = 0;
+    let framesPerSecond;
     let rttMs;
+    let packetLossPct;
+    let bytesSent;
+    let packetsSent;
+    let packetsLost;
     report.forEach((stat) => {
       if (stat.type === "outbound-rtp" && !stat.isRemote) {
         if (typeof stat.framesPerSecond === "number") framesPerSecond = stat.framesPerSecond;
+        if (typeof stat.bytesSent === "number") bytesSent = (bytesSent ?? 0) + stat.bytesSent;
+        if (typeof stat.packetsSent === "number") packetsSent = (packetsSent ?? 0) + stat.packetsSent;
+      }
+      if (stat.type === "remote-inbound-rtp") {
+        if (typeof stat.packetsLost === "number") packetsLost = (packetsLost ?? 0) + stat.packetsLost;
+        if (typeof stat.roundTripTime === "number") rttMs = Math.round(stat.roundTripTime * 1e3);
       }
       if (stat.type === "candidate-pair" && stat.state === "succeeded") {
-        if (typeof stat.availableOutgoingBitrate === "number") {
-          bitrateKbps = Math.round(stat.availableOutgoingBitrate / 1e3);
-        }
-        if (typeof stat.currentRoundTripTime === "number") {
+        if (rttMs == null && typeof stat.currentRoundTripTime === "number") {
           rttMs = Math.round(stat.currentRoundTripTime * 1e3);
         }
       }
     });
-    return { bitrateKbps, framesPerSecond, rttMs };
+    let bitrateKbps;
+    const atMs = Date.now();
+    if (bytesSent != null) {
+      const prev = this.lastOutbound;
+      if (prev && atMs > prev.atMs && bytesSent >= prev.bytes) {
+        bitrateKbps = Math.round((bytesSent - prev.bytes) * 8 / 1e3 / ((atMs - prev.atMs) / 1e3));
+      }
+      this.lastOutbound = { bytes: bytesSent, atMs };
+    }
+    if (packetsLost != null && packetsSent != null && packetsSent > 0) {
+      packetLossPct = Math.max(0, Math.min(100, packetsLost / packetsSent * 100));
+    }
+    return { bitrateKbps, framesPerSecond, rttMs, packetLossPct };
   }
 };
 
@@ -229,6 +266,7 @@ function resetVideoElement(video) {
 var WhepViewTransport = class {
   constructor(signaling) {
     this.signaling = signaling;
+    this.kind = "whep";
     this.pc = null;
     this.resourceUrl = null;
     this.endedCb = null;
@@ -318,6 +356,7 @@ var HlsViewTransport = class {
   constructor(signaling, deliveryPath) {
     this.signaling = signaling;
     this.deliveryPath = deliveryPath;
+    this.kind = "hls";
     this.hls = null;
     this.video = null;
     this.endedCb = null;
@@ -354,7 +393,7 @@ var HlsViewTransport = class {
       this.mutedByPolicy = (await playWithAutoplayFallback(video)).mutedByPolicy;
       return;
     }
-    const hls = new Hls({ maxLiveSyncPlaybackRate: 1.5 });
+    const hls = new Hls({ maxLiveSyncPlaybackRate: 1.1 });
     this.hls = hls;
     hls.on(Hls.Events.ERROR, (_evt, data) => {
       if (data.fatal) this.bufferingCb?.();
@@ -423,6 +462,7 @@ var FlvViewTransport = class {
   constructor(signaling, deliveryPath) {
     this.signaling = signaling;
     this.deliveryPath = deliveryPath;
+    this.kind = "flv_js";
     this.player = null;
     this.video = null;
     this.endedCb = null;
@@ -431,6 +471,8 @@ var FlvViewTransport = class {
     this.listeners = null;
     /** True when playback only started because the element had to be muted. */
     this.mutedByPolicy = false;
+    /** Decoded-frame count and timestamp of the previous getStats() call. */
+    this.lastFrames = null;
   }
   onEnded(cb) {
     this.endedCb = cb;
@@ -494,13 +536,33 @@ var FlvViewTransport = class {
     }
     this.video = null;
   }
+  /**
+   * Real playback statistics for this route.
+   *
+   * Both numbers used to be hardcoded zeros, which is worse than reporting
+   * nothing: the dashboard cannot tell a measured 0 kbps from an unmeasured
+   * one, so every flv.js viewer in production showed a downlink of 0 and the
+   * column read as a total outage. flv.js measures throughput itself
+   * (`statisticsInfo.speed`, KB/s), and the element counts decoded frames, so
+   * frame rate is the delta between two calls. Anything genuinely unavailable
+   * is left undefined rather than zeroed.
+   */
   async getStats() {
     if (!this.video) return null;
-    return {
-      bitrateKbps: 0,
-      framesPerSecond: 0,
-      latencyMs: void 0
-    };
+    const speedKBs = this.player?.statisticsInfo?.speed;
+    const bitrateKbps = typeof speedKBs === "number" ? Math.round(speedKBs * 8) : void 0;
+    let framesPerSecond;
+    const q = this.video.getVideoPlaybackQuality?.();
+    const count = q?.totalVideoFrames;
+    const atMs = Date.now();
+    if (typeof count === "number") {
+      const prev = this.lastFrames;
+      if (prev && atMs > prev.atMs && count >= prev.count) {
+        framesPerSecond = Math.round((count - prev.count) * 1e3 / (atMs - prev.atMs));
+      }
+      this.lastFrames = { count, atMs };
+    }
+    return { bitrateKbps, framesPerSecond, latencyMs: void 0 };
   }
 };
 
@@ -536,7 +598,7 @@ function createViewCandidates(mode, signaling, deliveries = []) {
 }
 
 // src/internal/telemetry.ts
-var SDK_VERSION = "web/0.4.6";
+var SDK_VERSION = "web/0.4.8";
 var FLUSH_INTERVAL_MS = 15e3;
 var MAX_BATCH = 64;
 function describeDevice() {
@@ -549,11 +611,12 @@ function describeNetwork() {
   return conn?.effectiveType ? { type: conn.effectiveType } : void 0;
 }
 var QoeReporter = class {
-  constructor(target, role, streamId, userId) {
+  constructor(target, role, streamId, userId, playerKind) {
     this.target = target;
     this.role = role;
     this.streamId = streamId;
     this.userId = userId;
+    this.playerKind = playerKind;
     this.sessionId = randomId();
     this.buffer = [];
     this.timer = null;
@@ -589,6 +652,7 @@ var QoeReporter = class {
       streamId: this.streamId,
       role: this.role,
       userId: this.userId,
+      playerKind: this.playerKind,
       samples,
       device: describeDevice(),
       network: describeNetwork()
@@ -713,7 +777,8 @@ var MebiusBroadcaster = class extends TypedEmitter {
         ts: Math.floor(Date.now() / 1e3),
         bitrateKbps: stats.bitrateKbps,
         fps: stats.framesPerSecond,
-        rttMs: stats.rttMs
+        rttMs: stats.rttMs,
+        packetLossPct: stats.packetLossPct
       });
     }, STATS_INTERVAL_MS);
   }
@@ -727,6 +792,59 @@ function normalize(c, fallback) {
   return c;
 }
 
+// src/internal/freeze-clock.ts
+var FreezeClock = class {
+  constructor(now = Date.now) {
+    this.now = now;
+    /** When the current stall began, or null when playback is running. */
+    this.stalledSinceMs = null;
+    /** Stall time that has ended but has not yet been shipped with a sample. */
+    this.pendingMs = 0;
+  }
+  /** True while a stall is in progress. */
+  get stalled() {
+    return this.stalledSinceMs !== null;
+  }
+  /**
+   * Begin a stall. Re-entering while already stalled is ignored rather than
+   * restarting the clock: flv.js fires `waiting` repeatedly through a single
+   * long stall, and resetting the start on each would report a fraction of the
+   * freeze that actually happened.
+   */
+  beginStall() {
+    if (this.stalledSinceMs === null) this.stalledSinceMs = this.now();
+  }
+  /** End the current stall and bank its duration. No-op when not stalled. */
+  endStall() {
+    if (this.stalledSinceMs === null) return;
+    this.pendingMs += Math.max(0, this.now() - this.stalledSinceMs);
+    this.stalledSinceMs = null;
+  }
+  /**
+   * Freeze milliseconds to report on this tick, resetting the counter.
+   *
+   * A stall still in progress is counted up to now and its clock restarted, so
+   * a freeze longer than the sample interval is reported while it is happening
+   * rather than landing whole in whichever sample eventually follows it. Every
+   * millisecond is attributed exactly once — never dropped, never double-counted.
+   */
+  take() {
+    if (this.stalledSinceMs !== null) {
+      const now = this.now();
+      this.pendingMs += Math.max(0, now - this.stalledSinceMs);
+      this.stalledSinceMs = now;
+    }
+    const ms = this.pendingMs;
+    this.pendingMs = 0;
+    return ms;
+  }
+  /** Forget everything. Called when a session ends. */
+  reset() {
+    this.stalledSinceMs = null;
+    this.pendingMs = 0;
+  }
+};
+
 // src/player.ts
 var STATS_INTERVAL_MS2 = 2e3;
 var FIRST_FRAME_TIMEOUT_MS = 8e3;
@@ -744,6 +862,8 @@ var MebiusPlayer = class extends TypedEmitter {
     this.reporter = null;
     /** True between a `buffering` event and the element actually resuming. */
     this.stalled = false;
+    /** Measures how long playback was actually frozen; see FreezeClock. */
+    this.freeze = new FreezeClock();
     /** Cancels element listeners bound for the lifetime of one play(). */
     this.elementListeners = null;
     this.candidates = createViewCandidates(options.mode ?? "auto", signaling, deliveries);
@@ -762,6 +882,7 @@ var MebiusPlayer = class extends TypedEmitter {
       () => {
         if (!this.stalled || !this.playing) return;
         this.stalled = false;
+        this.freeze.endStall();
         this.emit("playing", { streamId });
       },
       { signal: this.elementListeners.signal }
@@ -777,7 +898,13 @@ var MebiusPlayer = class extends TypedEmitter {
           this.transport = candidate;
           this.playing = true;
           if (this.telemetry) {
-            this.reporter = new QoeReporter(this.telemetry, "play", streamId, this.userId);
+            this.reporter = new QoeReporter(
+              this.telemetry,
+              "play",
+              streamId,
+              this.userId,
+              candidate.kind
+            );
             this.reporter.start();
             this.reporter.add({ ts: Math.floor(Date.now() / 1e3), firstFrameMs: Date.now() - startedAtMs });
           }
@@ -805,6 +932,7 @@ var MebiusPlayer = class extends TypedEmitter {
       ELEMENT_OWNER.delete(this.video);
     }
     this.stalled = false;
+    this.freeze.reset();
     this.stopStats();
     await this.reporter?.stop();
     this.reporter = null;
@@ -844,6 +972,7 @@ var MebiusPlayer = class extends TypedEmitter {
     });
     transport.onBuffering(() => {
       if (this.transport !== transport) return;
+      this.freeze.beginStall();
       this.stalled = true;
       this.emit("buffering", void 0);
     });
@@ -851,12 +980,17 @@ var MebiusPlayer = class extends TypedEmitter {
   startStats() {
     this.statsTimer = setInterval(async () => {
       const stats = await this.transport?.getStats();
-      if (!stats) return;
+      const freezeMs = this.freeze.take();
+      if (!stats) {
+        if (freezeMs > 0) this.reporter?.add({ ts: Math.floor(Date.now() / 1e3), freezeMs });
+        return;
+      }
       this.emit("stats", stats);
       this.reporter?.add({
         ts: Math.floor(Date.now() / 1e3),
         bitrateKbps: stats.bitrateKbps,
-        fps: stats.framesPerSecond
+        fps: stats.framesPerSecond,
+        freezeMs
       });
     }, STATS_INTERVAL_MS2);
   }