webview加载时有3个事件。触发顺序为loading、titleUpdate、loaded。
webview开始载入页面时触发loading,
载入过程中如果title已经解析并赋予新值,则触发titleUpdate,
载入完毕触发loaded。

如果页面加载足够快,那么titleUpdate和loaded几乎同时触发。
如果页面加载太慢,则loaded是全部载入完成才触发。

loaded常用于判断页面是否载入完毕,载入完毕才显示新页面。
但有时页面内容很长时,全部载入完毕比较慢,导致显示新窗体比较慢。为了让新窗体打开快点,我们可以在titleUpdate时就显示新窗体。
因为网页本身有分步渲染的机制,所以一般只要第一屏页面渲染完毕就不会让用户看到白屏。

有人问plus ready和DOMContentLoaded、onload以及上面3个事件的顺序。
plus的ready和HTML原本的事件是异步并行的,不一定谁快。
但有一些基本规律。
首先新webview的loading是最开始触发的。
然后是新webview的titleUpdate,
然后是新webview里的HTML的DOMContentLoaded,
一般情况下新webview里plus ready在DOMContentLoaded之后发生,
然后是新webview的loaded事件。
最后还有一个是新页面的body里的onload事件。

另外再提供一个判断webview载入时间的方法。
一般webview载入要多久,开发者可以自己使用计时器计时,计算从开始载入到loaded的时间差。
但首页的载入速度开发者无法编程获得,5+runtime提供了首页的webview的载入时间,plus.runtime.launchLoadedTime。
这个time最大的用途是判断手机性能。
首页正常是本地页面,同样的首页在不同手机上loadedtime值是不同的,根据这个值,就知道了这台手机载入网页的速度到底多快。
这个速度与本地io性能有关,也与渲染能力有关。
根据这个值,我们可以做很多优化。
比如在一些高性能手机上,载入新窗体很快,导致出现雪花闪一下又立即消失的情况,此时就没必要让雪花出现了,直接切屏就好了。而低性能手机即loadedtime值较低的则老老实实转雪花

提升html5的性能体验系列之五webview启动速度优化及事件顺序解析]的更多相关文章

  1. 提升HTML5的性能体验系列之五 webview启动速度优化及事件顺序解析

    webview加载时有5个事件.触发顺序为loading.titleUpdate.rendering.rendered.loaded.webview开始载入页面时触发loading,载入过程中如果&l ...

  2. 提升html5的性能体验系列之一避免切页白屏

    窗体切换白屏的现实问题 HTML5的性能比原生差很多,比如切页时白屏.列表滚动不流畅.下拉刷新和上拉翻页卡顿.在低端Android手机上,很多原生App常用的功能和体验效果都很难使用HTML5技术模拟 ...

  3. 提升HTML5的性能体验系列之一 避免切页白屏

    窗体切换白屏的现实问题 HTML5的性能比原生差很多,比如切页时白屏.列表滚动不流畅.下拉刷新和上拉翻页卡顿.在低端Android手机上,很多原生App常用的功能和体验效果都很难使用HTML5技术模拟 ...

  4. 提升html5的性能体验系列之三流畅下拉刷新

    下拉刷新 为实现下拉刷新功能,大多H5框架都是通过DIV模拟下拉回弹动画,在低端android手机(Android4.4以下)上,DIV动画经常出现卡顿现象(特别是图文列表的情况).解决方案还是web ...

  5. 提升HTML5的性能体验系列之三 流畅下拉刷新和上拉

    下拉刷新 为实现下拉刷新功能,大多H5框架都是通过DIV模拟下拉回弹动画,在低端android手机(Android4.4以下)上,DIV动画经常出现卡顿现象(特别是图文列表的情况).解决方案还是web ...

  6. 提升html5的性能体验系列之四使用原生ui

    原生UI即nativeUI的设计目的 HTML和css有一个优势就是灵活的样式设计.在大多数情况下,我们都应该使用HTML+css来负责UI.但是有些情况下,我们发现HTML+css的UI不满足需求. ...

  7. 提升HTML5的性能体验系列之四 使用原生UI

    原生UI的设计目的 HTML和css有一个优势就是灵活的样式设计.在大多数情况下,我们都应该使用HTML+css来负责UI.但是有些情况下,我们发现HTML+css的UI不满足需求.1. 绝对置顶HT ...

  8. 提升HTML5的性能体验系列之二 列表流畅滑动

    App的顶部一般有titlebar,下面是list.常见的一个需求是要在list滚动时,titlebar不动.这个简单的需求,实现起来其实并不简单. 在普通web上的做法是使用div的滚动条,把lis ...

  9. 提升html5的性能体验系列之二列表流畅滑动

    App的顶部一般有titlebar,下面是list.常见的一个需求是要在list滚动时,titlebar不动.这个简单的需求,实现起来其实并不简单. 在普通web上的做法是使用div的滚动条,把lis ...

随机推荐

  1. Fiddler AutoResponder正则替换

    今天感冒,写简单些. Fiddler AutoResponder正则替换: regex:(?inx).+20150826_1_1_386.mp4/playlist.m3u8.*$ .表示任意字符 *: ...

  2. Oracle Day3 多行函数、多表查询

    1.多行函数 Sum avg max min count 组函数具有滤空的作用(添加nvl屏蔽该功能) 分组group by 多行分组 分组过滤 where 和分组过滤的区别(having) 分组的增 ...

  3. oracle创建数据库表空间

    1.创建表空间(存放数据) create tablespace xtba_datadatafile 'F:\ORACLE\ORADATA\ORCL\XTBA.DBF'size 50mautoexten ...

  4. 安装、配置、启动FTP、SSH或NFS服务

    (1)准备使用软件维护工具apt-get. Ubuntu7.10中没有安装FTP.SSH.NFS服务器软件,它提供了一个很方便的安装.升级.维护软件的工具apt-get.apt-get从光盘.网络上下 ...

  5. while循环与i--

    int i = 5;         while(i-- > 0){             System.out.println("i="+i);         } 打印 ...

  6. iOStextView的代理方法展示

    UITextView的代理方法 textViewShouldBeginEditing: and textViewDidBeginEditing: - (BOOL)textViewShouldBegin ...

  7. C#中Bitmap类 对图像の操作 可检测图片完整性

    try { Bitmap bm = new Bitmap(pics[ip]); BitmapToBytes(bm).Reverse().Take(2); } catch (Exception ex) ...

  8. 关于table参数的一些问题

    1.关于单元格合并 写在td标签上,如: <td rowspan="3"></td> 跨行合并:rowspan 跨列合并:colspan 2.关于多行输入框 ...

  9. js调用函数的格式

    如题 onclick='alert(\""+"&#1"+"\")' onclick='alert(encodeURIComponen ...

  10. 使用TcpTrace小工具截获Web Service的SOAP报文

    Web Service客户端对服务端进行调用时,请求和响应都使用SOAP报文进行通讯.在开发和测试时,常常查看SOAP报文的内容,以便进行分析和调试.TcpTrace是一款比较小巧的工具,可以让我们截 ...