testerhome第二期播放地址以及終端h5測(cè)試實(shí)踐

終端H5測(cè)試實(shí)踐summeroyou

@QQ空間About

me–

2013-2014

pcQZone–

2015-now

H5

QZone終端H5測(cè)試實(shí)踐H5的挑戰(zhàn)用戶對(duì)速度和流暢度的關(guān)注，對(duì)卡慢的挑戰(zhàn)，超出預(yù)期速度與流量卡慢可以用速度來(lái)衡量，而速度背后往往隱藏了流量問(wèn)題遠(yuǎn)程調(diào)試，進(jìn)階的可能實(shí)時(shí)debug，輕松分析腳本報(bào)錯(cuò)和內(nèi)存泄漏終端H5測(cè)試實(shí)踐Qzone

H5典型事件2014年玩吧，大量玩家投訴白屏和卡慢2015年話題圈，DAU百萬(wàn)級(jí)，用戶反饋feeds滑動(dòng)不流暢、頁(yè)面點(diǎn)擊無(wú)響應(yīng)2016年留言板native頁(yè)面H5化，用戶投訴留言頁(yè)面慢、太卡H5的挑戰(zhàn)測(cè)試現(xiàn)狀如何？功能測(cè)試為主無(wú)法調(diào)試，webview具體做了什么我們一無(wú)所知tcpdump效率低,無(wú)法配host、模擬請(qǐng)求、篡改返回包H5測(cè)試是否完備？移動(dòng)端網(wǎng)絡(luò)環(huán)境復(fù)雜，怎么去界定卡慢？是否有方法拿到速度、流暢度這些數(shù)據(jù)？除了速度、流暢度，還有什么缺失，需要重新梳理和審視H5的挑戰(zhàn)完備的H5測(cè)試需要包含什么？H5的挑戰(zhàn)性能表現(xiàn)如何細(xì)化？–

最核心的還是速度和流量速度與流量首屏速度&流量移動(dòng)網(wǎng)速幾十KB/s~幾百KB/s不等，用某個(gè)網(wǎng)速下的速度來(lái)反映頁(yè)面速度，不夠充分流量+速度VS網(wǎng)絡(luò)環(huán)境，強(qiáng)有力的補(bǔ)充chrome模擬&

fiddler代理抓包可以準(zhǔn)確評(píng)估流量通過(guò)http耗時(shí)粗略評(píng)估首屏速度實(shí)際證明：卡慢問(wèn)題中，流量類占比過(guò)半速度與流量卡慢典型案例–

話題圈，圖片流量過(guò)大，UI

100*100，請(qǐng)求了512*683速度與流量卡慢典型案例玩吧游戲，請(qǐng)求個(gè)數(shù)過(guò)多，首屏請(qǐng)求了100多個(gè)js/耗時(shí)幾分鐘數(shù)據(jù)冗余，包括冗余請(qǐng)求、重復(fù)請(qǐng)求、分頁(yè)數(shù)據(jù)量過(guò)大、返回包字段冗余：253KB壓縮到13KB速度與流量流量以外腳本錯(cuò)js響應(yīng)/執(zhí)行時(shí)間過(guò)長(zhǎng)內(nèi)存泄漏if

Devtool.exist()可以調(diào)試、審查元素可以拿到腳本耗時(shí)可以查看內(nèi)存遠(yuǎn)程調(diào)試，進(jìn)階的可能遠(yuǎn)程調(diào)試，進(jìn)階的可能mobile

chrome支持remote

debugAndroid4.4開(kāi)始，ios5開(kāi)始，支持remote

debug遠(yuǎn)程調(diào)試，進(jìn)階的可能android遠(yuǎn)程調(diào)試，進(jìn)階的可能ios遠(yuǎn)程調(diào)試，進(jìn)階的可能remote

inspector可以做什么最常用的元素審查、腳本debug、network網(wǎng)絡(luò)請(qǐng)求timeline：loading、render、paint、js事件瀑布流，

memory曲線，fpsprofile：memory分析和cpu耗時(shí)resources：cookie、cache遠(yuǎn)程調(diào)試，進(jìn)階的可能典型案例話題圈，偶現(xiàn)頁(yè)面操作無(wú)響應(yīng)，腳本報(bào)錯(cuò)問(wèn)題玩吧小游戲，越到后面關(guān)卡越卡，iframe內(nèi)存泄漏直播頁(yè)，一段時(shí)間后評(píng)論列表刷新不夠流暢，內(nèi)存中2萬(wàn)多條消息未釋放遠(yuǎn)程調(diào)試，進(jìn)階的可能消息列表內(nèi)存泄漏–

問(wèn)題表現(xiàn)：用戶互動(dòng)很高的直播，時(shí)間長(zhǎng)了之后，刷消息變卡timeline：抓內(nèi)存曲線，增長(zhǎng)型profile：內(nèi)存快照對(duì)比，消息列表泄漏遠(yuǎn)程調(diào)試，進(jìn)階的可能除了質(zhì)量，效率方面是否可以提升制定H5發(fā)布標(biāo)準(zhǔn)：首屏速度、首屏流量、請(qǐng)求個(gè)數(shù)、圖片大小自動(dòng)化，利用遠(yuǎn)程調(diào)試獲取真機(jī)數(shù)據(jù)每日監(jiān)控&郵件告警遠(yuǎn)程調(diào)試，進(jìn)階的可能結(jié)語(yǔ)H5測(cè)試應(yīng)該考慮什么？功能測(cè)試、兼容性測(cè)試、安全測(cè)試移動(dòng)設(shè)備和網(wǎng)絡(luò)環(huán)境復(fù)雜，使得性能測(cè)試、網(wǎng)絡(luò)測(cè)試愈發(fā)重要