trtc-electron-sdk
Version:
trtc electron sdk
128 lines (127 loc) • 5.17 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.videoRenderFPSMonitor = void 0;
const events_1 = require("events");
const logger_1 = __importDefault(require("../logger"));
/**
* @class RenderFPSMonitor
*/
class VideoRenderFPSMonitor {
constructor() {
this.logPrefix = '[RenderFPSMonitor]';
this.emitter = new events_1.EventEmitter();
this.nextAnimationFrame = 0;
this.lastTimestamp = 0;
this.refreshCount = 0;
this.pageRefreshFPS = 0;
this.lastPageRefreshFPS = 60;
this.videoRenderFPS = 0;
this.lastVideoRenderFPS = -1;
this.statisticDuration = 2000;
this.statisticPageRefreshFPS = this.statisticPageRefreshFPS.bind(this);
this.onVisibilityChange = this.onVisibilityChange.bind(this);
this.initPageRefreshFPSStatistic();
document.addEventListener('visibilitychange', this.onVisibilityChange);
}
initPageRefreshFPSStatistic() {
if (window.requestAnimationFrame) {
this.nextAnimationFrame = window.requestAnimationFrame(this.statisticPageRefreshFPS);
}
}
statisticPageRefreshFPS(timestamp) {
if (this.lastTimestamp === 0) {
this.lastTimestamp = timestamp;
}
this.refreshCount++;
const duration = timestamp - this.lastTimestamp;
if (duration >= this.statisticDuration) {
this.lastPageRefreshFPS = this.pageRefreshFPS;
this.pageRefreshFPS = Math.round(this.refreshCount * 1000 / duration);
setTimeout(() => {
this.statisticVideoRenderFPS();
}, 0);
this.lastTimestamp = timestamp;
this.refreshCount = 0;
}
this.nextAnimationFrame = window.requestAnimationFrame(this.statisticPageRefreshFPS);
}
/**
* 规则：
* 页面刷新帧率低于 10 时，设置渲染帧率为 5
* 页面刷新帧率低于 20 时，设置渲染帧率为 15
* 页面刷新帧率低于 30 时，设置渲染帧率为 25
* 页面刷新帧率高于 30 时，设置渲染帧率为 -1，负数表示关闭渲染帧率限制
* 页面刷新帧率从低于 10 到 30+ 时，持续 2 秒后，设置渲染帧率为 15
* 页面刷新帧率从低于 20 到 30+ 时，持续 2 秒后，设置渲染帧率为 25
* 页面刷新帧率从低于 30 到 30+ 时，持续 2 秒后，设置渲染帧率为 -1，负数表示关闭渲染帧率限制
*/
statisticVideoRenderFPS() {
if (this.pageRefreshFPS <= 10) {
this.videoRenderFPS = this.pageRefreshFPS < 5 ? this.pageRefreshFPS : 5;
}
else if (this.pageRefreshFPS <= 20) {
this.videoRenderFPS = this.pageRefreshFPS < 15 ? this.pageRefreshFPS : 15;
}
else if (this.pageRefreshFPS <= 30) {
this.videoRenderFPS = this.pageRefreshFPS < 25 ? this.pageRefreshFPS : 25;
}
else if (this.pageRefreshFPS > 30 && this.lastPageRefreshFPS <= 10) {
this.videoRenderFPS = 15;
}
else if (this.pageRefreshFPS > 30 && this.lastPageRefreshFPS <= 20) {
this.videoRenderFPS = 25;
}
else {
this.videoRenderFPS = -1;
}
if (this.lastVideoRenderFPS !== this.videoRenderFPS) {
this.lastVideoRenderFPS = this.videoRenderFPS;
this.notifyFPS();
}
}
onVisibilityChange() {
if (document.hidden) {
logger_1.default.info(`${this.logPrefix} document hidden`);
this.videoRenderFPS = 1;
this.pageRefreshFPS = 1;
}
else {
logger_1.default.info(`${this.logPrefix} document show`);
this.videoRenderFPS = 30;
this.pageRefreshFPS = 30;
}
this.lastVideoRenderFPS = this.videoRenderFPS;
this.lastTimestamp = 0;
this.refreshCount = 0;
this.notifyFPS();
}
notifyFPS() {
logger_1.default.debug(`${this.logPrefix} pageRefreshFPS:${this.pageRefreshFPS} videoRenderFPS: ${this.videoRenderFPS}`);
this.emit('videoRenderFPS', {
pageFPS: this.pageRefreshFPS,
videoFPS: this.videoRenderFPS,
});
}
destroy() {
if (this.nextAnimationFrame) {
window.cancelAnimationFrame(this.nextAnimationFrame);
this.nextAnimationFrame = 0;
}
this.emitter.removeAllListeners();
document.removeEventListener('visibilitychange', this.onVisibilityChange);
}
on(event, listener) {
this.emitter.on(event, listener);
}
off(event, listener) {
this.emitter.off(event, listener);
}
emit(event, ...args) {
this.emitter.emit(event, ...args);
}
}
exports.videoRenderFPSMonitor = new VideoRenderFPSMonitor();
exports.default = VideoRenderFPSMonitor;