页面加载方法、装置、电子设备及存储介质制造方法及图纸

技术编号:29936987 阅读:30 留言:0更新日期:2021-09-04 19:15
本发明专利技术涉及数据处理技术领域,提供一种页面加载方法、装置、电子设备及存储介质,包括:响应于页面访问指令,进入H5页面;在H5页面显示原生加载态;获取H5页面对应的第一HTML文件;根据第一HTML文件确定H5页面所需的第一资源,并下载第一资源;计算H5页面加载第一资源的首屏时间,根据首屏时间设置定时器,响应于定时器到期,隐藏原生加载态;根据第一资源对H5页面进行渲染并显示;响应于H5页面的切换指令,获取切换的H5页面所需的第二资源;根据第一资源及第二资源确定目标资源并下载目标资源;根据目标资源对切换的H5页面进行渲染并显示。本发明专利技术不仅能够解决白屏问题,提高页面加载效果,还能在页面切换时快速切换页面。还能在页面切换时快速切换页面。还能在页面切换时快速切换页面。

【技术实现步骤摘要】
页面加载方法、装置、电子设备及存储介质


[0001]本专利技术涉及数据处理
,具体涉及一种页面加载方法、装置、电子设备及存储介质。

技术介绍

[0002]现有的页面加载方法包括Webview加载态和原生加载态,但Webview加载态是纯Webview完成的,由于Webview需要先下载HTML文件,才能展示加载态,因此不可避免在刚刚进入页面时会有一定的白屏时间,影响了用户体验。而使用原生加载态,可以从一进入页面即展示加载态,避免了页面白屏,但原生加载态展示时间过长,即使已经加载出了部分内容,展示的还是加载态,同样严重影响了用户体验。由于其要等到Webview加载完成才隐藏加载态,当遇到复杂的页面,特别是多图和大图页面,当有部分内容在Webview中渲染出来了时,加载完成函数(onPageFinished)还是不会被回调,只有等到所有内容加载完毕,该函数才会被回调,此时距离部分内容在Webivew中渲染可能有几秒钟,大幅延长了加载态的时间。

技术实现思路

[0003]鉴于以上内容,有必要提出一种页面加载方法、装置、电子设备及本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种页面加载方法,其特征在于,所述方法包括:响应于页面访问指令,进入H5页面;在所述H5页面显示原生加载态;获取所述H5页面对应的第一HTML文件;根据所述第一HTML文件确定所述H5页面所需的第一资源,并下载所述第一资源;计算所述H5页面加载所述第一资源的首屏时间;根据所述首屏时间设置定时器,响应于所述定时器到期,隐藏所述原生加载态;根据所述第一资源对所述H5页面进行渲染并显示;响应于H5页面的切换指令,获取所述切换的H5页面所需的第二资源;根据所述第一资源及所述第二资源确定目标资源并下载所述目标资源;根据所述目标资源对所述切换的H5页面进行渲染并显示。2.如权利要求1所述的页面加载方法,其特征在于,所述根据所述第一HTML文件确定所述H5页面所需的第一资源包括:对所述第一HTML文件进行解析,得到多个脚本语言节点;根据所述多个脚本语言节点内容创建DOM节点树;从所述DOM节点树的根节点开始遍历所述DOM树中的每一个DOM节点;将遍历到的DOM节点内容确定为所述H5页面所需的第一资源。3.如权利要求1所述的页面加载方法,其特征在于,所述下载所述第一资源包括:向预设服务器发起所述第一资源的获取请求,所述第一资源的获取请求用于获取所述第一资源的目标资源路径;接收所述预设服务器针对所述第一资源的获取请求的反馈信息,所述反馈信息中携带所述目标资源路径;下载所述目标资源路径对应的第一资源。4.如权利要求1所述的页面加载方法,其特征在于,所述计算所述H5页面加载所述第一资源的首屏时间包括:获取接收到所述页面访问指令的第一时间点;通过视窗属性值获取所述H5页面的可视区域,并从所述第一资源中获取位于所述可视区域内的目标元素;获取所述目标元素的打开时间并根据所述打开时间确定第二时间点;根据所述第二时间点及所述第一时间点计算首屏时间。5.如权利要求1所述的页面加载方法,其特征在于,在隐藏所述原生加载态之后,所述方法还包括:遍历获取所述第一资源的标签,并在每个标签中添...

【专利技术属性】
技术研发人员:张龙
申请(专利权)人:中国平安财产保险股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1