框架技术---MUI框架性能优化之预加载

MUI框架预加载子页面

在app中使用父页面加载子页面时，这两个页面是两个不同的webview。

在不适用预加载的情况下：

会出现父页面进入子页面白屏，或者数据加载慢，会看到数据在子页面的跳动。

在使用预加载情况：

• 在父页面js中预先将子页面加载了，

mui.plusReady(function() {
				mui.preload({
					url: 'child.html',
					id: 'child.html'
				});
				// 获取预加载的子页面的webview
				sub_page = plus.webview.getWebviewById('child.html');
			});
           

• 在父页面中触发跳转的地方使用mui.fire()跳转；get_deatil是自定义的函数名称。

  title_和id_是父页面给子页面传的参数，没有要传的参数空着。

mui.fire(sub_page, 'get_detail', {
						title_: title,
						id_: id
					});
           

• 在子页面接收参数，没有参数可以不接受跳过这一步。

  在子页面页面的js中，

  mui.plusReady(function() { 中添加下面事件

window.addEventListener('get_detail',function(event){
			var title = event.detail.title_;
			var id = event.detail.id_;
			if(!title || !id){
				return;
			}
	}
           

• 打开子页面（可以在show中添加动画参数）