最近,F(xiàn)acebook將網(wǎng)絡(luò)中的視頻幾乎全部從Adobe Flash遷移到HTML5。當(dāng)然,F(xiàn)acebook將繼續(xù)與Adobe合作,為平臺(tái)上的游戲提供可靠、安全的Flash體驗(yàn),但會(huì)在所有的瀏覽器中默認(rèn)使用 HTML5 技術(shù)播放視頻。從開發(fā)速度到易訪問性,HTML5提供了很多好處。
據(jù)Facebook 前端高級(jí)工程師丹尼爾·保利希介紹,使用Web技術(shù)使Facebook能夠利用開源社區(qū)和Facebook中已有的優(yōu)秀瀏覽器工具,不必重新編譯代碼,并能夠在瀏覽器直接應(yīng)用變化,從而讓Facebook得以快速行動(dòng)。Facebook有優(yōu)秀的測試基礎(chǔ)設(shè)施,遷移到HTML5視頻后,工程師可以自由地使用所有的Web工具,比如Jest和Webdriver。HTML5使工程師們能夠建立一個(gè)完全支持屏幕閱讀器和鍵盤輸入訪問的播放器,可以利用HTML5提供的輔助工具讓視力障礙人士更容易地使用產(chǎn)品。
視頻日志有助于Facebook了解用戶使用視頻播放器的工作情況。Facebook會(huì)向公眾分享一些數(shù)據(jù),例如視頻觀看次數(shù)和視頻發(fā)布者。丹尼爾·保利希表示,F(xiàn)acebook必須確保在同一場景中,新視頻播放器記錄的數(shù)據(jù)和老播放器記錄的數(shù)據(jù)一致,但由于配置差異和其他一些細(xì)節(jié),要做到這一點(diǎn)非常困難。為確保日志數(shù)據(jù)的正確性,F(xiàn)acebook創(chuàng)建了一個(gè)測試套件,在相同的用戶交互場景下,同時(shí)運(yùn)行兩個(gè)視頻播放器,然后驗(yàn)證日志記錄是否一致,這樣能確保新的HTML5視頻播放器的報(bào)告數(shù)據(jù)有很高的可信度。
在將視頻轉(zhuǎn)移到HTML5技術(shù)之前,F(xiàn)acebook要解決的一個(gè)主要問題是各種瀏覽器中存在的關(guān)于HTML5視頻的bug(漏洞)。丹尼爾·保利希介紹說,在Chrome瀏覽器中,SPDY協(xié)議的某個(gè)bug會(huì)導(dǎo)致瀏覽器在News Feed上停止加載和播放視頻。工程師發(fā)現(xiàn),這個(gè)問題是由于同時(shí)加載了太多視頻而觸發(fā)的,所以Facebook減少了視頻同時(shí)加載的數(shù)量,并確保如果加載的視頻不再需要時(shí)會(huì)盡快將它們刪除。
目前,大多數(shù)瀏覽器都支持HTML5視頻。然而,很多老版本瀏覽器上使用HTML5播放器比使用Flash播放器表現(xiàn)差,用戶需要更長的加載時(shí)間。因此,F(xiàn)acebook決定首先只在一小部分瀏覽器上推出HTML5播放器,一旦提升了性能并修復(fù)了bug,會(huì)逐漸推向更多的瀏覽器版本和操作系統(tǒng)。
使用HTML5視頻技術(shù)不僅簡化了開發(fā)過程,同時(shí)也提高了用戶在Facebook上的視頻體驗(yàn)。切換到HTML5后,視頻播放速度更快,用戶點(diǎn)贊、評(píng)論和分享視頻的數(shù)量更多了,并且用戶報(bào)告的錯(cuò)誤更少了。Facebook在推出HTML5播放器時(shí)面臨的最后一個(gè)主要問題是:加載時(shí)間變長了。用戶加載時(shí)長是衡量用戶體驗(yàn)的一個(gè)重要因素,丹尼爾·保利希表示,通過修復(fù)幾個(gè)小的性能問題以及多項(xiàng)細(xì)微的優(yōu)化,終于達(dá)到一個(gè)令人滿意的水平。Facebook做出這項(xiàng)調(diào)整后,用戶似乎開始在視頻上花費(fèi)更多的時(shí)間。