@realsee/vreo 0.2.0-alpha.6 → 0.2.0-alpha.9

package/README.md

@@ -477,9 +477,23 @@ const creatVideo = (): HTMLVideoElement => {
   return video
 }
 
+const creatAudio = (): HTMLVideoElement => {
+  const audio = document.createElement('audio')
+
+  video.setAttribute('autoplay', 'true')
+
+  return audio
+}
+
 // 提前创建 Video
+// 视频特效
 const videoEffect = creatVideo()
+// 视频广告
 const modelTVVideo = creatVideo()
+// 视频数字人形象
+const videoInstance = creatVideo()
+// 无数字人，仅音频
+const audioInstance = createAudio()
 
 // 微信限制：需在 WeixinJSBridgeReady 回调中触发一次
 document.addEventListener(
@@ -487,6 +501,8 @@ document.addEventListener(
   () => {
     videoEffect.play()
     modelTVVideo.play()
+    videoInstance.play()
+    audioInstance.play
   },
   false
 )
@@ -497,11 +513,42 @@ const vreoplayer = new Player(five, {
     videoEffect, // 视频特效 时依赖的 HTMLVideoElement
     modelTVVideo, // 视频广告 时依赖的 HTMLVideoElement
   },
+  videoAgentMeshOptions: {
+    videoInstance,
+    audioInstance,
+  }
 })
 ```
 
 这样，在微信浏览器或微信小程序 `WebView` 中也能正常使用自动播效果。
 
+### 性能优化
+
+提高播放性能目前有两个策略：降低贴图分辨率和提前预载。
+
+#### 降低图片分辨率
+
+可以设置 `five.imageOptions.size` 来降低渲染引擎的贴图尺寸，这样下载速度会变快且内存占用也会降低。
+你也可以配置 **Vreo** 参数来达到类似的效果：
+
+```ts
+const vreoplayer = new Player(five, { imageOptions: { size: 1024 } })
+```
+
+#### 自动预载
+
+如果网络不稳定，可以提前预载静态资源，这样播放过程中不会卡顿：
+
+```ts
+// 全局预载
+const vreoplayer = new Player(five, { autoPreload: true })
+
+// 针对某一份剧本数据预载
+vreoplayer.load(vreoUnit, 0, true)
+
+```
+
+
 ## API 文档
 
 详细的 API 文档请参考：[Vreo API](https://realsee-developer.github.io/vreo/index.html) 。