快捷導(dǎo)航

iOS?WKWebView秒開(kāi)方案實(shí)戰(zhàn)記錄

更新時(shí)間：2021年12月10日 10:59:23 作者：鐘環(huán)

從iOS8開(kāi)始,就引入了新的瀏覽器控件WKWebView,用于取代UIWebView,下面這篇文章主要給大家介紹了關(guān)于iOS?WKWebView秒開(kāi)方案的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下

前言

WKWebView 秒開(kāi)方案，不僅需要端上優(yōu)化，也需要前后端配合，我們業(yè)務(wù)前期在UIWebView上已經(jīng)通過(guò)各種優(yōu)化達(dá)到了秒開(kāi)，但是由于蘋(píng)果2020年12月份就不允許上架UIWebView，所以我們緊急切換到WKWebView，但由于WKWebView在啟動(dòng)初始化的時(shí)候表現(xiàn)還是不如人意，我們的目標(biāo)是低端機(jī)型至少大部分頁(yè)面也能秒開(kāi)。經(jīng)過(guò)一系列的優(yōu)化操作，實(shí)現(xiàn)效果和數(shù)據(jù)都是非?？捎^的。

秒開(kāi)流程圖

秒開(kāi)方案

1、模板下載。

2、首圖預(yù)加載。

3、正文列表body預(yù)取。

4、CDN預(yù)加載。

5、雙緩存池（目前一共不超過(guò)8個(gè)）：一個(gè)負(fù)責(zé)feed流列表滾動(dòng)停止時(shí)異步執(zhí)行js預(yù)熱；一個(gè)負(fù)責(zé)進(jìn)入文章后準(zhǔn)備好一個(gè)干凈的WKWebview供下一次未命中秒開(kāi)WKWebview使用。

6、點(diǎn)擊cell命中預(yù)熱好的秒開(kāi)WKWebview，則進(jìn)行預(yù)熱下一篇文章，這樣提高秒開(kāi)率。

7、initpage預(yù)熱好的WebView需要先放在屏幕最右側(cè)隱藏，在進(jìn)入后顯示并重設(shè)frame回歸正常視圖中。

8、feed流預(yù)熱的WebView通過(guò)initPage傳false參數(shù)、進(jìn)入文章頁(yè)后的WebView通過(guò)initPage傳true參數(shù)，為保證不會(huì)刷新跳動(dòng)，模板中有設(shè)置flag確保一次initPage

9、動(dòng)態(tài)js回填方案：load模板 → 成功會(huì)收到前端橋接Ready狀態(tài) → 客戶端收到Ready狀態(tài)會(huì)進(jìn)行initPage操作，此時(shí)只是靜態(tài)加載頁(yè)面渲染顯示給用戶看的界面，不會(huì)觸發(fā)任何網(wǎng)絡(luò)或其他模板加載，initPage成功后會(huì)回調(diào)init狀態(tài) → 客戶端收到init狀態(tài)會(huì)進(jìn)行執(zhí)行showPage操作，表示已經(jīng)進(jìn)入頁(yè)面需要繼續(xù)加載好所有未加載好的邏輯，例如圖片渲染、網(wǎng)絡(luò)請(qǐng)求、模板加載等，showPage成功后前端回調(diào)show狀態(tài) → 客戶端仍為頁(yè)面已經(jīng)加載完成，處理加載完成后的邏輯，例如打點(diǎn)上報(bào)等

10、全局并沒(méi)有持有WKWebview不釋放，而是只要進(jìn)入文章頁(yè)就會(huì)預(yù)創(chuàng)建下次需要預(yù)熱的WKWebview，保證每次的WKWebview都是干凈無(wú)歷史痕跡，在dealloc方法中會(huì)釋放雙緩存池當(dāng)前加載的WebView。