一种页面加载方法、装置、计算设备及可读存储介质制造方法及图纸

技术编号:27474048 阅读:25 留言:0更新日期:2021-03-02 17:41
本发明专利技术公开了一种页面加载方法,适于在终端设备中执行,方法包括步骤:加载用户浏览页面;获取页面中的预加载图片及预加载图片的尺寸信息,尺寸信息包括预加载图片的宽度和高度;从预定目录中获取与预加载图片尺寸信息相同的目标图片,预定目录中只存储一张该尺寸的目标图片;将目标图片加载至预加载图片的位置。本发明专利技术一并公开了相应的装置、终端设备及可读存储介质。可读存储介质。可读存储介质。

【技术实现步骤摘要】
一种页面加载方法、装置、计算设备及可读存储介质


[0001]本专利技术涉及应用程序设计领域,尤其涉及一种页面加载方法、装置、计算设备及可读存储介质。

技术介绍

[0002]当今无论是移动App还是桌面应用都有很多的信息流提供给用户,信息流中最常见的一种信息模式就是图文结合,然而图片的加载不同于文字的加载,往往需要一定的时间才能渲染到页面的相应位置,所以在图片渲染在页面上之前,几乎所有的应用都会使用不同的方案生成一张占位图临时填充到图片的位置上,标记该位置是一张正在加载中的图片。一个应用会有多个信息流,多个信息流对应着多种图文样式,所以即使是同一张图片在不同的信息流中大小和展示样式都有可能不同,相对应的占位图也要随之改变。
[0003]现有的方案大多数是直接由UI设计师将多个尺寸的占位图切出来,然后在相应的信息流中取出相应大小的占位图,这种方案比较简单,但是没有可扩展性,完全依赖于UI设计师的切图,只要变更图文样式或添加图文样式就要重新切占位图片,造成不必要的人员和时间浪费,其次这些占位图是直接放到软件工程当中的,会使软件的包体积增大,加大用户下载软件的成本。
[0004]其次还有一些方案动态的根据用户浏览到的图片去生成对应尺寸的占位图,这种方案生成占位图片是伴随整个图片加载的,即每加载一张图片就会产生一张占位图,没有对相同尺寸的图片做更多的处理,在用户的使用过程中,极大的浪费了系统的沙盘空间和运算耗时,且在用户快速滑动信息流时,因为会一直生成占位图,可能会造成CPU和GPU资源吃紧,内存短缺,渲染耗时增加,从而产生掉帧卡顿,用户体验很不好。

技术实现思路

