iOS下Cordova頁(yè)面加載問(wèn)題

<h3>一唯鸭、頁(yè)面呈現(xiàn)之前出現(xiàn)空白頁(yè)面 </h3>
使用html頁(yè)面肯定要考慮加載速度的問(wèn)題梳玫,當(dāng)我們部署上頁(yè)面后發(fā)現(xiàn)职烧,每次進(jìn)入都會(huì)有短暫的空白頁(yè)面出現(xiàn)。這是在使用UIWebview時(shí)一定會(huì)出現(xiàn)的現(xiàn)象。
解決這一問(wèn)題的方法有兩種俱笛,一種是添加類似于正在加載的狀態(tài)框,或是動(dòng)畫(huà),來(lái)提高體驗(yàn)度汰瘫。其次是使用一張與頁(yè)面一模一樣的圖片,先讓他添加到當(dāng)前的view上擂煞,并在頁(yè)面加載完成后remove該圖片混弥。所以你必須準(zhǔn)備4張不同尺寸的圖片,并且可能經(jīng)常需要替換這4張圖片颈娜。雖然麻煩剑逃,但給用戶的感覺(jué)相對(duì)更好一些。(此處有坑)
如果頁(yè)面長(zhǎng)時(shí)間沒(méi)有加載出官辽,這就意味著用戶即將點(diǎn)擊的頁(yè)面可能就是那張圖片蛹磺,后果可想而知。而且我們不能保證服務(wù)器一定不會(huì)抽風(fēng)同仆。所以又想了另一個(gè)法子萤捆,給app本地留一個(gè)頁(yè)面,與遠(yuǎn)程頁(yè)面保持一致。此時(shí)你需要把所有頁(yè)面上的所有資源拷到app中俗或,并讓他先加載本地的頁(yè)面市怎,再加載遠(yuǎn)程的頁(yè)面。都一樣了辛慰,為什么還要加載遠(yuǎn)程区匠,不加載遠(yuǎn)程,我還弄html頁(yè)面作甚帅腌?
所以此時(shí)的加載順序是:圖片->本地頁(yè)面->遠(yuǎn)程頁(yè)面驰弄。頁(yè)面肯定會(huì)有刷新的感覺(jué),這是目前沒(méi)法避免的一個(gè)體驗(yàn)度上的問(wèn)題速客。加載時(shí)機(jī)也同樣重要戚篙,遠(yuǎn)程頁(yè)面必須在本地頁(yè)面加載完成后才能開(kāi)始加載。在Cordova中溺职,頁(yè)面開(kāi)始加載以及加載完成都會(huì)發(fā)出一個(gè)通知岔擂,我們可以監(jiān)聽(tīng)這個(gè)通知,并通過(guò)判斷當(dāng)前視圖來(lái)確定本地頁(yè)面是否已加載完成浪耘。

 NSNotificationCenter *center = [NSNotificationCenter defaultCenter];
 [center addObserver:self
                   selector:@selector(onNotification:)
                       name:CDVPluginResetNotification  // 開(kāi)始加載
                     object:nil];
 [center addObserver:self
                   selector:@selector(onNotification:)
                       name:CDVPageDidLoadNotification  // 加載完成
                     object:nil]; 

<h3>二乱灵、多Cordova頁(yè)面加載時(shí)出現(xiàn)延遲假象</h3>
假設(shè)A和B兩個(gè)視圖,從A可以push出B点待,且A和B都繼承CDVViewController阔蛉,也就是這兩個(gè)視圖都會(huì)加載網(wǎng)頁(yè)。你會(huì)發(fā)現(xiàn)很尷尬的情況癞埠,當(dāng)推出B的時(shí)候状原,B很長(zhǎng)時(shí)間都是空白,即便B先加載本地苗踪,也是如此颠区,所以和網(wǎng)速?zèng)]有關(guān)系。
在日志中你發(fā)現(xiàn)會(huì)有類似Gave lock 3的文字通铲,什么鬼毕莱?!細(xì)究后才發(fā)現(xiàn)颅夺,原來(lái)是Cordova有一個(gè)鎖的機(jī)制朋截,當(dāng)A頁(yè)面還未完全加載時(shí),哪怕你已經(jīng)推出B視圖吧黄,他還是會(huì)等A加載完成后才會(huì)去加載B部服。至于為什么要加這個(gè)鎖還得認(rèn)真看下源碼,但可以確定的是我們不能隨便去除掉這個(gè)鎖機(jī)制拗慨,因?yàn)檫@個(gè)特性是在Cordova版本升級(jí)時(shí)刻意做的優(yōu)化廓八,在不了解的情況下奉芦,不動(dòng)為好。只能繼續(xù)填坑剧蹂。
我們A頁(yè)面包含本地頁(yè)面A1和遠(yuǎn)程頁(yè)面A2声功,遠(yuǎn)程頁(yè)面是收到本地頁(yè)面加載完成后才去加載的,所以不會(huì)出現(xiàn)鎖的問(wèn)題宠叼。但是B視圖不能夠根據(jù)接收通知來(lái)決定加載與否先巴。解決辦法是 只要讓A1和A2盡快加載完成。加載是一回事冒冬,刷新是另外一回事筹裕。只要加載完成,隨后做刷新已經(jīng)不會(huì)影響其他頁(yè)面加載了窄驹。那么我們讓A1和A2先加載一個(gè)名為index.html的空白頁(yè)面,再刷新為實(shí)際加載的頁(yè)面证逻,這樣B視圖的加載已經(jīng)看不到延遲了乐埠。
此時(shí)又得解決刷新的問(wèn)題了,UIWebView直接更改url并reload是沒(méi)有用的囚企。必須聲明一個(gè)NSURLRequest丈咐,并重新loadRequest。刷新時(shí)的url必須是符合Cordova規(guī)則的url龙宏。在Cordova源碼中有一個(gè)appUrl的方法棵逊,通過(guò)這個(gè)方法轉(zhuǎn)出的url才能被CDVViewController正常加載。代碼:

