feat: SFU stats reporting (#1297)

Integrates the `SendStats` RPC method.

The SDK will now send WebRTC stats on predefined intervals to the
currently connected SFU.
These stats will then be aggregated, processed, and displayed on our
Dashboard to provide better observability to our customers about
important call timeline events.

Notes: this PR replaces #1276

---------

Co-authored-by: Khushal Agarwal <[email protected]>

Author: oliverlaz

packages/client/src/Call.ts

@@ -48,6 +48,7 @@ import {
   StartHLSBroadcastingResponse,
   StartRecordingRequest,
   StartRecordingResponse,
+  StatsOptions,
   StopHLSBroadcastingResponse,
   StopLiveResponse,
   StopRecordingResponse,
@@ -93,10 +94,7 @@ import {
   VideoLayerSetting,
 } from './gen/video/sfu/event/events';
 import { Timestamp } from './gen/google/protobuf/timestamp';
-import {
-  createStatsReporter,
-  StatsReporter,
-} from './stats/state-store-stats-reporter';
+import { createStatsReporter, SfuStatsReporter, StatsReporter } from './stats';
 import { DynascaleManager } from './helpers/DynascaleManager';
 import { PermissionsContext } from './permissions';
 import { CallTypes } from './CallType';
@@ -203,6 +201,7 @@ export class Call {
   }>({ type: DebounceType.MEDIUM, data: [] });
 
   private statsReporter?: StatsReporter;
+  private sfuStatsReporter?: SfuStatsReporter;
   private dropTimeout: ReturnType<typeof setTimeout> | undefined;
 
   private readonly clientStore: StreamVideoWriteableStateStore;
@@ -486,6 +485,9 @@ export class Call {
     this.statsReporter?.stop();
     this.statsReporter = undefined;
 
+    this.sfuStatsReporter?.stop();
+    this.sfuStatsReporter = undefined;
+
     this.subscriber?.close();
     this.subscriber = undefined;
 
@@ -696,12 +698,14 @@ export class Call {
     let sfuServer: SFUResponse;
     let sfuToken: string;
     let connectionConfig: RTCConfiguration | undefined;
+    let statsOptions: StatsOptions | undefined;
     try {
       if (this.sfuClient?.isFastReconnecting) {
         // use previous SFU configuration and values
         connectionConfig = this.publisher?.connectionConfiguration;
         sfuServer = this.sfuClient.sfuServer;
         sfuToken = this.sfuClient.token;
+        statsOptions = this.sfuStatsReporter?.options;
       } else {
         // full join flow - let the Coordinator pick a new SFU for us
         const call = await join(this.streamClient, this.type, this.id, data);
@@ -711,6 +715,7 @@ export class Call {
         connectionConfig = call.connectionConfig;
         sfuServer = call.sfuServer;
         sfuToken = call.token;
+        statsOptions = call.statsOptions;
       }
 
       if (this.streamClient._hasConnectionID()) {
@@ -786,6 +791,8 @@ export class Call {
         this.publisher = undefined;
         this.statsReporter?.stop();
         this.statsReporter = undefined;
+        this.sfuStatsReporter?.stop();
+        this.sfuStatsReporter = undefined;
 
         // clean up current connection
         sfuClient.close(
@@ -972,11 +979,10 @@ export class Call {
       });
     }
 
-    const audioSettings = this.state.settings?.audio;
-    const isDtxEnabled = !!audioSettings?.opus_dtx_enabled;
-    const isRedEnabled = !!audioSettings?.redundant_coding_enabled;
-
     if (!this.publisher) {
+      const audioSettings = this.state.settings?.audio;
+      const isDtxEnabled = !!audioSettings?.opus_dtx_enabled;
+      const isRedEnabled = !!audioSettings?.redundant_coding_enabled;
       this.publisher = new Publisher({
         sfuClient,
         dispatcher: this.dispatcher,
@@ -995,6 +1001,17 @@ export class Call {
       });
     }
 
+    const clientDetails = getClientDetails();
+    if (!this.sfuStatsReporter && statsOptions) {
+      this.sfuStatsReporter = new SfuStatsReporter(sfuClient, {
+        clientDetails,
+        options: statsOptions,
+        subscriber: this.subscriber,
+        publisher: this.publisher,
+      });
+      this.sfuStatsReporter.start();
+    }
+
     try {
       // 1. wait for the signal server to be ready before sending "joinRequest"
       sfuClient.signalReady
@@ -1015,7 +1032,7 @@ export class Call {
 
           return sfuClient.join({
             subscriberSdp: sdp || '',
-            clientDetails: getClientDetails(),
+            clientDetails,
             migration,
             fastReconnect: previousSfuClient?.isFastReconnecting ?? false,
           });

packages/client/src/StreamSfuClient.ts

@@ -18,6 +18,7 @@ import { JoinRequest, SfuRequest } from './gen/video/sfu/event/events';
 import {
   ICERestartRequest,
   SendAnswerRequest,
+  SendStatsRequest,
   SetPublisherRequest,
   TrackSubscriptionDetails,
   UpdateMuteStatesRequest,
@@ -301,6 +302,17 @@ export class StreamSfuClient {
     );
   };
 
+  sendStats = async (stats: Omit<SendStatsRequest, 'sessionId'>) => {
+    return retryable(
+      () =>
+        this.rpc.sendStats({
+          ...stats,
+          sessionId: this.sessionId,
+        }),
+      this.logger,
+    );
+  };
+
   join = async (data: Omit<JoinRequest, 'sessionId' | 'token'>) => {
     const joinRequest = JoinRequest.create({
       ...data,

packages/client/src/client-details.ts

@@ -2,9 +2,14 @@ import { ClientDetails, Device, OS, Sdk } from './gen/video/sfu/models/models';
 import { isReactNative } from './helpers/platforms';
 import { UAParser } from 'ua-parser-js';
 
+type WebRTCInfoType = {
+  version: string;
+};
+
 let sdkInfo: Sdk | undefined;
 let osInfo: OS | undefined;
 let deviceInfo: Device | undefined;
+let webRtcInfo: WebRTCInfoType | undefined;
 
 export const setSdkInfo = (info: Sdk) => {
   sdkInfo = info;
@@ -30,7 +35,19 @@ export const getDeviceInfo = () => {
   return deviceInfo;
 };
 
-export const getClientDetails = (): ClientDetails => {
+export const getWebRTCInfo = () => {
+  return webRtcInfo;
+};
+
+export const setWebRTCInfo = (info: WebRTCInfoType) => {
+  webRtcInfo = info;
+};
+
+export type LocalClientDetailsType = ClientDetails & {
+  webRTCInfo?: WebRTCInfoType;
+};
+
+export const getClientDetails = (): LocalClientDetailsType => {
   if (isReactNative()) {
     // Since RN doesn't support web, sharing browser info is not required
     return {

packages/client/src/gen/coordinator/index.ts

@@ -2899,6 +2899,12 @@ export interface JoinCallResponse {
    * @memberof JoinCallResponse
    */
   own_capabilities: Array<OwnCapability>;
+  /**
+   *
+   * @type {StatsOptions}
+   * @memberof JoinCallResponse
+   */
+  stats_options: StatsOptions;
 }
 /**
  *
@@ -4062,6 +4068,19 @@ export interface StartTranscriptionResponse {
    */
   duration: string;
 }
+/**
+ *
+ * @export
+ * @interface StatsOptions
+ */
+export interface StatsOptions {
+  /**
+   *
+   * @type {number}
+   * @memberof StatsOptions
+   */
+  reporting_interval_ms: number;
+}
 /**
  *
  * @export

packages/client/src/gen/video/sfu/signal_rpc/signal.client.ts

@@ -15,6 +15,8 @@ import type {
   ICETrickleResponse,
   SendAnswerRequest,
   SendAnswerResponse,
+  SendStatsRequest,
+  SendStatsResponse,
   SetPublisherRequest,
   SetPublisherResponse,
   UpdateMuteStatesRequest,
@@ -80,6 +82,13 @@ export interface ISignalServerClient {
     input: ICERestartRequest,
     options?: RpcOptions,
   ): UnaryCall<ICERestartRequest, ICERestartResponse>;
+  /**
+   * @generated from protobuf rpc: SendStats(stream.video.sfu.signal.SendStatsRequest) returns (stream.video.sfu.signal.SendStatsResponse);
+   */
+  sendStats(
+    input: SendStatsRequest,
+    options?: RpcOptions,
+  ): UnaryCall<SendStatsRequest, SendStatsResponse>;
 }
 /**
  * @generated from protobuf service stream.video.sfu.signal.SignalServer
@@ -197,4 +206,21 @@ export class SignalServerClient implements ISignalServerClient, ServiceInfo {
       input,
     );
   }
+  /**
+   * @generated from protobuf rpc: SendStats(stream.video.sfu.signal.SendStatsRequest) returns (stream.video.sfu.signal.SendStatsResponse);
+   */
+  sendStats(
+    input: SendStatsRequest,
+    options?: RpcOptions,
+  ): UnaryCall<SendStatsRequest, SendStatsResponse> {
+    const method = this.methods[6],
+      opt = this._transport.mergeOptions(options);
+    return stackIntercept<SendStatsRequest, SendStatsResponse>(
+      'unary',
+      this._transport,
+      method,
+      opt,
+      input,
+    );
+  }
 }