webview-從業(yè)務(wù)出發(fā)的思考

背景:公司業(yè)務(wù)2B業(yè)務(wù)起步谈山,為了app能盡快上線冗锁,所以針對一些核心功能使用了H5編寫瓦盛。

問題:核心功能帶來 ---> 用戶高頻觸發(fā)。而H5從webview打開 到 H5 頁面展示出來棱貌,在ios iphone5 和 iphone6機(jī)型上打開緩慢。

webview性能

從用戶使用的過程箕肃,大致如下:

1.打開了一個新的窗口

2.頁面白屏

3.頁面基本骨架渲染出來婚脱,但是沒有數(shù)據(jù)

4.數(shù)據(jù)獲取完成,頁面整體渲染結(jié)束

慢的一部分原因:webview去加載url并不像是 瀏覽器 加載url的過程勺像,webview存在一個初始化的過程起惕。

過程如圖:

圖參考自:美團(tuán)技術(shù)團(tuán)隊


所以,webview加載url咏删,第一步并不是建立連接惹想,而是啟動瀏覽器內(nèi)核。

優(yōu)化思路

全局webview

app打開初始化一個全局的webview備用督函,并且將它隱藏嘀粱,所以對于用戶來講是無感知的激挪。但是這種做法也來帶額外的內(nèi)存開銷。但是有時候也是一種不錯的選擇锋叨。

為什么垄分?

業(yè)務(wù)場景舉例:app首頁banner點擊 ---->? 打開webview加載url ----> h5頁面點擊跳轉(zhuǎn)繼續(xù)打開一個webview去加載url。

所以娃磺,針對這種h5頁面并不是在同一個webview的交互薄湿,如果使用這種優(yōu)化手段是一個不錯的選擇。

數(shù)據(jù)參考:美團(tuán)技術(shù)團(tuán)隊


因為app打開創(chuàng)建了全局的webview偷卧,所以接下來所有的webview打開的內(nèi)存消耗都只是二次打開帶來的內(nèi)存開銷豺瘤。

客戶端代理數(shù)據(jù)請求

1.在客戶端初始化webview的時候,直接由客戶端請求數(shù)據(jù)

2.頁面加載結(jié)束听诸,從客戶端讀取數(shù)據(jù)

個人對這種設(shè)計思維并不是很看好:

1.客戶端代理數(shù)據(jù)請求注定需要客戶端和H5通信 坐求,本來簡單的H5頁面就要使用jsbridge

2.jsbridge的初始化也是需要時間的

webview優(yōu)化,主要是圍繞兩點:

1.在使用前預(yù)先初始化好WebView晌梨,從而減小耗時桥嗤。

2.在初始化的同時,通過Native來完成一些網(wǎng)絡(luò)請求等過程仔蝌,使得WebView初始化不是完全的阻塞后續(xù)過程泛领。


ps:

參考自:https://tech.meituan.com/WebViewPerf.html

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市敛惊,隨后出現(xiàn)的幾起案子师逸,更是在濱河造成了極大的恐慌,老刑警劉巖豆混,帶你破解...
    沈念sama閱讀 218,941評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件篓像,死亡現(xiàn)場離奇詭異,居然都是意外死亡皿伺,警方通過查閱死者的電腦和手機(jī)员辩,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,397評論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來鸵鸥,“玉大人奠滑,你說我怎么就攤上這事《恃ǎ” “怎么了宋税?”我有些...
    開封第一講書人閱讀 165,345評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長讼油。 經(jīng)常有香客問我杰赛,道長,這世上最難降的妖魔是什么矮台? 我笑而不...
    開封第一講書人閱讀 58,851評論 1 295
  • 正文 為了忘掉前任乏屯,我火速辦了婚禮根时,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘辰晕。我一直安慰自己蛤迎,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 67,868評論 6 392
  • 文/花漫 我一把揭開白布含友。 她就那樣靜靜地躺著替裆,像睡著了一般。 火紅的嫁衣襯著肌膚如雪窘问。 梳的紋絲不亂的頭發(fā)上辆童,一...
    開封第一講書人閱讀 51,688評論 1 305
  • 那天,我揣著相機(jī)與錄音南缓,去河邊找鬼。 笑死荧呐,一個胖子當(dāng)著我的面吹牛汉形,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播倍阐,決...
    沈念sama閱讀 40,414評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼概疆,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了峰搪?” 一聲冷哼從身側(cè)響起岔冀,我...
    開封第一講書人閱讀 39,319評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎概耻,沒想到半個月后使套,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,775評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡鞠柄,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,945評論 3 336
  • 正文 我和宋清朗相戀三年侦高,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片厌杜。...
    茶點故事閱讀 40,096評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡奉呛,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出夯尽,到底是詐尸還是另有隱情瞧壮,我是刑警寧澤,帶...
    沈念sama閱讀 35,789評論 5 346
  • 正文 年R本政府宣布匙握,位于F島的核電站咆槽,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏圈纺。R本人自食惡果不足惜罗晕,卻給世界環(huán)境...
    茶點故事閱讀 41,437評論 3 331
  • 文/蒙蒙 一济欢、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧小渊,春花似錦法褥、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,993評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至呐萨,卻和暖如春杀饵,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背谬擦。 一陣腳步聲響...
    開封第一講書人閱讀 33,107評論 1 271
  • 我被黑心中介騙來泰國打工切距, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人惨远。 一個月前我還...
    沈念sama閱讀 48,308評論 3 372
  • 正文 我出身青樓谜悟,卻偏偏與公主長得像,于是被迫代替她去往敵國和親北秽。 傳聞我的和親對象是個殘疾皇子葡幸,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,037評論 2 355