@agora-js/media 4.20.2 → 4.21.0

package/media.d.ts

@@ -56,6 +56,10 @@ export declare interface AgoraRTCCompatibility {
     supportWebRTCEncodedTransform: boolean;
     /** 是否支持WebRTC Insertable Stream */
     supportWebRTCInsertableStream: boolean;
+    /** 是否支持requestVideoFrameCallback, 用于计算卡顿率 */
+    supportRequestVideoFrameCallback: boolean;
+    /** 是否支持WebCrypto */
+    supportWebCrypto: boolean;
 }
 
 /**
@@ -331,7 +335,7 @@ export declare interface AudioEncoderConfiguration {
  * | -------- | --------------- |
  * |`"speech_low_quality"`|16 kHz 采样率，单声道，编码码率约 24 Kbps|
  * |`"speech_standard"`|32 kHz 采样率，单声道，编码码率约 24 Kbps|
- * |`"music_standard"`|48 kHz 采样率，单声道，编码码率约 40 Kbps|
+ * |`"music_standard"`|48 kHz 采样率，单声道，编码码率约 32 Kbps|
  * |`"standard_stereo"`|48 kHz 采样率，双声道，编码码率约 64 Kbps|
  * |`"high_quality"`|48 kHz 采样率，单声道， 编码码率约 128 Kbps|
  * |`"high_quality_stereo"`|48 kHz 采样率，双声道，编码码率约 192 Kbps|
@@ -349,12 +353,12 @@ export declare interface AudioEncoderConfiguration {
  *
  * | Audio Profile | Configurations |
  * | -------- | --------------- |
- * |`"speech_low_quality"`|Sample rate 16 kHz, mono, encoding rate 24 Kbps|
- * |`"speech_standard"`|Sample rate 32 kHz, mono, encoding rate 24 Kbps|
- * |`"music_standard"`|Sample rate 48 kHz, mono, encoding rate 40 Kbps|
- * |`"standard_stereo"`|Sample rate 48 kHz, stereo, encoding rate 64 Kbps|
- * |`"high_quality"`|Sample rate 48 kHz, mono, encoding rate 128 Kbps|
- * |`"high_quality_stereo"`|Sample rate 48 kHz, stereo, encoding rate 192 Kbps| Kbps.
+ * |`"speech_low_quality"`|Sample rate 16 kHz, mono, encoding bitrate 24 Kbps|
+ * |`"speech_standard"`|Sample rate 32 kHz, mono, encoding bitrate 24 Kbps|
+ * |`"music_standard"`|Sample rate 48 kHz, mono, encoding bitrate 32 Kbps|
+ * |`"standard_stereo"`|Sample rate 48 kHz, stereo, encoding bitrate 64 Kbps|
+ * |`"high_quality"`|Sample rate 48 kHz, mono, encoding bitrate 128 Kbps|
+ * |`"high_quality_stereo"`|Sample rate 48 kHz, stereo, encoding bitrate 192 Kbps| Kbps.
  * @public
  */
 export declare type AudioEncoderConfigurationPreset = keyof typeof AUDIO_ENCODER_CONFIG_SETTINGS;
@@ -730,7 +734,7 @@ export declare class CameraVideoTrack extends LocalVideoTrack implements ICamera
     _enabled: boolean;
     _deviceName: string;
     get __className__(): string;
