Categories
程式開發

愛奇藝知識播放體驗優化的探索和實踐


前言

德魯克說:未來社會最大的改變一定是會發生在知識領域。

知識付費商業形式在2014年甚至更早之前就已經開始有了,只是當時還沒有內容創業的概念,沒有被完全重視。到了2016年,移動互聯網的成熟、短視頻和直播行業爆發式增長,促使知識付費也進入了人們熱烈討論的話題中。愛奇藝知識佈局最早要追溯到2012年上線的愛奇藝教育頻道,並於2019年愛奇藝知識獨立APP上線。
愛奇藝知識是以音視頻播放為主要分發手段,注重用戶體驗和內容質量。而播放體驗是用戶產品體驗的核心。相比於愛奇藝APP,愛奇藝知識有更複雜的播放交互場景:視頻、音頻、音頻控制台、音視頻浮窗等多種音視頻平滑切換的場景較多,如何保證起播流暢性是一個相對複雜的技術難題。
愛奇藝知識技術團隊經過不斷探索和實踐,在《愛奇藝知識音視頻通用播放架構實踐》文章介紹的播放架構基礎上,總結針對性的優化方案,最終實現了多播放場景的平滑切換的極致用戶體驗,和秒播率37%左右的提升。
本文主要針對愛奇藝知識播放體驗優化方案的實現進行分享。

01 播放場景擴展

為了能夠給用戶提供更豐富內容和連貫的觀看體驗,愛奇藝知識也在常規的視頻播放場景以外擴展了音頻、視頻條、音頻條、吸頂條、控制台等場景,同時還做了音視頻的主被動切換功能、場景間切換的不間斷播放體驗等。多場景的播放切換和多方播放器的接入勢必會帶來新的挑戰,如音視頻播放頁與音視頻條的無縫切換、音視頻前後台自動切換、音頻播放器與控制台的對接等,當然,這些問題目前在愛奇藝知識APP中也得到了很好的解決,以下就為大家簡單做一下介紹。

1.1 音視頻播放頁與音視頻條間切換

為達到極致用戶體驗,不阻斷播放,愛奇藝知識研發了音視頻浮窗(簡稱音視頻條),在播放頁退出的時候仍然可以出現在當前頁面下方。這個機制適用於長視頻、短視頻和音頻播放場景;並且實現了音視頻條在APP內部頁面的全局露出,使用戶隨時隨地可以對當前播放內容進行控制,同時音視頻條支持任意位置的拖拽,進而保證對頁面內容的無遮擋效果。不僅如此,基於此架構還可以非常低的成本對音視頻浮窗的樣式做隨時變更,以適應不同的產品體驗。

愛奇藝知識播放體驗優化的探索和實踐 1

愛奇藝知識播放體驗優化的探索和實踐 2

為了實現音視頻播放頁與音視頻條之間的無縫切換,也為了實現音視頻條獨立起播的能力,我們使用了功能控制器,即針對需要使用播放器的業務場景封裝播放控制器,在這個控制器裡面會存儲播放器所需的必要數據,如選集數據等,同時這個控制器裡面也會處理共性的播放器delegate事件,如統計等,這樣也就可以更好的實現不同場景間切換的無間斷播放,目前使用的播放器控制器有兩種類型,即長視頻播放器控制與短視頻播放器控制器。

使用方式如下圖所示:

愛奇藝知識播放體驗優化的探索和實踐 3

1.2 音視頻前後台自動切換

為了給用戶更連貫的視聽體驗,我們添加音視頻前後台自動切換的功能,即在用戶開啟允許視頻後台繼續播放的前提下,在APP進入後台模式後我們會主動將視頻轉為聽音模式,使得播放內容不間斷,用戶可以繼續聽視頻內容,同時還可以避免不必要流量的浪費。在APP切換到前台後會自動轉換為視頻模式,用戶依舊可以繼續觀看視頻內容,整個切換的流程不會中斷,視聽的體驗是連貫的。

愛奇藝知識播放體驗優化的探索和實踐 4

1.3 控制台的對接

