[发明专利]页面加载方法、装置、电子设备、存储介质及程序产品

说明书

本公开关于一种页面加载方法、装置、电子设备、计算可读存储介质及计算机程序产品。所述方法包括：解析接收到的页面代码，得到文档对象模型；将所述页面代码中的页面元素插入至所述文档对象模型中的模型节点；模型节点记录有元素初始样式；在所述插入钩子函数被调用时，将所述元素初始样式替换为骨架屏样式，并记录所述元素初始样式；在根据所述骨架屏样式对所述页面元素进行渲染的过程中，根据接收到的元素数据更新所述模型节点；在所述更新钩子函数被调用时，将所述骨架屏样式还原为所述元素初始样式，以根据所述元素初始样式对所述页面元素进行重新渲染。上述方法可以避免页面上出现大片异常空白的问题。

技术领域

本公开涉及页面处理技术领域，尤其涉及一种页面加载方法、装置、电子设备、计算可读存储介质及计算机程序产品。

背景技术

随着页面处理技术的发展，出现了骨架屏(Skeleton Screen)技术，通过骨架屏技术，浏览器可以在页面的数据加载之前，显示出相应的骨架屏样式，让用户预先了解到页面的基本布局，在浏览器接收到数据并加载后，则取消骨架屏样式，恢复正常的页面内容。

目前，通常采用填入图片的方式来实现骨架屏技术，在未加载任何数据时，填入一张可以体现页面基本布局的骨架屏图片，在加载数据后则移除该图片。

然而在实际应用中，当只加载了部分数据之后，在有大部分的数据未加载的情况下，仍然会移除骨架屏图片，导致整个页面会出现大片的异常空白。

因此，传统的页面加载方法存在着导致页面出现异常空白的问题。

发明内容

本公开提供一种页面加载方法、装置、电子设备、计算可读存储介质及计算机程序产品，以至少解决相关技术中页面出现异常空白的问题。本公开的技术方案如下：

根据本公开实施例的第一方面，提供一种页面加载方法，包括：

解析接收到的页面代码，得到文档对象模型；

将所述页面代码中的页面元素插入至所述文档对象模型中的模型节点；所述页面元素在被插入至所述模型节点时，触发调用预置的插入钩子函数；所述模型节点记录有元素初始样式；

在所述插入钩子函数被调用时，将所述元素初始样式替换为骨架屏样式，并记录所述元素初始样式；

在根据所述骨架屏样式对所述页面元素进行渲染的过程中，根据接收到的元素数据更新所述模型节点；所述模型节点在被更新时，触发调用预置的更新钩子函数；

在所述更新钩子函数被调用时，将所述骨架屏样式还原为所述元素初始样式，以根据所述元素初始样式对所述页面元素进行重新渲染。

在一个示例性实施例中，所述具有模型节点多个，在所述更新钩子函数被调用时，还包括：

遍历各个所述模型节点的数据内容；

当确定所述模型节点的数据内容不为空时，则将所述骨架屏样式替换为所述元素初始样式。

在一个示例性实施例中，还包括：

当确定所述模型节点的数据内容为空时，判断所述骨架屏样式是否已被替换为所述元素初始样式；

当所述骨架屏样式已被替换为所述元素初始样式，则在所述模型节点中，将所述元素初始样式还原为所述骨架屏样式。

在一个示例性实施例中，在所述插入钩子函数被调用时，还包括：

判断所述模型节点中的所述页面元素是否携带有骨架屏标识；

当所述页面元素携带有所述骨架屏标识，则将所述元素初始样式替换为所述骨架屏样式。

在一个示例性实施例中，所述遍历各个所述模型节点的数据内容，包括：