天天看點

“軍裝照” 背後:天天 P 圖如何應對 10 億流量的背景承載

作者:oliver, 騰訊壓測大師團隊産品經理

商業轉載請聯系騰訊WeTest獲得授權,非商業轉載請注明出處。

原文連結:http://wetest.qq.com/lab/view/327.html

天天P圖”軍裝照”活動交出了一份10億浏覽量的答卷,一時間刷屏朋友圈,看到這幕,是不是特别想複制一個如此成功的H5?不過本文不教你如何做一個爆款H5,而是介紹天天P圖在“軍裝照”活動過程中,如何面對10億流量時的背景承載。

這兩天,相信 “軍裝照”活動已經刷爆了朋友圈,這個活動是由人民日報用戶端策劃出品并主導開發,騰訊天天P圖提供圖像處理支援的一款H5産品。

“軍裝照” 背後:天天 P 圖如何應對 10 億流量的背景承載

天天P圖智能換臉

這款H5于7月29日晚一經推出,浏覽量就迅猛攀升。7月30日24時,浏覽次數突破6000萬,在7月30日23:03時,H5迎來了這次活動的最高峰值,圖檔生成請求達到每分鐘117萬次,8月1日13時突破5億。截至8月2日17時,“軍裝照”H5的浏覽次數累計8.2億,獨立訪客累計1.27億,一分鐘通路人數峰值高達41萬。

“軍裝照” 背後:天天 P 圖如何應對 10 億流量的背景承載

背景資料截圖

一般來說,一個H5産品浏覽次數能超過500萬就很不錯了,超過1億的十分罕見。如果以1億為标準,這款H5産品能夠申請10次世界紀錄。

創紀錄的浏覽量背後,自然需要堅強的後盾,騰訊雲與騰訊WeTest幫助天天P圖對圖檔上傳下載下傳,存儲,智能分析、融合處理以及壓力測試等服務提供技術支援,讓“軍裝照”活動可以順利延續影響力,保證使用者的良好體驗。

在見證了一個個精妙的H5活動後,我們漸漸意識到,制作一個刷屏級的H5越來越難了。

騰訊大資料2016年的《移動頁面使用者行為報告》中表示如果頁面加載超過5秒就會有74%的使用者離開頁面。

“軍裝照” 背後:天天 P 圖如何應對 10 億流量的背景承載

頁面加載超過5s就會有74%的使用者離開頁面

(圖檔來源:騰訊大資料《移動頁面使用者行為報告》)

這樣的資料是符合交易響應時間的“2-5-8原則”的,也就是:

1、 當使用者能夠在2秒以内得到響應時,會感覺系統的響應很快;

2、 當使用者在2-5秒之間得到響應時,會感覺系統的響應速度還可以;

3、 當使用者在5-8秒以内得到響應時,會感覺系統的響應速度很慢,但是還可以接受;

4、 當使用者在超過8秒後仍然無法得到響應時,會感覺系統糟透了,或者認為系統已經失去響應,而選擇離開這個Web站點,或者發起第二次請求。

從騰訊大資料的資料來看,使用者對于H5的容忍程度顯然更低,在5-6秒的時候,已經開始無法忍受了,是以根據這樣的現實情況,對于移動頁面,我們更應該關注一個全新的“1-2-5原則“:

1、 當使用者能夠在1-2秒内打開H5頁面,看到資訊的展示,或者能夠開始進行下一步的操作,使用者會感覺速度還好,可以接受;

2、 頁面如果在2-5秒後才進入可用的狀态,使用者的耐心會逐漸喪失;

3、 如果一個界面超過5秒甚至更久才能顯示出來,這對使用者來說基本是無法忍受的,也許有一部分使用者會退出重新進入,但更多的使用者會直接放棄使用。

舉個例子:

2016年11月24日晚上九點半,一個名為《薛之謙2個月沒寫段子,結果憋了個大招》的騰訊動漫的H5引爆了朋友圈,僅僅三個小時就已經突破120W的PV,而第二天早上的PV大概是270W左右。

