页面加载方法、装置、电子设备及存储介质.pdf

(19)中华人民共和国国家知识产权局(12)发明专利申请(10)申请公布号CN113343154A(43)申请公布日2021.09.03(21)申请号202110723298.9(22)申请日2021.06.29(71)申请人中国平安财产保险股份有限公司地址518033广东省深圳市福田区益田路5033号平安金融中心12、13、38、39、40层(72)发明人张龙(74)专利代理机构深圳市赛恩倍吉知识产权代理有限公司44334代理人严林刘丽华(51)Int.Cl.G06F16/958(2019.01)G06F16/955(2019.01)权利要求书2页说明书13页附图2页(54)发明名称页面加载方法、装置、电子设备及存储介质(57)摘要本发明涉及数据处理技术领域，提供一种页面加载方法、装置、电子设备及存储介质，包括：响应于页面访问指令，进入H5页面；在H5页面显示原生加载态；获取H5页面对应的第一HTML文件；根据第一HTML文件确定H5页面所需的第一资源，并下载第一资源；计算H5页面加载第一资源的首屏时间，根据首屏时间设置定时器，响应于定时器到期，隐藏原生加载态；根据第一资源对H5页面进行渲染并显示；响应于H5页面的切换指令，获取切换的H5页面所需的第二资源；根据第一资源及第二资源确定目标资源并下载目标资源；根据目标资源对切换的H5页面进行渲染并显示。本发明不仅能够解决白屏问题，提高页面加载效果，还能在页面切换时快速切换页面。CN113343154ACN113343154A权利要求书1/2页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所述的页面加载方法，其特征在于，在隐藏所述原生加载态之后，所述方法还包括：遍历获取所述第一资源的标签，并在每个标签中添加目标事件；查看所述目标事件的状态；根据所述目标事件的状态判断所述第一资源是否下载完毕；当根据所述目标事件的状态确定所述第一资源下载完毕，触发所述下载完毕指令并执行所述根据所述第一资源对所述H5页面进行渲染并显示。6.如权利要求5所述的页面加载方法，其特征在于，所述根据所述目标事件的状态判断所述第一资源是否下载完毕包括：2CN113343154A权利要求书2/2页判断每个目标事件的状态是否为预设状态；当每个目标事件的状态为所述预设状态时，确定所述第一资源下载完毕；当至少有一个目标事件的状态不为所述预设状态时，确定所述第一资源未下载完毕。7.如权利要求1至6中任意一项所述的页面加载方法，其特征在于，所述目标资源为所述第一资源中与所述第二资源不同的资源。8.一种页面加载装置，其特征在于，所述装置包括：进入模块，用于响应于页面访问指令，进入H5页面；显示模块，用于在所述H5页面显示原生加载态；获取模块，用于获取所述H5页面对应的第一HTML文件；下载模块，用于根据所述第一HTML文件确定所述H5页面所需的第一资源，并下载所述第一资源；计算模块，用于计算所述H5页面加载所述第一资源的首屏时间；隐藏模块