页面加载方法技术

技术编号:39722387 阅读:5 留言:0更新日期:2023-12-17 23:28
本申请涉及一种页面加载方法

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


[0001]本申请涉及页面加载领域,尤其涉及一种页面加载方法

装置

电子设备及存储介质


技术介绍

[0002]在目前的互联网应用中,用户触发页面加载时,客户端会向服务端请求一整个页面的内容数据,其中,一个页面由页面的基本属性
(
如标题

背景色
)
以及包含的页面模块数量与各页面模块所属页面位置组成
(
这些称为页面的元数据
)
,以及每个页面模块自身的元数据

[0003]现有技术中,服务端在获取到一个页面完整的内容数据之后,才会将完整的内容数据发送给客户端进行渲染展示

也就是说,服务端采用并行阻塞式传输的方式向客户端返回页面的内容数据

[0004]由于服务端是等待完整的内容数据完成后才向客户端返回数据的,因此在等待的这段时间内网络是空闲的,并且一个页面完整的内容数据需要进行一次性传输,如此将导致传输耗时较长,尤其是在页面的数据体量较大,或者是弱网环境中,页面的内容数据传输的很慢,影响用户浏览页面时的体验感


技术实现思路

[0005]本申请提供了一种页面加载方法

装置

电子设备及存储介质,以解决现有技术中服务端一次性将整个页面的内容数据传输给客户端导致存在网络空闲时段,且传输体量较大,传输耗时较长,影响用户浏览页面时体验感的技术问题

[0006]第一方面,本申请提供了一种页面加载方法,所述方法包括:
[0007]接收来自客户端的页面加载请求,获取所述客户端待加载的目标页面的页面数据,所述页面数据中包括页面的元数据以及多个页面模块的元数据,所述页面的元数据和所述页面模块的元数据互相独立;
[0008]根据所述页面数据确定所述目标页面包含的多个页面模块,不同的所述页面模块互相独立;
[0009]并行获取每个所述页面模块的页面模块数据,以及每当获取到一个所述页面模块数据时,则将获取到的所述页面模块数据发送至所述客户端,以使所述客户端每当接收到一个所述页面模块数据是,则对接收到的所述页面模块数据进行渲染

[0010]可选的,所述根据所述页面数据确定所述目标页面包含的多个页面模块,包括:
[0011]从所述页面数据中提取多个页面模块的元数据;
[0012]根据所述多个页面模块的元数据确定所述目标页面包含的多个页面模块

[0013]可选的,所述方法还包括:
[0014]从所述页面数据中提取所述目标页面的元数据;
[0015]将所述目标页面的元数据形成一个页面模块

[0016]可选的,所述并行获取每个所述页面模块的页面模块数据,包括:
[0017]针对每个所述页面模块并行执行以下处理:
[0018]根据所述页面模块的元数据,向页面模块服务系统发送页面模块数据获取请求,以使所述页面模块服务系统响应于所述页面模块数据获取请求返回对应的页面模块数据,所述页面模块服务系统为页面模块数据的提供方

[0019]第二方面,本申请提供了另一种页面加载方法,所述方法包括:
[0020]向服务端发送页面加载请求,以使所述服务端根据所述页面加载请求获取客户端待加载的目标页面的页面数据,所述页面数据中包括页面的元数据以及多个页面模块的元数据,所述页面的元数据和所述页面模块的元数据互相独立;根据所述页面数据确定所述目标页面包含的多个页面模块;并行获取每个所述页面模块的页面模块数据,以及每当获取到一个所述页面模块数据时,则将获取到的所述页面模块数据发送至所述客户端,不同的所述页面模块互相独立;
[0021]每当接收到一个所述页面模块数据时,则对接收到的所述页面模块数据进行渲染

[0022]可选的,所述每当接收到一个所述页面模块数据时,则对接收到的所述页面模块数据进行渲染,包括:
[0023]每当接收到一个所述页面模块数据时,则执行以下步骤:
[0024]将接收到的所述页面模块数据渲染成一个虚拟
DOM
节点;
[0025]确定接收到的所述页面模块数据对应的页面模块在所述目标页面中的位置信息;
[0026]根据所述位置信息确定所述虚拟
DOM
节点在虚拟
DOM
树中的位置;
[0027]按照所述虚拟
DOM
节点在虚拟
DOM
树中的位置,将所述虚拟
DOM
节点添加至所述虚拟
DOM
树中