該H5采用長圖文+視訊的形式,在螢幕劃到某一個位置,自動播放準備好的Mp4檔案,起初,這個時長2分51秒的視訊大小是34.5MB,,如果在網絡環境較好的情況,使用者可以很流暢的觀看,沒有卡頓和延遲,但是為了提升使用者的體驗感受,H5進行了全面的優化,整體大小被下降到了24.3MB。

“軍裝照” 背後:天天 P 圖如何應對 10 億流量的背景承載

騰訊動漫的H5整體大小從40MB左右優化到了24.3MB

(圖檔來源:《深度解析!薛之謙的二次元H5為什麼又翻天了!》)

對于一個H5的産品,功能無疑很重要,但是性能同樣是使用者體驗中不可或缺的一環。原本H5的渲染性能就不及native的app,是以,H5的性能是一個繞不開的話題。

為了保證“軍裝照”H5能夠被使用者順利的通路,,天天P圖與騰訊WeTest壓測大師合作,對H5的主要接口進行了多次壓力測試。

1、制定測試目标

根據之前多次H5活動經驗,天天P圖對活動流量通常都有一個穩定的預期。天天P圖的技術團隊将H5的壓測目标制定如下:

事務成功率: 99.9%

響應時間: 500ms

TPS: 10000qps

網絡流量: 15G

“軍裝照” 背後:天天 P 圖如何應對 10 億流量的背景承載

壓測人數配置(示例)

2、确認壓測場景

對于“軍裝照”H5活動,最為重要的一個接口就是使用者上傳圖檔到天天P圖“人臉融合”背景的接口,通過完成接口位址的配置,天天P圖技術團隊完成了壓測的配置。

“軍裝照” 背後:天天 P 圖如何應對 10 億流量的背景承載

接口位址配置(示例)

天天P圖團隊不斷的通過壓測大師測試接口,擷取實時的承載資料,對伺服器進行持續優化,進而實作一個最為穩定的狀态。

“軍裝照” 背後:天天 P 圖如何應對 10 億流量的背景承載

壓測資料結果(demo資料)

在完成了伺服器架構的最佳優化之後,天天P圖在“軍裝照”活動爆紅之後,依賴騰訊雲海量處理能力和靈活擴充性,天天P圖團隊緊急在騰訊雲調動伺服器,進行彈性擴容,從一開始的400台,再到800台,最終在最高峰動态部署了4000台騰訊雲伺服器。此外騰訊雲還采用了智能分流、柔性政策等辦法,確定穩定應對海量使用者的請求。這樣的彈性擴充因而支撐了“軍裝H5”10億次的浏覽。

H5技術的興起,注定着這款重要的網絡語言将要承載越來越多的内容,為了滿足使用者越來越“不耐心”的響應時間要求,未來的H5以及Web頁面針對性能勢必進行更多的測試以及優化,保證使用者在越來越多的場景下可以體驗到最好的效果。<code>騰訊WeTest壓測大師運用了沉澱十多年的内部實踐經驗總結,服務了包括王者榮耀、龍之谷手遊、軒轅傳奇手遊、火影忍者等多款高星級手遊,也包括天天P圖、NOW直播等明星産品,通過基于真實業務場景和使用者行為進行壓力測試,幫助開發者發現伺服器端的性能瓶頸,進行針對性的性能調優,降低伺服器采購和維護成本。</code>

為了讓外部更多産品能夠享受到簡單易用的壓測産品,騰訊WeTest決定将這份伺服器測試能力産品化,以産品”壓測大師“的形式,正式對外開放。目前更有10元10000VUM的壓測優惠,歡迎大家的使用!

體驗位址:http://wetest.qq.com/activity/paygaps0808

如果對使用當中有任何疑問,歡迎聯系騰訊WeTest企業qq:800024531