由於愛奇藝知識有大量的音頻課程,並且視頻課程也是絕大部門都是支持聽音模式的功能,為了形成更好的音頻播放功能閉環,我們在全新音頻播放器的基礎上,對接(iOS )/添加(Android)的控制台模塊,這樣可以使得在手機不解鎖的前提下,實現對播放內容控制,滿足用戶更多場景的功能體驗需求,實現音頻播放功能的閉環。

愛奇藝知識播放體驗優化的探索和實踐 5

愛奇藝知識播放體驗優化的探索和實踐 6

02 起播流程優化

由於愛奇藝知識播放內容含有合作方的內容,部分合作方並沒有把相應內容源文件上傳至愛奇藝統一內容後台,因此也就需要使用對應合作方提供的SDK或者通過知識後台代理獲取三方內容的播放地址進而實現播放。目前愛奇藝知識的內容不僅包含愛奇藝內容,還包含了多種合作方內容,每種播放源的播放使用相應的播放器來實現,目前播放器使用的主要架構圖如下:

愛奇藝知識播放體驗優化的探索和實踐 7

從上圖可以看出知識播放器對下需要對接多種播放SDK,對上需要輸出4種播放UI(音頻UI、長視頻UI、短視頻UI、視頻浮窗UI)和相應播控、滿足多種播放場景功能需求,同時還會有多種音視頻交叉和功能切換的複雜場景。

由於知識播放器需求的多樣性,也就注定了架構和起播流程的複雜性,優化之前先搞清楚起播流程是什麼樣的,下圖簡述了起播的主要流程。

愛奇藝知識播放體驗優化的探索和實踐 8

2.1 分析

從起播流程圖不難看出,整個流程大體可分為3個大的階段,即:起播參數的獲取、播放器的選擇與創建、播放地址獲取。

  1. 起播參數的獲取: 上圖所示多個參數(第一排參數,後稱起播參數),如果在上級頁面能夠獲取到的話,即跳轉播放頁的時候就可以準備好,便可以直接在起播參數模型轉換之後直接走起播流程了。即使上級頁面沒有傳遞起播參數,但本地若能有一個可以補全參數的模塊的話依舊可以走快速起播流程,否則需要調用一次接口,待參數補全後才能走起播流程,本次接口請求耗時是可以優化的。故此階段的參數獲取前置對於優化來講尤為重要。
  2. 播放器的選擇與創建: 獲取到起播參數之後,會根據合作方標識選擇需要使用的播放器,走相應的起播流程,同時如若可以減少播放器UI和相應SDK創建次數的話也是可以實現優化的效果。此階段的也是可以優化的。
  3. 播放地址獲取: 得益於愛奇藝APP播放器體系的優勢,愛奇藝內容播放地址獲取已經形成了一套完善的接口調用機制,適用於所有業務線,不需要做針對性優化,合作方內容播放地址獲取由知識後端團隊代理。此階段的接口請求次數已經減少到一次,響應速度是可以得到保證的,三方內容播放地址的獲取依賴於三方接口的響應速度。由於播放地址獲取的接口沒有多少優化空間,但我們可以考慮把更多的網絡資源讓給這個地址獲取階段。

2.2 優化方向

2.2.1 第一階段(起播參數的獲取)優化

a. 起播參數前置

由第一階段的分析可以看出,如果進入播放頁之前,所有需要的起播參數都已經由外部入口提供了,就避免了補全參數所需的網絡接口請求,可以有效提升起播速度。由於此項優化涉及的入口較多,知識各個數據接口都針對起播做了統一添加處理。

b. 本地播放記錄模塊的添加

為了實現更高的秒播率、實現多種內容源播放記錄的讀取、同時也為了更好的存取音頻播放場景的播放記錄,愛奇藝知識開發了本地播放記錄模塊,每次在起播之前都會做本地播放記錄模塊的查詢,可以根據視頻ID查詢到本地存儲的播放記錄數據(不區分內容提供方),如若命中即可獲取到播放所需全量參數,走起播流程。

知識播放記錄模塊還分別做了內存和外存的存儲方式,內存的合理化使用可以提升讀寫的效率,降低讀取所需耗時。

  • 上述兩條方案的使用後秒播率得到了19%左右的提升,總體來說收益還是比較明顯的

