mui預加載


預加載

頁面正常打開步驟:先創建 -> 在顯示

plus.webview.create( url, id, styles, extras ); // 創建頁面
plus.webview.show( id_wvobj, aniShow, duration, showedCB, extras ); // 顯示已經創建的或者隱藏的窗口
plus.webview.open( url, id, styles, aniShow, duration, showedCB ); // 創建並打開

問題:在創建打開頁面時,比較費時,會出現等待框,影響用戶體驗,所以用到預加載技術

預加載是在頁面還沒用到的時候提前創建,當用到的時候直接顯示,節約時間,mui提供了兩種預加載的方式

mui.init異步加載多個頁面

mui.init({
  preloadPages:[
    {
      url:prelaod-page-url,
      id:preload-page-id,
      styles:{},//窗口參數
      extras:{},//自定義擴展參數
      subpages:[{},{}]//預加載頁面的子頁面
    }
  ],
  preloadLimit:5//預加載窗口數量限制(一旦超出,先進先出)默認不限制
});

問題:因為是異步執行,所以可能會出現無法立即得到webview對象,如下

mui.init({
  preloadPages:[
    {
      url:'list.html',
      id:'list'
    }
  ]
});
var list = plus.webview.getWebviewByid('list');//這里可能返回空;

mui.preload 同步立即返回webview對象,加載1個頁面

var page = mui.preload({
    url:new-page-url,
    id:new-page-id,//默認使用當前頁面的url作為id
    styles:{},//窗口參數
    extras:{}//自定義擴展參數
});

判斷預加載是否成功

方式1在父頁面通過如下代碼獲取當前所有的webview對象,通過if判斷是否預加載進來

mui.plusReady(function(){
	setTimeout(function(){
		var array = plus.webview.all();
		if(array){
			for(var i=0,len=array.length;i<len;i++){
			    	console.log(array[i].getURL());
		        }
		}
	},5000)
});

方式2,通過觀察預加載頁面打開時沒有等待框,mui.openWindow默認先顯示等待框


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM