首屏算法說明
首屏即 頁面首次渲染滿屏內(nèi)容姐刁，是用于計算T2的關(guān)鍵節(jié)點(diǎn)。簡單說就是贿肩，在頁面加載的過程中峦椰，記錄所有的渲染幀，在頁面加載結(jié)束之后汰规，回溯檢查每一幀汤功，圖片渲染面積首次達(dá)到最大值的那一幀記為T2
T2計算起點(diǎn)
T2的時間起點(diǎn)為 PerformanceTiming.naviagtionStart, 即 HTML主 文檔開始加載的時間。在WebView加載頁面的場景溜哮，與WebView.loadUrl 的時機(jī)非常接近
T2開始記錄渲染幀
T2開始記錄渲染幀的時間點(diǎn)為 FirstFullScreenLayout 滔金，即排版高度大于一屏。在這個時間點(diǎn)之前茂嗓，頁面一般不會有內(nèi)容展示餐茵，所以沒有必要記錄渲染幀
T2結(jié)束計算的條件
常見的T2結(jié)束計算的條件有以下幾種：
- 頁面退出。比如述吸，用戶關(guān)閉頁面
- 頁面不可見忿族。比如，app切到后臺
- 有用戶交互。比如肠阱，用戶點(diǎn)擊或者滑動頁面
- T2計算耗時超時票唆。T2幀記錄的計算不能消耗太多時間，超出50ms的閥值會結(jié)束計算屹徘，不再記錄后續(xù)的幀
- T2幀數(shù)超出閥值走趋。T2幀不能記錄太多，也會損耗性能噪伊，超出50幀的閥值會結(jié)束計算簿煌，不再記錄后續(xù)的幀
- WebView所在的Window失去焦點(diǎn)。比如鉴吹，頁面有Native彈框
需特別注意的是：T2結(jié)束計算的時間點(diǎn)不一定是T2的時間終點(diǎn)姨伟，而且極有可能是不一樣的。T2結(jié)束計算之后豆励，還要回溯檢查夺荒，找出圖片渲染面積首次達(dá)到最大值的那一幀，才記為T2
影響耗時的因素
核心耗時
- 包大小過大：包括整包/主包(分包）的壓縮包 以及 內(nèi)部bundle文件(worker)過大良蒸。包文件會包含一些靜態(tài)資源技扼。相對來說，后者影響更大嫩痰，因為每次運(yùn)行會有worker的解析過程
- 同步api調(diào)用(my.Sync)剿吻，阻塞執(zhí)行。
- uc冷啟：支付寶首頁首屏小程序的uc冷啟(init_uc)耗時占比會偏高串纺，因為App雖然已經(jīng)做了啟動uc初始化丽旅，但是在首頁的小程序訪問時來不及完成初始化肯定會更多（想減少耗時就申請默認(rèn)踢出支付寶首頁）。
- 核心耗時階段纺棺，uc冷啟比熱啟耗時要多出145%（餓了么小程序）榄笙。
業(yè)務(wù)耗時
- 主鏈路耗時：免登，主接口調(diào)用到頁面渲染五辽，串行鏈路办斑。
- 首屏內(nèi)容不足：主接口數(shù)據(jù)模塊不足外恕。
- 渲染Data數(shù)據(jù)量：setData次數(shù)&內(nèi)容過多杆逗，影響渲染效率
- 圖片過大過多：直接影響T2統(tǒng)計的首屏鋪滿判定
本文由博客一文多發(fā)平臺 OpenWrite 發(fā)布！