2.2.2 第二階段(播放器的選擇與創建)優化

a. 音視頻播放器統一

愛奇藝知識統一播放器的開發可以針對自身的需求進行實現,使得功能上線的靈活性更強,同時也使得播放器功能開發更加具有針對性,實現了功能級別的“瘦身”,減少了不必要係統資源的消耗。

知識內部各類型播放器是單例存在的形式,即單次生命週期內只需要創建一次,這樣也可以大大減少創建創建的次數與相應耗時。

知識播放器的自行開發同時也實現了多播放器UI與共性功能的複用,即無論使用哪種播放器進行播放給用戶呈現的觀影體驗是無差別的,不同類型播放器的切換間亦是如此,進而實現了觀看窗口的統一與切換的無感。

b. 播放器UI創建優化

愛奇藝知識播放體驗優化的探索和實踐 9

愛奇藝知識對接愛奇藝APP的無UI播放sdk,即除播放畫面以外的播控、浮層等自行實現,因此,我們針對播放器UI創建使用的是懶加載的形式,會根據使用需求進行即時創建,不會同時創建當時不需要的UI控件,也不會重複創建相同的UI 控件,這樣可以避免UI創建所需的耗時與主線程的使用。

舉一個具體的例子,知識播放器上的提示浮層目前除購買之外的,loading、網絡提示、播放錯誤、播放結束等提示類浮層只有一個實例,第一次創建成功後,之後會隨著所需樣式進行更新,無需每次都創建。

  • 上述兩條方案的使用後秒播率得到了7%左右的提升

2.2.3 第三階段(播放地址獲取)優化

a. 預加載(起播第三階段)

連播預加載的實質就是提前加載即將用到或者即將可能用到的網絡資源,減少當次起播獲取播放資源的網絡開銷,進而實現更高的秒播率,給用戶更流暢的觀看體驗。

播放器支持預加載下一集的連播,在當前視頻播放到最後20秒時播放器會通過相應delegate api去業務層取需要預加載的播放item,拿到item之後會預加載一段播放資源,進而提升連播的開播速度。

在當前視頻播放完成後會通過相應的delegate api 獲取需要播放的item,確認預加載的視頻是否與此次數據一致,確認一致後會直接使用已經加載的播放資源直接起播。

  • 此方案的實現使得秒播率有了4%左右的提升

b. 開播前系統資源分配

前面講了播放地址獲取需要較大的網絡開銷,因此在調用起播後,我們盡量把更多的系統網絡資源讓給播放器,方案是:進入播放頁後,在收到相應回調或者達到最大等待閾值後,再進行業務接口的請求與頁面的繪製,提升播放器開播速度。

愛奇藝知識播放體驗優化的探索和實踐 10

如上所示,頁面跳轉會經過路由,路由內部會判定是否滿足起播條件,滿足起播條件或者經過播放頁補全起播參數後會走起播流程,播放頁在收到播放器開播成功、鑑權失敗、播放器錯誤等回調或達到等待閾值後,再進行頁面繪製操作。

  • 此方案的實現使得秒播率有了7%左右的提升

03 總結

秒播率的提升,顧名思義就是提升一秒內開播的佔比,優化的空間也都是毫秒級的,本文從起播流程的參數準備、播放器創建與選擇、播放地址獲取3個階段詳細分析了優化關鍵節點,並針對性的提出了優化方法,使得愛奇藝知識APP的播放秒開率大幅提升,實現了更加流暢的播放體驗。

愛奇藝知識團隊一直把服務用戶,讓更多有知識獲取需求的人能更便捷、更好的獲取到優質的內容和觀看體驗作為自我鞭策的基準,播放場景的拓展也為滿足了用戶多樣的觀看和收聽體驗,在未來愛奇藝知識團隊還會持續完善和擴展播放場景,旨在提升使用的便捷性與多樣性。在不斷創新和優化使用體驗,力爭為用戶提供更優質的視聽體驗。

本文轉載自公眾號愛奇藝技術產品團隊(ID:iQIYI-TP)。

原文鏈接

愛奇藝知識播放體驗優化的探索和實踐