-    constructor(track: MediaStreamTrack, config: CameraVideoTrackInitConfig, constraints: MediaTrackConstraints, scalabilityConfig?: SVCConfiguration, optimizationMode?: "motion" | "detail" | "balanced", trackId?: string);
+    constructor(track: MediaStreamTrack, config: CameraVideoTrackInitConfig, constraints: MediaTrackConstraints, scalabilityConfig?: SVCConfiguration, optimizationMode?: OptimizationMode | "balanced", trackId?: string);
     setDevice(deviceId: string | RequiredOnlyOneOf<{
         facingMode: VideoFacingModeEnum;
         deviceId: string;
@@ -832,7 +836,7 @@ export declare interface CameraVideoTrackInitConfig {
      *
      * > Note: This method is only supported on Chrome.
      */
-    optimizationMode?: "motion" | "detail";
+    optimizationMode?: OptimizationMode;
     /**
      * @ignore
      * @自从
@@ -1200,6 +1204,13 @@ export declare interface DenoiserStats {
     vl: number;
 }
 
+/**
+ * 是否支持Audio标签 setSinkId
+ * Firefox 116 以上也支持此接口，但是会出现回声问题
+ * 仅支持PC 端 Chrome / Edge，且不支持移动端
+ */
+export declare function detectSupportAudioElementSetSinkId(): boolean;
+
 /**
  * 音视频采集设备的信息。
  *
@@ -1430,6 +1441,18 @@ declare function event_source_state_change(currentState: AudioSourceState): void
  */
 declare function event_track_ended(): void;
 
+/**
+ * 媒体轨道有更新时触发。
+ * @param track 媒体轨道。详见 [MediaStreamTrack](https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamTrack)。
+ * @event
+ */
+/** @en
+ * Triggers when a media track is updated.
+ * @param track The media stream track. See [MediaStreamTrack](https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamTrack).
+ * @event
+ */
+export declare function event_track_updated(track: MediaStreamTrack): void;
+
 /**
  * 当前轨道的 `RTCRtpTransceiver` 实例更新回调。
  *
@@ -1614,6 +1637,14 @@ export declare function getAudioEncoderConfiguration(profile: AudioEncoderConfig
 
 export declare function getBitrateConstrainRange(width: number, height: number, frameRate: number, bitrateMin?: number, bitrateMax?: number): DoubleRange;
 
+/**
+ * get bitrate, use STANDARD_BITRATE to make sure the response
+ * @param width
+ * @param height
+ * @param fps
+ */
+export declare function getBitrateFromResAndFps(width: number, height: number, fps: number): Required<DoubleRange>;
+
 export declare function getCompatibility(): AgoraRTCCompatibility;
 
 export declare function getConstraintsFromCameraConfig(config: CameraVideoTrackInitConfig): MediaTrackConstraints;
@@ -1630,6 +1661,22 @@ export declare function getElectronScreenStreamByUserSelect(config: ScreenConstr
 
 export declare function getLocalStream(config: GetUserMediaConfig, id: string): Promise<MediaStream>;
 
+/**
+ * 获取初始配置
+ * 分辨率：track.getMediaStreamTrackSettings > 客户设置
+ * 帧率: track.getMediaStreamTrackSettings > 客户设置
+ * 码率： 客户设置 > 根据分辨率计算
+ *
+ * ⚠️：理论上不存在没有分辨率的情况，如果出现不足任何处理
+ */
+export declare const getOriginSenderConfig: (track: LocalVideoTrack) => {
+    frameRate: number;
+    bitrateMax: number;
+    bitrateMin: number;
+    scaleResolutionDownBy: number;
+    scale: number;
+};
+
 export declare function getScalabilityConfiguration(profile: SVCConfiguration | SVCConfigurationPreset): SVCConfiguration;
 
 export declare function getScreenEncoderConfiguration(profile: VideoEncoderConfiguration | ScreenEncoderConfigurationPreset | string): VideoEncoderConfiguration;
@@ -2166,6 +2213,15 @@ export declare interface ILocalDataChannel extends IDataChannel {
  * `LocalTrack` is the basic interface for local tracks, providing public methods for [LocalAudioTrack]{@link ILocalAudioTrack} and [LocalVideoTrack]{@link ILocalVideoTrack}.
  */
 export declare interface ILocalTrack extends ITrack {
+    /**
+     * @param event 事件名称。
+     * @param listener 详见 [track-updated]{@link event_track_updated}。
+     */
+    /** @en
+     * @param event The event name.
+     * @param listener See [track-updated]{@link event_track_updated}.
+     */
+    on(event: "track-updated", listener: typeof event_track_updated): void;
     /**
      * @param event 事件名称。
      * @param listener 详见 [track-ended]{@link event_track_ended}。
@@ -2319,6 +2375,15 @@ export declare interface ILocalTrack extends ITrack {
  * Inherited from `LocalVideoTrack`, [CameraVideoTrack]{@link ICameraVideoTrack} is an interface for the video captured by a local camera and adds several camera-related functions.
  */
 export declare interface ILocalVideoTrack extends ILocalTrack {
+    /**
+     * @param event 事件名称。
+     * @param listener 详见 [track-updated]{@link event_track_updated}。
+     */
+    /** @en
+     * @param event The event name.
+     * @param listener See [track-updated]{@link event_track_updated}.
+     */
+    on(event: "track-updated", listener: typeof event_track_updated): void;
     /** @internal */
     on(event: "beauty-effect-overload", listener: typeof event_beauty_effect_overload): void;
     /**
@@ -2806,7 +2871,7 @@ export declare interface IRemoteAudioTrack extends IRemoteTrack {
      *
      * 设置音频播放设备，比如扬声器。
      *
-     * > 该方法只支持桌面端的 Chrome 和 Edge 浏览器，其他浏览器调用将会抛出 `NOT_SUPPORTED` 错误。
+     * > 该方法只支持桌面端的 Chrome 和 Edge 浏览器。如果在其他浏览器上需要先设置`RESTRICTION_SET_PLAYBACK_DEVICE`为`false`，直接调用将会抛出 `NOT_SUPPORTED` 错误。
      * @param deviceId 设备 ID，可以通过 [[getPlaybackDevices]] 方法获取。
      */
     /** @en
@@ -2815,7 +2880,7 @@ export declare interface IRemoteAudioTrack extends IRemoteTrack {
      *
      * Sets the audio playback device, for example, the speaker.
      *
-     * > This method supports Chrome and Edge on desktop devices only. Other browsers throw a `NOT_SUPPORTED` error when calling this method.
+     * > > This method is only supported on desktop Chrome and Edge browsers. If you call it on other browsers, you need to set `RESTRICTION_SET_PLAYBACK_DEVICE` to `false` first, and calling it directly will throw a `NOT_SUPPORTED` error.
      * @param deviceId Device ID, which can be retrieved by calling [[getPlaybackDevices]].
      */
     setPlaybackDevice(deviceId: string): Promise<void>;
@@ -2961,6 +3026,15 @@ export declare interface IRemoteDataChannel extends IDataChannel {
  * `RemoteTrack` is the basic interface for remote tracks, providing public methods for [RemoteAudioTrack]{@link IRemoteAudioTrack} and [RemoteVideoTrack]{@link IRemoteVideoTrack}.
  */
 export declare interface IRemoteTrack extends ITrack {
+    /**
+     * @param event 事件名称。
+     * @param listener 详见 [track-updated]{@link event_track_updated}。
+     */
+    /** @en
+     * @param event The event name.
+     * @param listener See [track-updated]{@link event_track_updated}.
+     */
+    on(event: "track-updated", listener: typeof event_track_updated): void;
     /**
      * @param event 事件名称。
      * @param listener 详见 [first-frame-decoded]{@link event_first_frame_decoded}。
@@ -3020,6 +3094,15 @@ export declare interface IRemoteTrack extends ITrack {
  * You can get create a remote video track by the [AgoraRTCRemoteUser.videoTrack]{@link IAgoraRTCRemoteUser.videoTrack} object after calling [subscribe]{@link IAgoraRTCClient.subscribe}.
  */
 export declare interface IRemoteVideoTrack extends IRemoteTrack {
+    /**
+     * @param event 事件名称。
+     * @param listener 详见 [track-updated]{@link event_track_updated}。
+     */
+    /** @en
+     * @param event The event name.
+     * @param listener See [track-updated]{@link event_track_updated}.
+     */
+    on(event: "track-updated", listener: typeof event_track_updated): void;
     /**
      * @param event 事件名称。
      * @param listener 详见 [video-state-changed]{@link event_video_state_changed}。
@@ -3128,7 +3211,7 @@ export declare interface IRemoteVideoTrack extends IRemoteTrack {
      * 调用 `remoteVideoTrack.play` 后 SDK 会创建 [HTML `<video>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video) 标签用于播放视频轨道。当 `remoteVideoTrack.isPlaying` 为 `true` 却看不到图像时，你可调用该方法进行问题排查。
      *
      * @return [[CheckVideoVisibleResult]] 对象。如果该方法返回 `undefined`，可能为以下原因：
-     * - `localRemoteTrack.isPlaying` 为 `false`。
+     * - `remoteVideoTrack.isPlaying` 为 `false`。
      * - `<video>` 标签不存在。
      * - `<video>` 标签不是通过 `play` 方法调用产生的。
      */
@@ -3141,7 +3224,7 @@ export declare interface IRemoteVideoTrack extends IRemoteTrack {
      * After you call `remoteVideoTrack.play`, the SDK creates an [`<video>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video) tag for playing video tracks. When `remoteVideoTrack.isPlaying` is `true` but you cannot see any video, call this method to check whether the `<video>` tag is visible or not and learn the reason when the `<video>` tag is invisible.
      *
      * @returns The [[CheckVideoVisibleResult]] object. If this method returns `undefined`, it may be due to the following reasons:
-     * - `localRemoteTrack.isPlaying` is `false`.
+     * - `remoteVideoTrack.isPlaying` is `false`.
      * - The `<video>` tag does not exist.
      * - The `<video>` tag is not created by calling the `play` method.
      */
@@ -3478,7 +3561,7 @@ export declare abstract class LocalTrack extends Track implements ILocalTrack {
     protected processor?: IBaseProcessor;
     protected abstract _processorContext: IProcessorContext | undefined;
     protected get processorContext(): IProcessorContext | undefined;
-    abstract processorDestination: IBaseProcessor;
+    abstract get processorDestination(): IBaseProcessor;
     constructor(track: MediaStreamTrack, trackId?: string);
     abstract getStats(): LocalVideoTrackStats | LocalAudioTrackStats;
     abstract setMuted(enabled: boolean): Promise<void>;
@@ -3518,21 +3601,24 @@ export declare class LocalVideoTrack extends LocalTrack implements ILocalVideoTr
     private _clearPreviousVideoVisibleStatus;
     _encoderConfig?: Partial<VideoEncoderConfiguration>;
     _scalabilityMode?: SVCConfiguration;
-    _optimizationMode?: "motion" | "detail" | "balanced";
-    _videoHeight?: number;
-    _videoWidth?: number;
+    _optimizationMode?: OptimizationMode | "balanced";
+    private _videoHeight?;
+    private _videoWidth?;
+    get videoHeight(): number | undefined;
+    get videoWidth(): number | undefined;
     _forceBitrateLimit?: {
         max_bitrate: number;
         min_bitrate: number;
     };
     _enabled: boolean;
     get isPlaying(): boolean;
-    processorDestination: VideoProcessorDestination;
+    protected _processorDestination: VideoProcessorDestination;
+    get processorDestination(): VideoProcessorDestination;
     protected _processorContext: VideoProcessorContext;
     protected get processorContext(): VideoProcessorContext;
     protected set processorContext(ctx: VideoProcessorContext);
     get __className__(): string;
-    constructor(track: MediaStreamTrack, encoderConfig?: Partial<VideoEncoderConfiguration>, scalabilityConfig?: SVCConfiguration, optimizationMode?: "motion" | "detail" | "balanced", trackId?: string, hints?: TrackHint[]);
+    constructor(track: MediaStreamTrack, encoderConfig?: Partial<VideoEncoderConfiguration>, scalabilityConfig?: SVCConfiguration, optimizationMode?: OptimizationMode | "balanced", trackId?: string, hints?: TrackHint[]);
     play(element: HTMLElement | HTMLVideoElement | string, config?: VideoPlayerConfig): void;
     stop(): void;
     setEnabled(enabled: boolean, skipChangeState?: boolean): Promise<void>;
@@ -3546,7 +3632,7 @@ export declare class LocalVideoTrack extends LocalTrack implements ILocalVideoTr
         max_bitrate: number;
         min_bitrate: number;
     }): Promise<void>;
-    setOptimizationMode(mode: "motion" | "detail" | "balanced"): Promise<void>;
+    setOptimizationMode(mode: OptimizationMode | "balanced"): Promise<void>;
     setScalabiltyMode(mode: SVCConfiguration): void;
     updateMediaStreamTrackResolution(): void;
     protected _updatePlayerSource(): void;
@@ -3936,6 +4022,8 @@ export declare class MixingAudioTrack extends LocalAudioTrack {
     _updateRtpTransceiver(transceiver: RTCRtpTransceiver): void;
 }
 
+export declare type OptimizationMode = "motion" | "detail";
+
 /**
  * @internal
  */
@@ -4751,6 +4839,12 @@ export declare interface ScreenVideoTrackInitConfig {
     systemAudio?: "include" | "exclude";
 }
 
+export declare type SenderConfig = {
+    bitrateMax: number;
+    bitrateMin: number;
+    scaleResolutionDownBy: number;
+};
+
 /**
  * 将节点输入的 AudioBuffer 返回，将节点输出的 AudioBuffer 设置成 silence
  */
@@ -4889,7 +4983,9 @@ export declare abstract class Track extends EventEmitter implements ITrack {
     /** 原始的 Track 对象，来自于采集/用户传入/订阅返回 */
     _originMediaStreamTrack: MediaStreamTrack;
     /** 用于播放和发布的 Track 对象，可能被各种模块修改，一般来说等于 `_originMediaStreamTrack` */
-    _mediaStreamTrack: MediaStreamTrack;
+    mediaStreamTrack: MediaStreamTrack;
+    set _mediaStreamTrack(track: MediaStreamTrack);
+    get _mediaStreamTrack(): MediaStreamTrack;
     /** 提供给外部插件以同步数据 */
     _external: ExternalMethods;
     constructor(track: MediaStreamTrack, trackId?: string);
@@ -4907,7 +5003,8 @@ export declare abstract class Track extends EventEmitter implements ITrack {
 export declare enum TrackEvents {
     TRANSCEIVER_UPDATED = "transceiver-updated",
     SEI_TO_SEND = "sei-to-send",
-    SEI_RECEIVED = "sei-received"
+    SEI_RECEIVED = "sei-received",
+    TRACK_UPDATED = "track-updated"
 }
 
 /**
@@ -4923,7 +5020,7 @@ export declare enum TrackHint {
 }
 
 export declare enum TrackInternalEvent {
-    NEED_RENEGOTIATE = "@need_renegotiate",
+    NEED_RENEGOTIATE = "@need_renegotiate",//deprecated
     NEED_REPLACE_TRACK = "@need_replace_track",
     NEED_REPLACE_MIXING_TRACK = "@need_replace_mixing_track",
     NEED_CLOSE = "@need_close",
@@ -4934,8 +5031,9 @@ export declare enum TrackInternalEvent {
     GET_STATS = "@get_stats",
     GET_RTC_STATS = "@get_rtc_stats",
     GET_LOW_VIDEO_TRACK = "@get_low_video_track",
-    NEED_RESET_REMOTE_SDP = "@need_reset_remote_sdp",
+    NEED_RESET_REMOTE_SDP = "@need_reset_remote_sdp",//deprecated
     NEED_UPDATE_VIDEO_ENCODER = "@need_update_video_encoder",
+    NEED_UPDATE_VIDEO_SEND_PARAMETERS = "@need_update_video_send_parameters",
     NEED_MUTE_TRACK = "@need_mute_track",
     NEED_UNMUTE_TRACK = "@need_unmute_track"
 }
@@ -5044,50 +5142,50 @@ export declare interface VideoEncoderConfiguration {
  *
  * 下表列出了 SDK 所有内置的视频属性配置，SDK 默认使用 `"480p_1"`。
  *
- * | 视频属性 | 分辨率（宽×高） | 帧率（fps） | 码率（Kbps） | Chrome | Firefox | Safari |
- * | -------- | --------------- | ----------- | ------------ | ------ | ------- | ------ |
- * | 120p     | 160 × 120       | 15          | 65           | ✓      |         |        |
- * | 120p_1   | 160 × 120       | 15          | 65           | ✓      |         |        |
- * | 120p_3   | 120 × 120       | 15          | 50           | ✓      |         |        |
- * | 180p     | 320 × 180       | 15          | 140          | ✓      |         |        |
- * | 180p_1   | 320 × 180       | 15          | 140          | ✓      |         |        |
- * | 180p_3   | 180 × 180       | 15          | 100          | ✓      |         |        |
- * | 180p_4   | 240 × 180       | 15          | 120          | ✓      |         |        |
- * | 240p     | 320 × 240       | 15          | 200          | ✓      |         |        |
- * | 240p_1   | 320 × 240       | 15          | 200          | ✓      |         |        |
- * | 240p_3   | 240 × 240       | 15          | 140          | ✓      |         |        |
- * | 240p_4   | 424 × 240       | 15          | 220          | ✓      |         |        |
- * | 360p     | 640 × 360       | 15          | 400          | ✓      |         |        |
- * | 360p_1   | 640 × 360       | 15          | 400          | ✓      |         |        |
- * | 360p_3   | 360 × 360       | 15          | 260          | ✓      |         |        |
- * | 360p_4   | 640 × 360       | 30          | 600          | ✓      |         |        |
- * | 360p_6   | 360 × 360       | 30          | 400          | ✓      |         |        |
- * | 360p_7   | 480 × 360       | 15          | 320          | ✓      |         |        |
- * | 360p_8   | 480 × 360       | 30          | 490          | ✓      |         |        |
- * | 360p_9   | 640 × 360       | 15          | 800          | ✓      |         |        |
- * | 360p_10  | 640 × 360       | 24          | 800          | ✓      |         |        |
- * | 360p_11  | 640 × 360       | 24          | 1000         | ✓      |         |        |
- * | 480p     | 640 × 480       | 15          | 500          | ✓      | ✓       | ✓      |
- * | 480p_1   | 640 × 480       | 15          | 500          | ✓      | ✓       | ✓      |
- * | 480p_2   | 640 × 480       | 30          | 1000         | ✓      | ✓       | ✓      |
- * | 480p_3   | 480 × 480       | 15          | 400          | ✓      | ✓       | ✓      |
- * | 480p_4   | 640 × 480       | 30          | 750          | ✓      | ✓       | ✓      |
- * | 480p_6   | 480 × 480       | 30          | 600          | ✓      | ✓       | ✓      |
- * | 480p_8   | 848 × 480       | 15          | 610          | ✓      | ✓       | ✓      |
- * | 480p_9   | 848 × 480       | 30          | 930          | ✓      | ✓       | ✓      |
- * | 480p_10  | 640 × 480       | 10          | 400          | ✓      | ✓       | ✓      |
- * | 720p     | 1280 × 720      | 15          | 1130         | ✓      | ✓       | ✓      |
- * | 720p_1   | 1280 × 720      | 15          | 1130         | ✓      | ✓       | ✓      |
- * | 720p_2   | 1280 × 720      | 30          | 2000         | ✓      | ✓       | ✓      |
- * | 720p_3   | 1280 × 720      | 30          | 1710         | ✓      | ✓       | ✓      |
- * | 720p_auto <sup>①</sup>  | 1280 × 720       | 30          | 3000        | ✓      | ✓       | ✓      |
- * | 720p_5   | 960 × 720       | 15          | 910          | ✓      | ✓       | ✓      |
- * | 720p_6   | 960 × 720       | 30          | 1380         | ✓      | ✓       | ✓      |
- * | 1080p    | 1920 × 1080     | 15          | 2080         | ✓      |         | ✓      |
- * | 1080p_1  | 1920 × 1080     | 15          | 2080         | ✓      |         | ✓      |
- * | 1080p_2  | 1920 × 1080     | 30          | 3000         | ✓      |         | ✓      |
- * | 1080p_3  | 1920 × 1080     | 30          | 3150         | ✓      |         | ✓      |
- * | 1080p_5  | 1920 × 1080     | 60          | 4780         | ✓      |         | ✓      |
+ * | 视频属性 | 分辨率（宽×高） | 帧率（fps） | Chrome | Firefox | Safari |
+ * | -------- | --------------- | ----------- | ------ | ------- | ------ |
+ * | 120p     | 160 × 120       | 15          | ✓      |         |        |
+ * | 120p_1   | 160 × 120       | 15          | ✓      |         |        |
+ * | 120p_3   | 120 × 120       | 15          | ✓      |         |        |
+ * | 180p     | 320 × 180       | 15          | ✓      |         |        |
+ * | 180p_1   | 320 × 180       | 15          | ✓      |         |        |
+ * | 180p_3   | 180 × 180       | 15          | ✓      |         |        |
+ * | 180p_4   | 240 × 180       | 15          | ✓      |         |        |
+ * | 240p     | 320 × 240       | 15          | ✓      |         |        |
+ * | 240p_1   | 320 × 240       | 15          | ✓      |         |        |
+ * | 240p_3   | 240 × 240       | 15          | ✓      |         |        |
+ * | 240p_4   | 424 × 240       | 15          | ✓      |         |        |
+ * | 360p     | 640 × 360       | 15          | ✓      |         |        |
+ * | 360p_1   | 640 × 360       | 15          | ✓      |         |        |
+ * | 360p_3   | 360 × 360       | 15          | ✓      |         |        |
+ * | 360p_4   | 640 × 360       | 30          | ✓      |         |        |
+ * | 360p_6   | 360 × 360       | 30          | ✓      |         |        |
+ * | 360p_7   | 480 × 360       | 15          | ✓      |         |        |
+ * | 360p_8   | 480 × 360       | 30          | ✓      |         |        |
+ * | 360p_9   | 640 × 360       | 15          | ✓      |         |        |
+ * | 360p_10  | 640 × 360       | 24          | ✓      |         |        |
+ * | 360p_11  | 640 × 360       | 24          | ✓      |         |        |
+ * | 480p     | 640 × 480       | 15          | ✓      | ✓       | ✓      |
+ * | 480p_1   | 640 × 480       | 15          | ✓      | ✓       | ✓      |
+ * | 480p_2   | 640 × 480       | 30          | ✓      | ✓       | ✓      |
+ * | 480p_3   | 480 × 480       | 15          | ✓      | ✓       | ✓      |
+ * | 480p_4   | 640 × 480       | 30          | ✓      | ✓       | ✓      |
+ * | 480p_6   | 480 × 480       | 30          | ✓      | ✓       | ✓      |
+ * | 480p_8   | 848 × 480       | 15          | ✓      | ✓       | ✓      |
+ * | 480p_9   | 848 × 480       | 30          | ✓      | ✓       | ✓      |
+ * | 480p_10  | 640 × 480       | 10          | ✓      | ✓       | ✓      |
+ * | 720p     | 1280 × 720      | 15          | ✓      | ✓       | ✓      |
+ * | 720p_1   | 1280 × 720      | 15          | ✓      | ✓       | ✓      |
+ * | 720p_2   | 1280 × 720      | 30          | ✓      | ✓       | ✓      |
+ * | 720p_3   | 1280 × 720      | 30          | ✓      | ✓       | ✓      |
+ * | 720p_auto <sup>①</sup>  | 1280 × 720       | 30          |✓      | ✓       | ✓      |
+ * | 720p_5   | 960 × 720       | 15          | ✓      | ✓       | ✓      |
+ * | 720p_6   | 960 × 720       | 30          | ✓      | ✓       | ✓      |
+ * | 1080p    | 1920 × 1080     | 15          | ✓      |         | ✓      |
+ * | 1080p_1  | 1920 × 1080     | 15          | ✓      |         | ✓      |
+ * | 1080p_2  | 1920 × 1080     | 30          | ✓      |         | ✓      |
+ * | 1080p_3  | 1920 × 1080     | 30          | ✓      |         | ✓      |
+ * | 1080p_5  | 1920 × 1080     | 60          | ✓      |         | ✓      |
  *
  * > <sup>①</sup> `"720p_auto"` 仅推荐在 Safari 上设置，用于确保能够动态调整编码分辨率，详见[发版说明](https://doc.shengwang.cn/doc/rtc/javascript/overview/release-notes)。
  *
@@ -5101,50 +5199,50 @@ export declare interface VideoEncoderConfiguration {
  *
  * The following table lists all the preset video profiles. The SDK uses `"480p_1"` by default.
  *
- * | Video Profile | Resolution (Width×Height) | Frame Rate (fps) | Bitrate (Kbps） | Chrome | Firefox | Safari |
- * | -------- | --------------- | ----------- | ------------ | ------ | ------- | ------ |
- * | 120p     | 160 × 120       | 15          | 65           | ✓      |         |        |
- * | 120p_1   | 160 × 120       | 15          | 65           | ✓      |         |        |
- * | 120p_3   | 120 × 120       | 15          | 50           | ✓      |         |        |
- * | 180p     | 320 × 180       | 15          | 140          | ✓      |         |        |
- * | 180p_1   | 320 × 180       | 15          | 140          | ✓      |         |        |
- * | 180p_3   | 180 × 180       | 15          | 100          | ✓      |         |        |
- * | 180p_4   | 240 × 180       | 15          | 120          | ✓      |         |        |
- * | 240p     | 320 × 240       | 15          | 200          | ✓      |         |        |
- * | 240p_1   | 320 × 240       | 15          | 200          | ✓      |         |        |
- * | 240p_3   | 240 × 240       | 15          | 140          | ✓      |         |        |
- * | 240p_4   | 424 × 240       | 15          | 220          | ✓      |         |        |
- * | 360p     | 640 × 360       | 15          | 400          | ✓      |         |        |
- * | 360p_1   | 640 × 360       | 15          | 400          | ✓      |         |        |
- * | 360p_3   | 360 × 360       | 15          | 260          | ✓      |         |        |
- * | 360p_4   | 640 × 360       | 30          | 600          | ✓      |         |        |
- * | 360p_6   | 360 × 360       | 30          | 400          | ✓      |         |        |
- * | 360p_7   | 480 × 360       | 15          | 320          | ✓      |         |        |
- * | 360p_8   | 480 × 360       | 30          | 490          | ✓      |         |        |
- * | 360p_9   | 640 × 360       | 15          | 800          | ✓      |         |        |
- * | 360p_10  | 640 × 360       | 24          | 800          | ✓      |         |        |
- * | 360p_11  | 640 × 360       | 24          | 1000         | ✓      |         |        |
- * | 480p     | 640 × 480       | 15          | 500          | ✓      | ✓       | ✓      |
- * | 480p_1   | 640 × 480       | 15          | 500          | ✓      | ✓       | ✓      |
- * | 480p_2   | 640 × 480       | 30          | 1000         | ✓      | ✓       | ✓      |
- * | 480p_3   | 480 × 480       | 15          | 400          | ✓      | ✓       | ✓      |
- * | 480p_4   | 640 × 480       | 30          | 750          | ✓      | ✓       | ✓      |
- * | 480p_6   | 480 × 480       | 30          | 600          | ✓      | ✓       | ✓      |
- * | 480p_8   | 848 × 480       | 15          | 610          | ✓      | ✓       | ✓      |
- * | 480p_9   | 848 × 480       | 30          | 930          | ✓      | ✓       | ✓      |
- * | 480p_10  | 640 × 480       | 10          | 400          | ✓      | ✓       | ✓      |
- * | 720p     | 1280 × 720      | 15          | 1130         | ✓      | ✓       | ✓      |
- * | 720p_1   | 1280 × 720      | 15          | 1130         | ✓      | ✓       | ✓      |
- * | 720p_2   | 1280 × 720      | 30          | 2000         | ✓      | ✓       | ✓      |
- * | 720p_3   | 1280 × 720      | 30          | 1710         | ✓      | ✓       | ✓      |
- * | 720p_auto <sup>①</sup>  | 1280 × 720       | 30          | 3000        | ✓      | ✓       | ✓      |
- * | 720p_5   | 960 × 720       | 15          | 910          | ✓      | ✓       | ✓      |
- * | 720p_6   | 960 × 720       | 30          | 1380         | ✓      | ✓       | ✓      |
- * | 1080p    | 1920 × 1080     | 15          | 2080         | ✓      |         | ✓      |
- * | 1080p_1  | 1920 × 1080     | 15          | 2080         | ✓      |         | ✓      |
- * | 1080p_2  | 1920 × 1080     | 30          | 3000         | ✓      |         | ✓      |
- * | 1080p_3  | 1920 × 1080     | 30          | 3150         | ✓      |         | ✓      |
- * | 1080p_5  | 1920 × 1080     | 60          | 4780         | ✓      |         | ✓      |
+ * | Video Profile | Resolution (Width×Height) | Frame Rate (fps) | Chrome | Firefox | Safari |
+ * | -------- | --------------- | ----------- | ------ | ------- | ------ |
+ * | 120p     | 160 × 120       | 15          | ✓      |         |        |
+ * | 120p_1   | 160 × 120       | 15          | ✓      |         |        |
+ * | 120p_3   | 120 × 120       | 15          | ✓      |         |        |
+ * | 180p     | 320 × 180       | 15          | ✓      |         |        |
+ * | 180p_1   | 320 × 180       | 15          | ✓      |         |        |
+ * | 180p_3   | 180 × 180       | 15          | ✓      |         |        |
+ * | 180p_4   | 240 × 180       | 15          | ✓      |         |        |
+ * | 240p     | 320 × 240       | 15          | ✓      |         |        |
+ * | 240p_1   | 320 × 240       | 15          | ✓      |         |        |
+ * | 240p_3   | 240 × 240       | 15          | ✓      |         |        |
+ * | 240p_4   | 424 × 240       | 15          | ✓      |         |        |
+ * | 360p     | 640 × 360       | 15          | ✓      |         |        |
+ * | 360p_1   | 640 × 360       | 15          | ✓      |         |        |
+ * | 360p_3   | 360 × 360       | 15          | ✓      |         |        |
+ * | 360p_4   | 640 × 360       | 30          | ✓      |         |        |
+ * | 360p_6   | 360 × 360       | 30          | ✓      |         |        |
+ * | 360p_7   | 480 × 360       | 15          | ✓      |         |        |
+ * | 360p_8   | 480 × 360       | 30          | ✓      |         |        |
+ * | 360p_9   | 640 × 360       | 15          | ✓      |         |        |
+ * | 360p_10  | 640 × 360       | 24          | ✓      |         |        |
+ * | 360p_11  | 640 × 360       | 24          | ✓      |         |        |
+ * | 480p     | 640 × 480       | 15          | ✓      | ✓       | ✓      |
+ * | 480p_1   | 640 × 480       | 15          | ✓      | ✓       | ✓      |
+ * | 480p_2   | 640 × 480       | 30          | ✓      | ✓       | ✓      |
+ * | 480p_3   | 480 × 480       | 15          | ✓      | ✓       | ✓      |
+ * | 480p_4   | 640 × 480       | 30          | ✓      | ✓       | ✓      |
+ * | 480p_6   | 480 × 480       | 30          | ✓      | ✓       | ✓      |
+ * | 480p_8   | 848 × 480       | 15          | ✓      | ✓       | ✓      |
+ * | 480p_9   | 848 × 480       | 30          | ✓      | ✓       | ✓      |
+ * | 480p_10  | 640 × 480       | 10          | ✓      | ✓       | ✓      |
+ * | 720p     | 1280 × 720      | 15          | ✓      | ✓       | ✓      |
+ * | 720p_1   | 1280 × 720      | 15          | ✓      | ✓       | ✓      |
+ * | 720p_2   | 1280 × 720      | 30          | ✓      | ✓       | ✓      |
+ * | 720p_3   | 1280 × 720      | 30          | ✓      | ✓       | ✓      |
+ * | 720p_auto <sup>①</sup>  | 1280 × 720       | 30          | ✓      | ✓       | ✓      |
+ * | 720p_5   | 960 × 720       | 15          | ✓      | ✓       | ✓      |
+ * | 720p_6   | 960 × 720       | 30          | ✓      | ✓       | ✓      |
+ * | 1080p    | 1920 × 1080     | 15          | ✓      |         | ✓      |
+ * | 1080p_1  | 1920 × 1080     | 15          | ✓      |         | ✓      |
+ * | 1080p_2  | 1920 × 1080     | 30          | ✓      |         | ✓      |
+ * | 1080p_3  | 1920 × 1080     | 30          | ✓      |         | ✓      |
+ * | 1080p_5  | 1920 × 1080     | 60          | ✓      |         | ✓      |
  *
  * > <sup>①</sup> `"720p_auto"` is only recommended to be set on Safari to ensure dynamic adjustment of the encoding resolution. For details, see the release notes.
  */
@@ -5171,6 +5269,8 @@ declare class VideoPlayer {
     protected videoTrack?: MediaStreamTrack;
     protected videoElement: HTMLVideoElement;
     protected cacheVideoElement?: HTMLVideoElement;
+    private renderStats?;
+    get rendFrameRate(): number;
     get videoElementStatus(): MediaElementStatus;
     set videoElementStatus(status: MediaElementStatus);
     get videoState(): VideoState;

package/package.json

@@ -1,10 +1,10 @@
 {
 	"name": "@agora-js/media",
-	"version": "4.20.2",
+	"version": "4.21.0",
 	"description": "media module across @agora-js packages",
 	"main": "AgoraRTC_N-media.js",
 	"module": "AgoraRTC_N-media.esm.mjs",
-	"types": "media.d.ts",
+	"types": "rtc-sdk-media_en.d.ts",
 	"declaration": true,
 	"author": "Agora WebRTC Team",
 	"keywords": [
@@ -23,9 +23,9 @@
 	"homepage": "https://api-ref.agora.io/en/voice-sdk/web/4.x/index.html",
 	"peerDependencies": {},
 	"dependencies": {
-		"@agora-js/shared": "4.20.2",
-		"@agora-js/report": "4.20.2",
-		"axios": "^1.6.7",
+		"@agora-js/shared": "4.21.0",
+		"@agora-js/report": "4.21.0",
+		"axios": "^1.6.8",
 		"agora-rte-extension": "^1.2.4",
 		"webrtc-adapter": "8.2.0",
 		"pako": "^2.1.0"