[0028]第三方面,本申请提供了一种页面加载装置,所述装置包括:
[0029]请求接收模块,用于接收来自客户端的页面加载请求;
[0030]第一数据获取模块,用于获取所述客户端待加载的目标页面的页面数据,所述页面数据中包括页面的元数据以及多个页面模块的元数据,所述页面的元数据和所述页面模块的元数据互相独立;
[0031]确定模块,用于根据所述页面数据确定所述目标页面包含的多个页面模块,不同的所述页面模块互相独立;
[0032]第二数据获取模块,用于并行获取每个所述页面模块的页面模块数据;
[0033]数据发送模块,用于每当获取到一个所述页面模块数据时,则将获取到的所述页面模块数据发送至所述客户端,以使所述客户端每当接收到一个所述页面模块数据时,则对接收到的所述页面模块数据进行渲染

[0034]第四方面,本申请提供了另一种页面加载装置,所述装置包括:
[0035]请求发送模块,用于向服务端发送页面加载请求,以使所述服务端根据所述页面加载请求获取客户端待加载的目标页面的页面数据,所述页面数据中包括页面的元数据以及多个页面模块的元数据,所述页面的元数据和所述页面模块的元数据互相独立;根据所述页面数据确定所述目标页面包含的多个页面模块;并行获取每个所述页面模块的页面模块数据,以及每当获取到一个所述页面模块数据时,则将获取到的所述页面模块数据发送
至所述客户端,不同的所述页面模块互相独立;
[0036]渲染模块,用于每当接收到一个所述页面模块数据时,则对接收到的所述页面模块数据进行渲染

[0037]第五方面,本申请提供了一种电子设备,包括:处理器和存储器,所述处理器用于执行所述存储器中存储的页面加载程序,以实现第一方面或第二方面中任一项所述的页面加载方法

[0038]第六方面,本申请提供了一种存储介质,所述存储介质存储有一个或者多个程序,所述一个或者多个程序可被一个或者多个处理器执行,以实现第一方面或第二方面中任一项所述的页面加载方法

[0039]本申请实施例提供的上述技术方案与现有技术相比具有如本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.
一种页面加载方法,其特征在于,所述方法包括:接收来自客户端的页面加载请求,获取所述客户端待加载的目标页面的页面数据,所述页面数据中包括页面的元数据以及多个页面模块的元数据,所述页面的元数据和所述页面模块的元数据互相独立;根据所述页面数据确定所述目标页面包含的多个页面模块,不同的所述页面模块互相独立;并行获取每个所述页面模块的页面模块数据,以及每当获取到一个所述页面模块数据时,则将获取到的所述页面模块数据发送至所述客户端,以使所述客户端每当接收到一个所述页面模块数据时,则对接收到的所述页面模块数据进行渲染
。2.
根据权利要求1所述的方法,其特征在于,所述根据所述页面数据确定所述目标页面包含的多个页面模块,包括:从所述页面数据中提取多个页面模块的元数据;根据所述多个页面模块的元数据确定所述目标页面包含的多个页面模块
。3.
根据权利要求2所述的方法,其特征在于,所述方法还包括:从所述页面数据中提取所述目标页面的元数据;将所述目标页面的元数据形成一个页面模块
。4.
根据权利要求2所述的方法,其特征在于,所述并行获取每个所述页面模块的页面模块数据,包括:针对每个所述页面模块并行执行以下处理:根据所述页面模块的元数据,向页面模块服务系统发送页面模块数据获取请求,以使所述页面模块服务系统响应于所述页面模块数据获取请求返回对应的页面模块数据,所述页面模块服务系统为页面模块数据的提供方
。5.
一种页面加载方法,其特征在于,所述方法包括:向服务端发送页面加载请求,以使所述服务端根据所述页面加载请求获取客户端待加载的目标页面的页面数据,所述页面数据中包括页面的元数据以及多个页面模块的元数据,所述页面的元数据和所述页面模块的元数据互相独立;根据所述页面数据确定所述目标页面包含的多个页面模块;并行获取每个所述页面模块的页面模块数据,以及每当获取到一个所述页面模块数据时,则将获取到的所述页面模块数据发送至所述客户端,不同的所述页面模块互相独立;每当接收到一个所述页面模块数据时,则对接收到的所述页面模块数据进行渲染
。6.
根据权利要求5所述的方法,其特征在于,所述每当接收到一个所述页面模块数据时,则对接收到的所述页面模块数据进行渲染,包括:每当接收到一个所述页面模块数据时,则执行以下步骤:将接收到的所述页面模块数据渲染成一个虚...

【专利技术属性】
技术研发人员:高春华
申请(专利权)人:北京奇艺世纪科技有限公司
类型:发明
国别省市:

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

1