localWebVC.wwwFolderName = @"www";
localWebVC.startPage = @"local.html";
NSURL *url = [self.localWebVC performSelector:@selector(appUrl)];
if (url)
 {
       NSURLRequest *request = [[NSURLRequest alloc] initWithURL:url];
       [self.localWebVC.webView loadRequest:request];
}

以上是使用Cordova時(shí)银酗,對(duì)頁(yè)面加載問(wèn)題的一些總結(jié)辆影,期待大家分享更完美的方案。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末黍特,一起剝皮案震驚了整個(gè)濱河市蛙讥,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌灭衷,老刑警劉巖次慢,帶你破解...
    沈念sama閱讀 218,682評(píng)論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異翔曲,居然都是意外死亡迫像,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,277評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門(mén)瞳遍,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)闻妓,“玉大人,你說(shuō)我怎么就攤上這事傅蹂》坠耄” “怎么了算凿?”我有些...
    開(kāi)封第一講書(shū)人閱讀 165,083評(píng)論 0 355
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)犁功。 經(jīng)常有香客問(wèn)我氓轰,道長(zhǎng),這世上最難降的妖魔是什么浸卦? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,763評(píng)論 1 295
  • 正文 為了忘掉前任署鸡,我火速辦了婚禮,結(jié)果婚禮上限嫌,老公的妹妹穿的比我還像新娘靴庆。我一直安慰自己,他們只是感情好怒医,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,785評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布炉抒。 她就那樣靜靜地躺著,像睡著了一般稚叹。 火紅的嫁衣襯著肌膚如雪焰薄。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 51,624評(píng)論 1 305
  • 那天扒袖,我揣著相機(jī)與錄音塞茅,去河邊找鬼。 笑死季率,一個(gè)胖子當(dāng)著我的面吹牛野瘦,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播飒泻,決...
    沈念sama閱讀 40,358評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼鞭光,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了蠢络?” 一聲冷哼從身側(cè)響起衰猛,我...
    開(kāi)封第一講書(shū)人閱讀 39,261評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎刹孔,沒(méi)想到半個(gè)月后啡省,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,722評(píng)論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡髓霞,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,900評(píng)論 3 336
  • 正文 我和宋清朗相戀三年卦睹,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片方库。...
    茶點(diǎn)故事閱讀 40,030評(píng)論 1 350
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡结序,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出纵潦,到底是詐尸還是另有隱情徐鹤,我是刑警寧澤垃环,帶...
    沈念sama閱讀 35,737評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站返敬,受9級(jí)特大地震影響遂庄,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜劲赠,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,360評(píng)論 3 330
  • 文/蒙蒙 一涛目、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧凛澎,春花似錦霹肝、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,941評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至最铁,卻和暖如春苗沧,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背炭晒。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,057評(píng)論 1 270
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留甥角,地道東北人网严。 一個(gè)月前我還...
    沈念sama閱讀 48,237評(píng)論 3 371
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像嗤无,于是被迫代替她去往敵國(guó)和親震束。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,976評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容

  • 1当犯,今天回來(lái)跟娃講了垢村,早上吃的牛肉面,和中午丁香排骨的樣子和口味嚎卫,娃也提了幼兒園中午吃的嘉栓,而且自從我說(shuō)了中午吃飯后...
    酒低三分閱讀 215評(píng)論 1 0
  • 2017/10/17【能量世界1040天】 豆丁公寓 意想不到,我們五個(gè)人又一起倒下了拓诸。 在做菜的過(guò)程中侵佃,我就感到...
    陳艷霞小樹(shù)媽閱讀 202評(píng)論 0 2
  • 一.要點(diǎn) 1.final關(guān)鍵字可以用于成員變量、本地變量奠支、方法以及類馋辈。2.final成員變量必須在聲明的時(shí)候初始化...
    ClawHub的技術(shù)分享閱讀 92評(píng)論 0 0
  • 現(xiàn)在經(jīng)常聽(tīng)到這句話,“有能力的話就要送孩子到美國(guó)念書(shū)倍谜,這樣對(duì)孩子的未來(lái)比較好”迈螟,為什么呢叉抡?在1900~20...
    zongguoyong閱讀 214評(píng)論 0 0