129 lines
3.6 KiB
Markdown
129 lines
3.6 KiB
Markdown
# 默认视频播放问题修复
|
||
|
||
## 问题描述
|
||
|
||
在性能优化过程中，发现默认视频 `d-3s.mp4` 和 `s-1.mp4` 没有正常播放的问题。
|
||
|
||
## 问题原因
|
||
|
||
1. **缓存策略过于激进**: 将缓存数量从3个减少到2个，导致重要视频被过早清理
|
||
2. **缺少默认视频启动调用**: 在 `startCall()` 方法中没有调用 `startDefaultVideoStream()`
|
||
3. **重要视频保护不足**: 没有区分重要视频和普通视频的清理策略
|
||
|
||
## 修复措施
|
||
|
||
### 1. 优化缓存策略
|
||
```javascript
|
||
// 修复前
|
||
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. 添加默认视频启动调用
|
||
```javascript
|
||
async startCall() {
|
||
// ... 其他代码 ...
|
||
|
||
// 启动默认视频流
|
||
await this.startDefaultVideoStream();
|
||
|
||
// 通知服务器通话开始
|
||
this.socket.emit('call-started');
|
||
}
|
||
```
|
||
|
||
### 3. 改进预加载策略
|
||
```javascript
|
||
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. 优化性能监控清理
|
||
```javascript
|
||
// 如果缓存过多，清理一些（但保护重要视频）
|
||
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. 调整性能测试阈值
|
||
```javascript
|
||
// 检查视频流数量
|
||
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.mp4` 和 `s-1.mp4` 不被清理
|
||
- **默认视频状态**: 通话开始时应该显示默认视频 |