隨著移動互聯(lián)網(wǎng)的發(fā)展，用戶對產(chǎn)品的使用體驗要求越來越高。APP內(nèi)的H5作為重要載體，靈活，輕量，在移動端的應(yīng)用非常廣泛，是一個非常核心的用戶體驗指標(biāo)。但對比App，H5的性能表現(xiàn)還是遜色一籌，比如頁面打開往往會出現(xiàn)白屏，加載慢等問題。
針對這些H5具體使用時的各類問題，友盟+U-APM應(yīng)用性能監(jiān)控平臺上線了「H5頁面分析」功能。針對APP內(nèi)H5頁面常見的用戶感知、加載性能、慢加載三大問題，實時監(jiān)控應(yīng)用中H5頁面的性能情況，即時幫助開發(fā)者應(yīng)對H5頁面的各類性能狀況。
01 用戶感知
從C端用戶角度， 用戶會向APP開發(fā)者投訴頁面加載過慢，反應(yīng)速度很慢，這類偏向感知類的反饋，但這個反饋很難整體進(jìn)行衡量和判斷，鎖定到底是哪里出現(xiàn)問題、異常到底指向哪里角度去進(jìn)行判斷。
因此頁面上提供首屏?xí)r間、首次內(nèi)容繪制時間、頁面可交互時間這3個用戶可視性性能指標(biāo)便于開發(fā)者了解當(dāng)前頁面的加載情況；
指標(biāo)定義
首屏?xí)r間（FP）：First Paint，從打開頁面到首個像素渲染到頁面的時長
首次內(nèi)容繪制時間（FCP）：First Contentful Paint，首次繪制完成DOM內(nèi)容的時長，內(nèi)容包括文本、圖片（包含背景圖）、非白色的 canvas 或 SVG，也包括帶有正在加載中的 Web 字體的文本
頁面可交互時間（TTI）： Time to interactive，從頁面加載開始到頁面處于完全可交互狀態(tài)的時長。
1秒快開比：首屏完全加載時長≤1s的PV占比
2秒快開比：首屏完全加載時長≤2s的PV占比
5秒慢開比：首屏完全加載時長>5s的PV占比
通過以上指標(biāo)開發(fā)者可以快速掌握全局加載情況，感知加載時間較長的用戶占比情況； 還可通過提供的樣本分布掌握用戶對于頁面加載的容忍情況。維度分布、指標(biāo)列表多個維度。
整體篩選控件支持篩選時間范圍、屬性維度、頁面、高級功能。啟動頁面的篩選支持按照域名進(jìn)行聚合，如果需要篩選某個URL，請先選擇對應(yīng)的域名，再在域名下篩選URL。
樣本分布和維度分布多個指標(biāo)可以查看。樣本分布按照各個維度下求指標(biāo)的平均值，支持Top5和明細(xì)的查看。
指標(biāo)列表展示所有指標(biāo)，支持導(dǎo)出，包含50%、90%、95%分位值。
02 加載性能
在了解完C端對于頁面整體的感知情況后，開發(fā)者可能會關(guān)注到底哪里的加載慢了影響了整體的感知，此時就有了“加載性能”這個模塊的設(shè)計；
在這個模塊中可以為開發(fā)者提供頁面加載的完整生命周期，并能能夠根據(jù)不同階段了解各環(huán)節(jié)的加載耗時。
整體趨勢：洞察頁面中不同生命周期的平均時長和維度分布
加載性能包含整體趨勢、平均時長、指標(biāo)列表、樣本分布和維度分布等指標(biāo)。整體趨勢可以查看加載指標(biāo)的平均值、50%、90%、95%分位值。
分頁面統(tǒng)計：洞察App中不同頁面在不同階段的加載耗時
03 慢加載
在了解了整體感知和頁面各生命周期中階段的耗時后也可從慢加載角度定位APP的請求較慢的情況。
慢加載定義： 可自行設(shè)置慢請求的閾值，如果請求時長大于設(shè)置的閾值，則為一次慢請求。 頁面完全加載時長超過慢加載閾值的被視為慢啟動，默認(rèn)為3秒，設(shè)定后頁面即刻刷新
URL列表中包含請求URL的列表，URL以host+path進(jìn)行聚合，點擊URL后可以查看到在所有篩選的時間和條件下每次慢請求的ID list。
點擊URL行旁邊的維度分布可以展開整體的維度分布圖，展示了這個URL按照Host+Path聚合后，在每個維度下面的數(shù)量分布。
點擊請求ID行右邊的加載時序圖，即可展開這次慢請求的詳情，其中展示了本次請求的詳細(xì)設(shè)備信息以及頁面加載的完整生命周期。通過完整的加載時序圖可以了解單請求中哪個環(huán)節(jié)出現(xiàn)問題，快速定位。
以上功能可通過U-APM應(yīng)用性能監(jiān)控平臺新上線的H5頁面分析一一實現(xiàn)，開發(fā)者只需要額外集成JS SDK，按照集成文檔操作就可完成！
04 采樣率
H5分析統(tǒng)一采樣率為5%，此采樣率按照設(shè)備的啟動定義，即為每次啟動有5%的可能性被采樣。如果開發(fā)者是Pro用戶需要做采樣率調(diào)整，U-APM團(tuán)隊會協(xié)助做相應(yīng)支持。
關(guān)于U-APM 應(yīng)用性能監(jiān)控平臺
截止目前，U-APM已支持服務(wù)國內(nèi)各領(lǐng)域多家頭部客戶，如七貓免費小說、獵豹清理大師、車來了、江南百景圖等。未來，U-APM會繼續(xù)秉承為開發(fā)者提供好工具好服務(wù)的理念，助力應(yīng)用穩(wěn)定性與性能監(jiān)控，有效提升開發(fā)者發(fā)現(xiàn)問題、定位問題的效率，共同守護(hù)用戶體驗。