[0005]为此,本专利技术提供了一种页面加载方法、装置、计算设备及可读存储介质,以力图解决或者至少缓解上面存在的问题。
[0006]根据本专利技术的一个方面,提供一种页面加载方法,适于在终端设备中执行,方法包括步骤:加载用户浏览页面;获取页面中的预加载图片及预加载图片的尺寸信息,尺寸信息包括预加载图片的宽度和高度;从预定目录中获取与预加载图片尺寸信息相同的目标图片,预定目录中只存储一张该尺寸的目标图片;将目标图片加载至预加载图片的位置。
[0007]可选的,在根据本专利技术的页面加载方法中,从预定目录中获取与预加载图片尺寸信息相同的目标图片包括:若预定目录不存在,则创建预定目录。
[0008]可选的,在根据本专利技术的页面加载方法中,若预定目录不存在,则创建预定目录包括:若预定目录创建失败,重新创建预定目录。
[0009]可选的,在根据本专利技术的页面加载方法中,从预定目录中获取与预加载图片尺寸信息相同的目标图片包括:根据预加载图片尺寸信息生成图片名称;根据图片名称从预定目录中查找目标图片。
[0010]可选的,在根据本专利技术的页面加载方法中,从预定目录中获取与预加载图片尺寸信息相同的目标图片包括:若预定目录中不存在与预加载图片尺寸信息相同的目标图片,则创建与预加载图片尺寸信息相同的目标图片;根据预加载图片尺寸信息生成目标图片的图片名称。
[0011]可选的,在根据本专利技术的页面加载方法中,从预定目录中获取与预加载图片尺寸信息相同的图片包括:若创建与预加载图片尺寸信息相同的目标图片失败,则重新创建目标图片。
[0012]可选的,在根据本专利技术的页面加载方法中,目标图片的图片名称的生成包括:获取预加载图片的高度和宽度;按照预定规则对预加载图片的高度和宽度进行组合生成图片名称。
[0013]可选的,在根据本专利技术的页面加载方法中,方法还包括:当用户退出浏览页面时,本次页面浏览中生成的目标图片保存在预定目录中。
[0014]可选的,在根据本专利技术的页面加载方法中,终端设备安装有应用程序,页面为应用程序浏览页面,方法还包括:当应用程序从移动终端中删除时,删除预定目录及其中的目标图片。
[0015]根据本专利技术的另一个方面,提供一种网页加载装置,包括:页面获取单元、目标图片获取单元、存储单元和图片加载单元,其中,页面加载单元,适于加载用户浏览页面,还适于获取页面中的预加载图片及预加载图片的尺寸信息,尺寸数据包括预加载图片的宽度和高度;目标图片获取单元,适于从存储单元中获取与预加载图片尺寸信息相同的目标图片;存储单元,适于存储目标图片,存储单元中只存储一张同一尺寸的目标图片;图片加载单元,适于将获取到的与预加载图片尺寸信息相同的目标图片加载至预加载图片的位置。
[0016]根据本专利技术的另一个方面,提供一种终端设备,包括:一个或多个处理器;存储器;以及一个或多个程序,其中一个或多个程序存储在存储器中并被配置为由一个或多个处理器执行,一个或多个程序包括用于执行上述页面加载方法中的任一方法的指令。
[0017]根据本专利技术的另一个方面,提供一种存储一个或多个程序的计算机可读存储介质,一个或多个程序包括指令,指令当由终端设备执行时,使得终端设备执行上述页面加载方法中的任一方法。
[0018]根据本专利技术的另一方面,提供一种移动终端,包括:一个或多个处理器;存储器;以及一个或多个程序,其中一个或多个程序存储在存储器中并被配置为由一个或多个处理器执行,一个或多个程序包括用于执行上述页面加载方法的指令。
[0019]根据本专利技术的又一方面,提供一种存储一个或多个程序的计算机可读存储介质,一个或多个程序包括指令,指令当由移动终端执行时,使得移动终端执行上述面加载方法。
[0020]根据本专利技术的页面加载方法,在页面浏览过程中,通过在预加载图片位置添加目标占位图片,保证整个页面在加载过程中布局格式保持不变,同时目标图片存储在预定路径中,每个尺寸的目标图片只在第一次被加载时生成一次并进行保存,避免了不同页面不同信息流需要创建多个相同尺寸的目标图片进行存储,节约系统资源,减少内存消耗,简化了占位图的使用场景;同时,在页面加载过程中,相同尺寸的目标图片只需要创建一次,减少了占位图片生成对内存的占用。
[0021]另一方面,生成的目标占位图片资源也会伴随整个应用的安装和卸载而生成和移
除,也符合整个应用的使用周期。在实际代码开发中,只需要建立一个单例,就可以适配所有的信息流图片样式中的占位图使用,极大的缩短了开发人员在占位图使用上的开发时间。因为占位图片是通过代码生成的,便于管理和进行扩展。
附图说明
[0022]为了实现上述以及相关目的,本文结合下面的描述和附图来描述某些说明性方面,这些方面指示了可以实践本文所公开的原理的各种方式,并且所有方面及其等效方面旨在落入所要求保护的主题的范围内。通过结合附图阅读下面的详细描述,本公开的上述以及其它目的、特征和优势将变得更加明显。遍及本公开,相同的附图标记通常指代相同的部件或元素。
[0023]图1示出了根据本专利技术一个实施例的移动终端100的框图;
[0024]图2示出了根据跟专利技术一个实施例的页面加载方法200的流程图;
[0025]图3示出了根据本专利技术一个实施例的获取目标图片的流程300的流程图;
[0026]图4示出本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种页面加载方法,适于在终端设备中执行,所述方法包括步骤:加载用户浏览页面;获取所述页面中的预加载图片及所述预加载图片的尺寸信息,所述尺寸信息包括预加载图片的宽度和高度;从预定目录中获取与所述预加载图片尺寸信息相同的目标图片,所述预定目录中只存储一张该尺寸的目标图片;将所述目标图片加载至所述预加载图片的位置。2.如权利要求1所述的方法,其中,所述从预定目录中获取与所述预加载图片尺寸信息相同的目标图片包括:若所述预定目录不存在,则创建所述预定目录;若所述预定目录创建失败,重新创建预定目录。3.如权利要求1或2所述的方法,其中,所述从预定目录中获取与所述预加载图片尺寸信息相同的目标图片包括:根据所述预加载图片尺寸信息生成图片名称;根据所述图片名称从所述预定目录中查找目标图片。4.如权利要求1-3中任意一项所述的方法,其中,所述从预定目录中获取与所述预加载图片尺寸信息相同的目标图片包括:若所述预定目录中不存在与所述预加载图片尺寸信息相同的目标图片,则创建与所述预加载图片尺寸信息相同的目标图片,若创建与所述预加载图片尺寸信息相同的目标图片失败,则重新创建目标图片;根据所述预加载图片尺寸信息生成目标图片的图片名称。5.如权利要求1-4中任意一项所述的方法,其中,所述目标图片的图片名称的生成包括:获取所述预加载图片的高度和宽度;按照预定规则对所述预加载图片的高度和宽度进行组合生成图片名称。6.如权利要求1-5中...

【专利技术属性】
技术研发人员:王伟光
申请(专利权)人:北京齐尔布莱特科技有限公司
类型:发明
国别省市:

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

1