[发明专利]网页加载显示方法、装置、终端设备及可读存储介质

说明书

本发明涉及一种网页加载显示方法、装置、终端设备及可读存储介质，所述网页加载显示方法包括如下步骤：向服务器获取待显示网页；解析显示所述网页，其中，将网页上位于当前浏览器非可视区域中的原始图片预置为占位背景图，将网页上位于可视区域中的原始图片预置为目标格式的图片予以显示；响应于页面滚动事件，判断每个占位背景图与可视区域的相对位置关系，使可视区域内的占位背景图被替换为目标格式的所述原始图片予以显示。本发明旨在避免一次性加载浪费过多的网络请求，并将压缩率不高、尺寸较大的图片转换成高压缩率、小尺寸的目标格式图片，从而提高加载效率，提升用户体验。

技术领域

本发明涉及互联网技术领域，尤其涉及一种网页加载显示方法、装置、非临时性计算机终端设备及可读存储介质。

背景技术

随着移动互联网的快速发展，智能移动终端的使用越来越普及，用户经常会在自己的碎片时间段内通过智能移动终端浏览其他用户分享的页面，以获取所需内容。

由于分享的页面中往往会包含大量的推荐图片，一次性加载需浪费许多网络请求，并且大部分图片都为jpg或png格式，图片尺寸较大，压缩率不高，会导致网页加载缓慢，从而影响用户体验。

发明内容

为克服相关技术中存在的问题，本发明提供一种网页加载显示方法、装置、非临时性计算机终端设备及可读存储介质。

根据本发明实施例的第一方面，提供一种网页加载显示方法，包括如下步骤：

向服务器获取待显示网页；

解析显示所述网页，其中，将网页上位于当前浏览器非可视区域中的原始图片预置为占位背景图，将网页上位于可视区域中的原始图片预置为目标格式的图片予以显示；

响应于页面滚动事件，判断每个占位背景图与可视区域的相对位置关系，使可视区域内的占位背景图被替换为目标格式的所述原始图片予以显示。

在其中一个实施例中，所述将网页上位于可视区域中的原始图片预置为目标格式的图片予以显示的步骤包括:在解析页面过程中，先检测确定当前浏览器支持所述目标格式，然后将网页上位于可视区域中的原始图片预置为目标格式的图片予以显示，否则，保留原始图片的原始格式进行显示。

在其中一个实施例中，所述目标格式为webp格式，所述先检测确定当前浏览器支持所述目标格式的步骤包括：

在网页中创建一个画布；

插入webp格式图片并转换；

判断所述webp格式图片能否转换成base64格式，若能，则确定当前浏览器支持所述 webp格式，并返回表示当前浏览器支持webp格式图片的字符串。

在其中一个实施例中，所述判断每个占位背景图与可视区域的相对位置关系的步骤包括：当占位背景图与页面顶部的距离大于所述页面已卷去的高度，且小于所述页面已卷去的高度与所述可视区域的高度的和，则确定所述占位背景图位于所述可视区域范围内。

在其中一个实施例中，还包括步骤：将距离可视区域小于预设值的占位背景图预加载为目标格式的图片。

在其中一个实施例中，所述响应于页面滚动事件步骤后，还包括：根据页面滚动速度，判断确定位于预加载范围内的占位背景图，将位于预加载范围内的占位背景图替换为目标格式的所述原始图片予以显示。

在其中一个实施例中，还包括步骤：对已卷去且未加载成功的目标格式图片不再进行加载，直至所述未加载成功的目标格式图片再次落入可视区域。

在其中一个实施例中，位于可视区域的目标格式图片尺寸根据可视区域的大小设定。

根据本发明实施例的第二方面，提供一种网页加载显示装置，包括：

获取模块，被配置为向服务器获取待显示网页；