WebRtc_QingGan/VIDEO_PLAYBACK_FIX.md

3.6 KiB
Raw Permalink Blame History

默认视频播放问题修复

问题描述

在性能优化过程中,发现默认视频 d-3s.mp4s-1.mp4 没有正常播放的问题。

问题原因

  1. 缓存策略过于激进: 将缓存数量从3个减少到2个导致重要视频被过早清理
  2. 缺少默认视频启动调用: 在 startCall() 方法中没有调用 startDefaultVideoStream()
  3. 重要视频保护不足: 没有区分重要视频和普通视频的清理策略

修复措施

1. 优化缓存策略

// 修复前
if (this.videoStreams.size >= 2) { // 缓存数量过少
    const firstKey = this.videoStreams.keys().next().value;
    // 直接清理第一个视频,可能包括重要视频
}

// 修复后
if (this.videoStreams.size >= 4) { // 增加缓存数量
    const importantVideos = [this.defaultVideo, 's-1.mp4', 'd-3s.mp4'];
    const videoToRemove = cachedVideos.find(video => !importantVideos.includes(video));
    // 只清理非重要视频
}

2. 添加默认视频启动调用

async startCall() {
    // ... 其他代码 ...
    
    // 启动默认视频流
    await this.startDefaultVideoStream();
    
    // 通知服务器通话开始
    this.socket.emit('call-started');
}

3. 改进预加载策略

async preloadCommonVideos() {
    const videosToPreload = new Set([]);
    
    // 添加重要视频(默认视频和常用视频)
    videosToPreload.add(this.defaultVideo); // 默认视频
    videosToPreload.add('s-1.mp4'); // 常用视频
    videosToPreload.add('d-3s.mp4'); // 默认视频的另一个版本
    
    // 添加视频映射中的所有视频
    Object.values(this.videoMapping).forEach(video => {
        videosToPreload.add(video);
    });
}

4. 优化性能监控清理

// 如果缓存过多,清理一些(但保护重要视频)
if (this.videoStreams.size > 5) {
    const importantVideos = [this.defaultVideo, 's-1.mp4', 'd-3s.mp4'];
    
    // 只清理非重要视频
    const videosToRemove = cachedVideos.filter(video => !importantVideos.includes(video));
    videosToRemove.slice(0, 2).forEach(key => {
        this.cleanupVideoResources(key);
    });
}

5. 调整性能测试阈值

// 检查视频流数量
if (testResults.metrics.videoStreamsCount > 5) { // 从3增加到5
    // 报告问题
}

// 检查动画帧数量
if (testResults.metrics.animationFramesCount > 3) { // 从2增加到3
    // 报告问题
}

重要视频列表

以下视频被标记为重要视频,不会被自动清理:

  • d-3s.mp4 - 默认视频
  • s-1.mp4 - 常用视频
  • 当前默认视频(this.defaultVideo

测试功能

添加了测试功能来验证默认视频播放:

  1. 测试按钮: "测试默认视频" 按钮
  2. 测试方法: testDefaultVideoPlayback()
  3. 测试流程:
    • 检查默认视频文件是否存在
    • 创建默认视频流
    • 设置到视频元素并播放
    • 5秒后自动停止测试

验证步骤

  1. 启动应用
  2. 点击"开始音频通话"
  3. 观察默认视频是否开始播放
  4. 点击"测试默认视频"按钮验证功能
  5. 查看性能监控面板确认视频流数量

预期效果

修复后,默认视频应该能够:

  1. 正常播放: 通话开始时自动播放默认视频
  2. 不被清理: 重要视频不会被自动清理机制删除
  3. 快速切换: 预加载确保切换时响应迅速
  4. 稳定运行: 性能监控不会误报重要视频为问题

监控指标

  • 视频流数量: 正常范围 1-5 个
  • 重要视频保护: 确保 d-3s.mp4s-1.mp4 不被清理
  • 默认视频状态: 通话开始时应该显示默认视频