H5页面的预加载及跳转方法、装置、设备及介质制造方法及图纸

技术编号:26596716 阅读:43 留言:0更新日期:2020-12-04 21:18
本发明专利技术涉及H5页面领域,提供一种H5页面的预加载及跳转方法、装置、设备及介质,所述方法包括:通过获取页面加载请求中的第一H5页面数据;对第一H5页面进行加载及渲染;通过Native接口接收自动触发的第二H5页面预加载信息,将第二H5页面预加载信息封装为包含多个配置参数请求信息的接口请求信息;通过多线程异步方式,发出各配置参数请求信息,将配置参数加载信息预加载至基于Native的缓存池,同时监控预加载过程,并通知第一H5页面实时更新显示预加载进度;在通过Native接口接收到第二H5页面跳转请求,且加载、渲染并显示第二H5页面。本发明专利技术实现了通过多线程异步方式自动预加载第二H5页面以及实时更新预加载进度,通过缓存池加载、渲染并显示第二H5页面。

【技术实现步骤摘要】
H5页面的预加载及跳转方法、装置、设备及介质
本专利技术涉及H5页面领域,尤其涉及一种H5页面的预加载及跳转方法、装置、设备及介质。
技术介绍
随着移动互联网的发展,移动App产品已经成为移动互联网产品最大的流量渠道,目前,移动App产品通常会采用H5承载业务服务,Native承载基础组件服务(如加载H5页面并提供页面路由等)的方式进行开发,然而基于H5页面的技术特性,由于网络信号弱或H5渲染数据容量大等因素存在,在加载H5页面过程中,可能会出现一直显示空白页面直至加载完H5页面数据并渲染H5页面后才显示H5页面的情况,并且,在显示空白页面过程中,不能进行任何操作,也不知道加载的进度,因此会导致加载时间长;且H5页面加载受限于网络信号弱的状态影响,会造成H5页面加载时效性差,且导致用户体验度低。
技术实现思路
本专利技术提供一种H5页面的预加载及跳转方法、装置、计算机设备及存储介质,实现了通过多线程异步方式,自动预加载第二H5页面至缓存池,以及实时更新显示预加载进度,通过缓存池加载、渲染并显示第二H5页面,能够缩短了H5页面本文档来自技高网...

【技术保护点】
1.一种H5页面的预加载及跳转方法,其特征在于,包括:/n接收到页面加载请求,获取所述页面加载请求中的第一H5页面数据;/n根据所述第一H5页面数据对第一H5页面进行加载及渲染;/n在第一H5页面渲染完毕并显示之后,通过Native接口接收已显示的所述第一H5页面自动触发的第二H5页面预加载信息,将所述第二H5页面预加载信息封装为接口请求信息;所述接口请求信息包括多个配置参数请求信息;/n通过多线程异步方式,发出各所述配置参数请求信息,并在接收到的与所述配置参数请求信息对应的配置参数加载信息之后,将所述配置参数加载信息预加载至基于Native的缓存池,同时监控所有所述配置参数加载信息的预加载过...

【技术特征摘要】
1.一种H5页面的预加载及跳转方法,其特征在于,包括:
接收到页面加载请求,获取所述页面加载请求中的第一H5页面数据;
根据所述第一H5页面数据对第一H5页面进行加载及渲染;
在第一H5页面渲染完毕并显示之后,通过Native接口接收已显示的所述第一H5页面自动触发的第二H5页面预加载信息,将所述第二H5页面预加载信息封装为接口请求信息;所述接口请求信息包括多个配置参数请求信息;
通过多线程异步方式,发出各所述配置参数请求信息,并在接收到的与所述配置参数请求信息对应的配置参数加载信息之后,将所述配置参数加载信息预加载至基于Native的缓存池,同时监控所有所述配置参数加载信息的预加载过程,并通知所述第一H5页面实时更新显示预加载进度;
在通过所述Native接口接收到来自所述第一H5页面的第二H5页面跳转请求,且检测到所有所述配置参数加载信息的预加载完毕之后,根据所述缓存池中的所有所述配置参数加载信息进行加载、渲染并显示第二H5页面。


2.如权利要求1所述的H5页面的预加载及跳转方法,其特征在于,所述接收到页面加载请求之前,包括:
通过单例方式,构建预加载H5页面管理中心;
通过所述预加载H5页面管理中心,创建所述缓存池,并获取应用程序服务器中的线上配置表数据;
将获取的所述线上配置表数据存储至所述缓存池,并记录为配置表数据。


3.如权利要求1所述的H5页面的预加载及跳转方法,其特征在于,所述根据所述第一H5页面数据对第一H5页面进行加载及渲染,包括:
从所述缓存池中的所述配置表数据中获取到与所述第一H5页面数据中的配置字段匹配的H5页面配置数据;
对所述第一H5页面数据和所述H5页面配置数据进行加载,得到待渲染H5页面数据;
对所述待渲染H5页面数据进行渲染,生成所述第一H5页面,并显示所述第一H5页面。


4.如权利要求1所述的H5页面的预加载及跳转方法,其特征在于,所述监控所有所述配置参数加载信息的预加载过程,并在所述第一H5页面实时刷新显示预加载进度,包括:
通过均等分法,划分各所述配置参数请求信息对应的占比信息;
监控到所述配置参数加载信息预加载至所述缓存池后,获取与所述配置参数加载信息对应的所述占比信息;
通过Native接口,将获取的所述占比信息通知至所述第一H5页面,以供所述第一H5页面根据所述占比信息实时更新显示所述预加载进度。


5.如权利要求1所述的H5页面的预加载及跳转方法,其特征在于,所述根据所述缓存池中的所有所述配置参数加载信息进行加载、渲染并显示第二H5页面,包括:
获取所述缓存池中的所有所述配置参数加载信息;
指示所述第一H5...

【专利技术属性】
技术研发人员:梁承飞
申请(专利权)人:平安普惠企业管理有限公司
类型:发明
国别省市:广东;44

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

1