聲網(wǎng)Web SDK 4.17.0上線：新增本地合圖功能讓場景效果更豐富

3月15日，聲網(wǎng)RTC Web SDK新版本4.17.0上線官網(wǎng)。新版本上線了動態(tài)切換本地視頻流、Beta版本的本地合圖功能。同時，該版本將SDK包體積優(yōu)化到了850KB，并優(yōu)化了斷線重連的機(jī)制與體驗。

01

新增功能

本地合圖功能（beta）

在4.17.0版本中，我們可以結(jié)合視頻合圖擴(kuò)展插件，將多路視頻、圖片、屏幕共享的內(nèi)容在本地合并為一路視頻流。這個功能用于創(chuàng)建更復(fù)雜的場景，例如在一場直播、會議、課堂中，主講人可以同時講解PPT、圖片，或在主講過程中同時播放兩個對比視頻，以豐富整個互動場景的體驗。甚至，可以通過該功能，實現(xiàn)將摳圖后的人像與PPT屏幕共享疊加在一起推流（如下圖所示）。這個功能有助于游戲直播、在線教育、電子商務(wù)、視頻會議等領(lǐng)域的開發(fā)者建立更專業(yè)，視覺效果更好的場景。

圖：屏幕共享+背景分割，本地合圖

目前該功能建議2路視頻流+1路屏幕共享流+2張圖片進(jìn)行合圖推流，在此基礎(chǔ)上我們支持加入更多視頻流和圖片進(jìn)行合成，但由于用戶設(shè)備、瀏覽器等配置，可能影響性能和體驗。

圖：兩個視頻流+一張圖片+一路屏幕共享

該功能的推薦配置為Intel Core i5 4核及以上的處理器的電腦，支持Chrome、Edge、Firefox瀏覽器。

動態(tài)切換本地視頻流

在過去，開發(fā)者需要使用IAgorRTCClient.unpublish方法，然后再使用IAgorRTCClient.publish方法，才可以發(fā)布一個流。而在4.17.0版本中，不需要這么做了。

開發(fā)者現(xiàn)在可以直接使用ILocalVideoTrack.replaceTrack方法來發(fā)布新的媒體流。采用這個方法，可以使媒體流的切換時間減少100-200毫秒。

02

改進(jìn)與優(yōu)化

SDK包體積縮小至850KB

為了進(jìn)一步縮小SDK包體積，讓客戶的產(chǎn)品體驗更順暢，聲網(wǎng)在Web SDK 4.17.0中刪除了美顏模塊并廢棄setBeautyEffect方法。這樣做之后，SDK包體積減少了11.5%，最終大小為850KB。

那么美顏沒法使用了么？并不是，開發(fā)者還有兩種方法可以使用美顏功能。

1、采用聲網(wǎng)自研的美顏插件。我們在2022年6月就在Web SDK 4.12.0版本中引入了該插件。用戶可以開啟美顏，調(diào)節(jié)美白、磨皮、祛痘、紅潤程度，實現(xiàn)自然的美顏效果。

2、集成聲網(wǎng)生態(tài)合作伙伴的美顏插件。我們在聲網(wǎng)云市場（https://www.shengwang.cn/cn/marketplace/）提供了多個生態(tài)合作伙伴的美顏、特效插件，可以實現(xiàn)更多更豐富的美顏與視頻效果。開發(fā)者們可以根據(jù)自身需要選擇。

優(yōu)化重連機(jī)制

從Web SDK 4.17.0版本開始，SDK默認(rèn)在重新連接過程中顯示斷開連接前的最后一幀視頻，這可以防止在重新連接過程中出現(xiàn)黑屏問題。注意：該功能由于Safari瀏覽器的限制，僅在該瀏覽器上無法使用。

圖：優(yōu)化前后的顯示效果

改進(jìn)數(shù)據(jù)分析功能

我們在數(shù)據(jù)分析方面有一些現(xiàn)有的問題。首先，無法準(zhǔn)確測量250ms以下的視頻卡頓率。其次，timeupdate事件的間隔與視頻卡頓率指標(biāo)的定義不一致。這些問題在Web SDK 4.17.0中都得到了解決。我們在該版本中刪除3個冗余的大小流采集上報，新增修復(fù)10個Firefox缺失上報、3個Safari缺失上報。

改進(jìn)虛擬背景插件效果

我們在Web SDK 4.17.0版本中修復(fù)了Android端Chrome瀏覽器上背景圖片可能出現(xiàn)鋸齒狀效果的問題。