[发明专利]网页显示方法、装置、计算机设备及存储介质有效
申请号: | 201910223519.9 | 申请日: | 2019-03-22 |
公开(公告)号: | CN109977333B | 公开(公告)日: | 2020-06-09 |
发明(设计)人: | 陈禹霖 | 申请(专利权)人: | 北京三快在线科技有限公司 |
主分类号: | G06F16/957 | 分类号: | G06F16/957 |
代理公司: | 北京三高永信知识产权代理有限责任公司 11138 | 代理人: | 刘小鹤 |
地址: | 100190 北京市海*** | 国省代码: | 北京;11 |
权利要求书: | 查看更多 | 说明书: | 查看更多 |
摘要: | |||
搜索关键词: | 网页 显示 方法 装置 计算机 设备 存储 介质 | ||
本发明公开了一种网页显示方法、装置、计算机设备及存储介质,属于移动应用领域。所述方法包括:获取待显示的网页的第一骨架屏数据,基于网页视图对网页进行加载;在网页视图的上层,创建原生视图;基于第一骨架屏数据,渲染原生视图,得到骨架屏视图,骨架屏视图用于显示网页的框架;当网页的加载进度满足预设条件时,移除骨架屏视图,以显示基于网页视图的网页。本发明通过在网页视图上层创建一个原生视图,使得获取的第一骨架屏数据能够直接在原生视图上进行渲染,得到骨架屏视图,使得骨架屏视图的渲染不再依赖于网页视图的初始化以及网页数据的加载,提前了骨架屏视图出现的时机,避免了用户长时间看到白屏,改善了视觉效果。
技术领域
本发明涉及移动应用领域,特别涉及一种网页显示方法、装置、计算机设备及存储介质。
背景技术
混合模式移动应用是指介于网页应用和本地应用这两者之间的应用,兼具本地应用的良好用户交互体验的优势和网页应用的跨平台开发的优势。对于用户而言,访问混合模式移动应用的感觉像是在访问本地应用,但实际上是通过混合模式移动应用中封装的浏览器内核访问网络应用。
目前,在混合模式移动应用中进行网页显示时,会首先启动网页视图,进行网页视图初始化,在网页视图初始化之后会得到一个网页视图的基本框架,例如,该基本框架包括网页标题。基于该基本框架,获取相应的网页数据,其中,网页数据中包括该网页的骨架屏数据,在获取到该网页的骨架屏数据后,会基于该骨架屏数据对网页视图进行渲染,得到网页的骨架屏视图,此时,用户可以看到该网页的视图框架,例如,可以看到包含网页标题的位置、大小和形状的一个图片。在获取到全部的网页数据之后,根据该全部的网页数据,对网页的骨架屏视图进行继续渲染,得到该网页的完整界面,此时,用户可以看到该网页的全部内容。
在上述网页显示过程中,在骨架屏视图渲染完成之前,需要完成网页视图的初始化,还要基于网页视图获取到网页数据之后,才能对网页视图进行渲染,然而,无论是网页视图的初始化还是网页数据的加载都是非常耗时的,导致整个网页的显示较慢,用户会长时间看到白屏,视觉效果较差。
发明内容
本发明实施例提供了一种网页显示方法、装置、计算机设备及存储介质,能够解决骨架屏视图出现时机较晚,视觉效果差的问题。该技术方案如下:
一方面,提供了一种网页显示方法,该方法包括:获取待显示的网页的第一骨架屏数据,基于网页视图对所述网页进行加载;
在所述网页视图的上层,创建原生视图;
基于所述第一骨架屏数据,渲染所述原生视图,得到骨架屏视图,所述骨架屏视图用于显示所述网页的框架;
当所述网页的加载进度满足预设条件时,移除所述骨架屏视图,以显示基于所述网页视图的网页。
在一种可能实现方式中,所述获取待显示的网页的第一骨架屏数据包括:
当计算机设备存储有所述第一骨架屏数据时,从所述计算机设备的存储空间中获取所述第一骨架屏数据;
当所述计算机设备未存储所述第一骨架屏数据时,从服务器中获取所述第一骨架屏数据。
在一种可能实现方式中,所述获取待显示的网页的第一骨架屏数据包括:
获取计算机设备的登录状态,基于所述登录状态,获取对应的第一骨架屏数据,不同的登录状态对应不同的第一骨架屏数据;
或者,获取所述网页的页面标识,基于所述页面标识,获取对应的第一骨架屏数据,不同的页面标识对应不同的第一骨架屏数据。
在一种可能实现方式中,所述基于所述第一骨架屏数据,渲染所述原生视图,得到骨架屏视图,包括:
如果已下载的网页数据中包括第二骨架屏数据,则基于所述第一骨架屏数据和所述第二骨架屏数据,渲染所述原生视图,得到骨架屏视图。
该专利技术资料仅供研究查看技术是否侵权等信息,商用须获得专利权人授权。该专利全部权利属于北京三快在线科技有限公司,未经北京三快在线科技有限公司许可,擅自商用是侵权行为。如果您想购买此专利、获得商业授权和技术合作,请联系【客服】
本文链接:http://www.vipzhuanli.com/pat/books/201910223519.9/2.html,转载请声明来源钻瓜专利网。
- 上一篇:移动端的图片访问方法、装置及存储介质
- 下一篇:检索速度优化方法