CN111737614B - 页面显示方法、装置、电子设备和存储介质 - Google Patents

Abstract

本发明实施例公开了一种页面显示方法、装置、电子设备和存储介质。该方法包括：在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；若是，则读取所述待显示页面的页面骨架图并进行显示，其中，所述页面骨架图依据所述待显示页面的页面架构预先生成。通过上述技术方案，实现了更加快速地显示待显示页面的页面骨架图。

Description

页面显示方法、装置、电子设备和存储介质

技术领域

本发明实施例涉及计算机技术，尤其涉及一种页面显示方法、装置、电子设备和存储介质。

背景技术

随着单页应用程序(single page web application，SPA)在应用程序前端开发领域的逐渐流行，首屏加载的问题越来越突出，例如首屏显示内容及首屏显示速度等。

首屏加载的实现方案有：一种是显示页面加载图片，如loading或进度条等显示页面正在加载的页面加载信息图；另一种新兴方案是采用骨架屏的方式显示首屏图片。骨架屏是指在页面内容未加载完成的时候，先使用页面的大致结构对应的页面结构图(也称为页面骨架图)进行占位，待页面的内容加载完成之后再把它替换掉。目前骨架屏的页面显示方案为：在待显示页面的页面加载过程中根据待显示页面的相关信息实时动态地生成相应页面的页面骨架图。

在实现本发明过程中，发明人发现现有技术中至少存在如下问题：虽然骨架屏技术的出现，使得用户可预先获知页面的大致框架，一定程度上提升了用户体验，但是页面骨架图的生成与显示仍需要一定的时间，仍会影响用户体验。另外，每次应用程序启动后均需动态生成每个页面的页面骨架图，延长页面显示时间之外，还造成系统资源的浪费。

发明内容

本发明实施例提供一种页面显示方法、装置、电子设备和存储介质，以实现更加快速地显示待显示页面的页面骨架图。

第一方面，本发明实施例提供了一种页面显示方法，包括：

在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；

若是，则读取所述待显示页面的页面骨架图并进行显示，其中，所述页面骨架图依据所述待显示页面的页面架构预先生成。

第二方面，本发明实施例还提供了一种页面显示装置，该装置包括：

页面骨架图判断模块，用于在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；

页面骨架图显示模块，用于若是，则读取所述待显示页面的页面骨架图并进行显示，其中，所述页面骨架图依据所述待显示页面的页面架构预先生成。

第三方面，本发明实施例还提供了一种电子设备，该电子设备包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现本发明任意实施例所提供的页面显示方法。

第四方面，本发明实施例还提供了一种计算机可读存储介质，其上存储有计算机程序，该计算机程序被处理器执行时实现本发明任意实施例所提供的页面显示方法。

本发明实施例通过依据待显示页面的页面架构预先生成待显示页面的页面骨架图，实现了在页面加载前生成目标程序中各页面的页面骨架图并存储在当前设备的存储空间中，为后续提高页面骨架图的显示速度提供数据基础，避免后续页面显示过程中反复生成页面骨架屏而造成的资源浪费。通过在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；若是，则读取所述待显示页面的页面骨架图并进行显示。实现了在待显示页面首次加载之前，从当前设备的存储空间中直接读取并显示该待显示页面的页面骨架图，解决了页面骨架图需要实时动态生成而导致的页面骨架图显示慢的问题，达到了提高待显示页面首次加载时该待显示页面对应的页面骨架图的显示速度，缩短页面骨架图的加载时长，使得用户可更快地看到页面骨架图，从而提升用户体验的技术效果。

附图说明

图1是本发明实施例一中的一种页面显示方法的流程图；

图2是本发明实施例二中的一种页面显示方法的流程图；

图3是本发明实施例三中的一种页面显示装置的结构示意图；

图4是本发明实施例四中的一种电子设备的结构示意图。

具体实施方式

下面结合附图和实施例对本发明作进一步的详细说明。可以理解的是，此处所描述的具体实施例仅仅用于解释本发明，而非对本发明的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本发明相关的部分而非全部结构。

实施例一

本实施例提供的页面显示方法可适用于程序中的页面首次加载过程中的页面显示，尤其适用于页面数据加载完成前的页面显示的情况。该方法可以由页面显示装置来执行，该装置可以由软件和/或硬件的方式实现，该装置可以集成在安装有应用程序的电子设备中，例如手机、平板电脑或台式电脑等。参见图1，本实施例的方法具体包括如下步骤：

S110、在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图。

其中，目标程序是指当前设备中需要显示页面的已运行程序，其可以是应用软件(application，app)程序，也可以是第5个版本的“描述网页的标准语言”(HTML5，H5)程序。示例性地，目标程序为微信应用程序中的小程序。这时因为小程序的设计局限性，其需要更快的页面显示速度，以提升用户使用小程序的用户体验。根据上述目标程序的说明，本发明实施例中的页面显示方法可实现跨平台支持，例如支持包括但不限于Android平台和IOS平台等。待显示页面是指需要被加载并显示的目标程序中的页面，例如可以是目标程序的首页及其后续页面，该后续页面可称为除首页之外的剩余页面，或二级页面。页面骨架图依据待显示页面的页面架构预先生成。也就是目标程序中的每个页面的页面骨架图事先根据相应页面的页面架构生成，这样便可以在页面加载之前生成其对应的页面骨架图，而无需在页面加载时实时生成，缩短了页面显示过程中页面骨架图的获取时间。

当检测到目标程序中的待显示页面首次加载时，例如检测到目标程序首次在当前设备中运行时，或者虽然目标程序不是首次在当前设备中运行，但是检测到目标程序重新启动时，便可确定该点显示页面为首次加载。此时，相关技术中便会根据待显示页面的页面相关信息实时动态地生成该待显示页面的页面骨架图，之后便显示生成的页面骨架图。但是，为了更快地显示页面骨架图，本发明实施例中摒弃了实时生成页面骨架图的操作，而是在待显示页面加载之前，便预先生成目标程序中的每个页面的页面骨架图，并存储在目标程序对应的当前设备的存储空间中，例如目标程序对应的静态资源空间中。那么，在检测到待显示页面首次加载时，先判断当前设备的存储空间中是否存储有待显示页面的页面骨架图。

示例性地，待显示页面为目标程序的各页面中除了首页之外的各剩余页面；相应地，依据待显示页面的页面架构预先生成页面骨架图包括：在显示目标程序的首页后，依据目标程序中各剩余页面的页面链接，生成每个剩余页面对应的页面骨架图，并存储各页面骨架图。由于目标程序发布运行后的运行页面与目标程序未发布时的测试页面可能因为运行环境等原因而存在差异，所以为了使得存储空间中存储的页面骨架图与目标程序中的各个页面更加匹配，本实施例中选择了在目标程序运行之后，根据目标程序中各个页面的页面相关信息生成每个页面的页面骨架图。同时，为了确保目标程序首屏的显示速度，本实施例中目标程序首页的页面骨架图，即首屏显示内容，采用了在目标程序发布前便事先生成并存储的首页的页面骨架图。而对于除了首页之外的所有剩余页面的页面骨架图，便是在首页加载完成并显示之后，获取各剩余页面的页面链接，并依据该页面链接进行页面骨架图的生成。具体实施时，在目标程序加载完成并展示首页时，先获取目标程序对应的静态资源中的首页的页面骨架图，并将该页面骨架图展示到首页中。之后，向服务端请求首页页面数据，待数据请求完成后，利用页面数据渲染首页，并将首页的页面骨架图隐藏，而显示渲染后的首页。首页显示后，便获取各剩余页面的页面链接，这些页面链接可以从目标程序对应的静态文件中读取。之后，便可以根据页面链接，采用复用页面布局和/或页面样式的方式，生成页面骨架图。

需要说明的是，上述预先生成页面骨架图的操作，可以是目标程序首次在当前设备中运行时的操作，而后续目标程序重新启动的过程中不再执行，而是直接使用首次生成并存储的各页面骨架图；也可以是目标程序每次重新启动后均执行上述生成页面骨架图的操作，以便进一步保证页面骨架图的正确性；还可以是在满足某种条件时才执行，而其余情况下不执行。

示例性地，在判断目标程序对应的当前设备中是否存在待显示页面的页面骨架图之前，还包括：获取目标程序的当前版本号，并判断当前版本号与存储版本号是否一致，存储版本号为存储页面骨架图时存储的目标程序的版本号；若是，则触发执行判断目标程序对应的当前设备中是否存在待显示页面的页面骨架图的步骤。

上述预先生成页面骨架图的过程中，会将生成的各个页面骨架图存储在目标程序对应的存储空间中。考虑到同一个程序发布版本中页面架构不会变动，而不同程序发布版本中页面架构可能有变，故本实施例中需要在使用已存储的页面骨架图之前，即判断当前设备中是否存在待显示页面的页面骨架图之前，先判断目标程序的当前版本号，与存储页面骨架图时的目标程序的存储版本号是否一致。如果一致，那么可以直接触发执行判断目标程序对应的当前设备中是否存在待显示页面的页面骨架图的步骤。如果不一致，那么就需要触发执行上述预先生成页面骨架图的操作，即在显示目标程序的首页后，依据目标程序中各剩余页面的页面链接，生成每个剩余页面对应的页面骨架图，并存储各页面骨架图，以便生成与当前版本号一致的各个页面的页面骨架图并存储。

S120、若是，则读取所述待显示页面的页面骨架图并进行显示。

如果判断目标程序对应的当前设备的存储空间中存储有待显示页面的页面骨架图，那么便可以直接从存储空间中读取并显示该页面骨架图。

如果判断当前设备的存储空间中没有待显示页面的页面骨架图，那么可以实时动态地利用待显示页面的页面架构来生成并显示其对应的页面骨架图，同时存储该生成的页面骨架图。但是，考虑到页面骨架图的生成过程中需要向服务端请求页面数据，而待显示页面的加载显示过程同样需要向服务端请求包含上述相同的页面数据，故为了提高页面显示效率，本实施例中可以直接加载并生成待显示页面，而不生成页面骨架图，那么后续也是直接显示生成的待显示页面，而不再显示其页面骨架图。

本实施例的技术方案，通过依据待显示页面的页面架构预先生成待显示页面的页面骨架图，实现了在页面加载前生成目标程序中各页面的页面骨架图并存储在当前设备的存储空间中，为后续提高页面骨架图的显示速度提供数据基础，避免后续页面显示过程中反复生成页面骨架屏而造成的资源浪费。通过在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；若是，则读取所述待显示页面的页面骨架图并进行显示，实现了在待显示页面首次加载之前，从当前设备的存储空间中直接读取并显示该待显示页面的页面骨架图，解决了页面骨架图需要实时动态生成而导致的页面骨架图显示慢的问题，达到了提高待显示页面首次加载时该待显示页面对应的页面骨架图的显示速度，缩短页面骨架图的加载时长，使得用户可更快地看到页面骨架图，从而提升用户体验的技术效果。

实施例二

本实施例在上述实施例的基础上，对“依据目标程序中各剩余页面的页面链接，生成每个剩余页面对应的页面骨架图”进行了进一步优化。在此基础上，还可以进一步增加同一页面中不同显示子页面的页面骨架图的生成步骤。其中与上述各实施例相同或相应的术语的解释在此不再赘述。参见图2，本实施例提供的页面显示方法包括：

S210、当待显示页面为目标程序的各页面中除了首页之外的各剩余页面时，在显示目标程序的首页后，确定目标程序中各剩余页面的页面链接。

S220、针对每个页面链接，依据页面链接进行页面预加载，生成相应页面链接对应的预加载页面，并依据预加载页面的页面架构生成页面链接对应的剩余页面的页面骨架图。

在获得目标程序中各剩余页面的页面链接之后，将其存储至一个数组中。之后，遍历该数组，以逐个处理页面链接并生成其对应的页面骨架图。每个剩余页面的页面骨架图的生成过程为：依据当前剩余页面的页面链接向服务端请求页面布局和/或页面样式等页面架构数据，以进行该页面链接对应的页面的预加载，生成该页面链接的预加载页面。之后，根据预加载页面的页面架构，如页面布局和/或页面样式，生成当前剩余页面对应的页面骨架图。

示例性地，依据预加载页面的页面架构生成页面链接对应的剩余页面的页面骨架图包括：

A、确定预加载页面中每个页面节点在页面中的页面位置及节点样式信息。

其中，页面节点是页面中的每个元素，其可以是文本、图片及按钮等。页面位置是指页面节点在页面中的布局位置。节点样式信息是指页面节点的样式信息，例如可以是页面节点的宽、高或颜色等。

在生成预加载页面之后，便可以利用目标程序提供的页面节点获取接口，如小程序中的wx.createSelectorQuery()，获取到预加载页面中的所有的页面节点，并通过该页面节点获取接口获取到每个页面节点的页面位置和节点样式信息。

B、依据当前可视屏幕区域生成区域范围一致的待绘制画布。

其中，当前可视屏幕区域是指当前设备的可视屏幕区域。

为了实现预加载页面的页面布局及页面样式的复用，本实施例中创建一个与当前可视屏幕区域的宽度和高度一致的Canvas画布，作为待绘制画布。

C、依据各页面节点的页面位置及节点样式信息，填充待绘制画布，生成预设二进制格式的图片，作为页面链接对应的剩余页面的页面骨架图。

其中，预设二进制格式是指预先设定的以二进制形式存储图片的格式，例如base64。由于目标程序无法强缓存jpg或bmp等格式的图片，故本实施例中采用了二进制格式来缓存图片，以使得图片以字符串的形式存储。

将预加载页面中所有的页面节点按照其页面位置以及节点样式信息中的宽和高绘制到上述待绘制画布中，同时使用灰色或者节点样式信息中的颜色来填充相应的页面节点对应的绘制元素。至此，便可将预加载页面中的各个页面节点复制式的绘制在待绘制画布中。之后，将绘制完成的待绘制画布存储为预设二进制格式的图片，该图片便为预加载页面对应的页面骨架图。最后，可将生成的页面骨架图存储在当前设备的存储空间中。

这样设置的好处在于，无需预加载剩余页面的页面显示数据，而仅预加载页面架构数据，便可快速实现剩余页面的页面架构的复制，以生成其对应的页面骨架图。

S230、在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图。

S240、若是，则读取所述待显示页面的页面骨架图并进行显示。

显示页面骨架图之后，依据待显示页面生成页面数据请求，并将页面数据请求发送至目标程序对应的服务端，以获得待显示页面的页面显示数据；依据页面显示数据生成待显示页面对应的目标显示页面，并利用目标显示页面替换页面骨架图，以显示目标显示页面。此时完成待显示页面的初步显示。

S250、若页面骨架图为待显示页面的第一屏待显示子页面对应的页面骨架图，则依据目标显示页面的页面长度和当前设备的显示屏幕长度，确定目标显示页面的第二屏待显示子页面，并将第二屏待显示子页面作为当前待显示子页面。

其中，第一屏待显示子页面是指待显示页面的显示长度大于当前设备的可视屏幕区域(即显示屏幕)长度，而使得待显示页面中的一部分最先被显示在当前设备的可视屏幕区域，该最先被显示的一部分页面便为待显示页面的第一屏待显示子页面。在第一屏待显示子页面之后紧接着显示的子页面便为待显示页面的第二屏待显示子页面。以此类推，可由第二屏待显示子页面之后的第三屏待显示子页面等。

在目标程序运行过程中，为了节省资源及提高页面加载速度，通常会将待显示页面中的第一屏待显示子页面和第二屏待显示子页面全部加载，而剩下的屏的待显示子页面采用懒加载。但是，从懒加载到最终的子页面展示期间也有时间间隔。为了进一步提高用户体验，使得待显示页面的后续待显示子页面能够更快的被用户看到，本实施例中懒加载的内容(即第二屏待显示子页面之后的各待显示子页面)也可采用页面骨架图进行预先展示，而后再加载并显示待显示子页面。

具体实施时，若上述所获取并显示的页面骨架图为待显示页面的第一屏待显示子页面的页面骨架图，那么待显示页面的除了第一屏待显示子页面之后的各后续待显示子页面便没有对应的页面骨架图。此时，便需要循环式的预先为各后续待显示子页面生成对应的页面骨架图。由于第二屏待显示子页面已经被预加载完成，故不需再为其生成页面骨架图，便将第二屏待显示子页面作为当前待显示子页面。

S260、依据当前待显示子页面，确定下一个待显示子页面。

确定出当前待显示子页面之后紧邻的下一屏的待显示子页面，作为下一个待显示子页面。

S270、依据下一个待显示子页面的页面架构，生成下一个待显示子页面对应的页面骨架图，作为待显示页面的后续页面骨架图，并存储后续页面骨架图。

根据下一个待显示子页面的页面链接生成其对应的预加载页面，并利用预加载页面的页面结构，生成该下一个待显示子页面对应的页面骨架图。该页面骨架图便为待显示页面的后续页面骨架图。同时，需要将该后续页面骨架图及其对应的待显示页面的信息(如待显示页面的页面链接)和显示屏序号(即待显示页面中的第几屏)等信息全部存储在当前设备的存储空间中，以备后续程序运行的页面显示过程中使用。

S280、利用下一个待显示子页面更新当前待显示子页面，并返回执行依据当前待显示子页面，确定下一个待显示子页面的步骤，直至当前待显示子页面为目标显示页面的最后一屏待显示子页面。

将S260确定的下一个待显示子页面更新为当前待显示子页面，并返回执行S260，直至生成待显示页面的所有待显示子页面的后续页面骨架图。

需要说明的是，S250～S280为可选执行操作，其可以执行，也可以不执行。另外，S250～S280可以按序执行，也可以在S230或S240之前执行。

本实施例的技术方案，通过依据页面链接进行页面预加载，生成相应页面链接对应的预加载页面，并依据预加载页面的页面架构生成页面链接对应的剩余页面的页面骨架图。实现了更加快速的复用待显示页面的页面布局和页面样式，从而更加快速地生成待显示页面的页面骨架图，进一步提高了页面骨架图的生成效率。通过若页面骨架图为待显示页面的第一屏待显示子页面对应的页面骨架图，则在显示页面骨架图之后，依据目标显示页面的页面长度和当前设备的显示屏幕长度，确定目标显示页面的第二屏待显示子页面，并将第二屏待显示子页面作为当前待显示子页面；依据当前待显示子页面，确定下一个待显示子页面；依据下一个待显示子页面的页面架构，生成下一个待显示子页面对应的页面骨架图，作为待显示页面的后续页面骨架图，并存储后续页面骨架图；利用下一个待显示子页面更新当前待显示子页面，并返回执行依据当前待显示子页面，确定下一个待显示子页面的步骤，直至当前待显示子页面为目标显示页面的最后一屏待显示子页面。实现了待显示页面中除了第一屏待显示页面和第二屏待显示子页面之外的各待显示子页面的后续页面骨架图的生成，使得懒加载过程也可利用页面骨架图进行页面的快速显示，进一步提升了目标程序性能，也进一步提升了用户体验。

实施例三

本实施例提供一种页面显示装置，参见图3，该装置具体包括：

页面骨架图判断模块310，用于在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；

页面骨架图显示模块320，用于若是，则读取所述待显示页面的页面骨架图并进行显示，其中，页面骨架图依据待显示页面的页面架构预先生成。

可选地，在上述装置的基础上，该装置还包括页面骨架图生成模块，用于：

当待显示页面为目标程序的各页面中除了首页之外的各剩余页面，在显示目标程序的首页后，依据目标程序中各剩余页面的页面链接，生成每个剩余页面对应的页面骨架图，并存储各页面骨架图。

进一步地，页面骨架图生成模块具体用于：

确定目标程序中各剩余页面的页面链接；

针对每个页面链接，依据页面链接进行页面预加载，生成相应页面链接对应的预加载页面，并依据预加载页面的页面架构生成页面链接对应的剩余页面的页面骨架图。

进一步地，页面骨架图生成模块还具体用于：

确定预加载页面中每个页面节点在页面中的页面位置及节点样式信息；

依据当前可视屏幕区域生成区域范围一致的待绘制画布；

依据各页面节点的页面位置及节点样式信息，填充待绘制画布，生成预设二进制格式的图片，作为页面链接对应的剩余页面的页面骨架图。

可选地，在上述装置的基础上，该装置还包括版本号判断模块，用于：

在判断是否存储有待显示页面的页面骨架图之前，获取目标程序的当前版本号，并判断当前版本号与存储版本号是否一致，存储版本号为存储页面骨架图时存储的目标程序的版本号；

若是，则触发执行判断目标程序对应的当前设备中是否存在待显示页面的页面骨架图的步骤。

可选地，在上述装置的基础上，该装置还包括后续页面骨架图生成模块，用于：

若页面骨架图为待显示页面的第一屏待显示子页面对应的页面骨架图，则在读取待显示页面的页面骨架图并进行显示之后，依据目标显示页面的页面长度和当前设备的显示屏幕长度，确定目标显示页面的第二屏待显示子页面，并将第二屏待显示子页面作为当前待显示子页面；

依据当前待显示子页面，确定下一个待显示子页面；

依据下一个待显示子页面的页面架构，生成下一个待显示子页面对应的页面骨架图，作为待显示页面的后续页面骨架图，并存储后续页面骨架图；

利用下一个待显示子页面更新当前待显示子页面，并返回执行依据当前待显示子页面，确定下一个待显示子页面的步骤，直至当前待显示子页面为目标显示页面的最后一屏待显示子页面。

可选地，目标程序为微信应用程序中的小程序。

通过本发明实施例三的一种页面显示装置，实现了在待显示页面首次加载之前，从当前设备的存储空间中直接读取并显示该待显示页面的页面骨架图，解决了页面骨架图需要实时动态生成而导致的页面骨架图显示慢的问题，达到了提高待显示页面首次加载时该待显示页面对应的页面骨架图的显示速度，缩短页面骨架图的加载时长，使得用户可更快地看到页面骨架图，从而提升用户体验的技术效果。

本发明实施例所提供的页面显示装置可执行本发明任意实施例所提供的页面显示方法，具备执行方法相应的功能模块和有益效果。

值得注意的是，上述页面显示装置的实施例中，所包括的各个单元和模块只是按照功能逻辑进行划分的，但并不局限于上述的划分，只要能够实现相应的功能即可；另外，各功能单元的具体名称也只是为了便于相互区分，并不用于限制本发明的保护范围。

实施例四

参见图4，本实施例提供了一种电子设备，其包括：一个或多个处理器420；存储装置410，用于存储一个或多个程序，当一个或多个程序被一个或多个处理器420执行，使得一个或多个处理器420实现本发明实施例所提供的页面显示方法，包括：

在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；

若是，则读取所述待显示页面的页面骨架图并进行显示，其中，所述页面骨架图依据所述待显示页面的页面架构预先生成。

当然，本领域技术人员可以理解，处理器420还可以实现本发明任意实施例所提供的页面显示方法的技术方案。

图4显示的电子设备仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。如图4所示，该电子设备包括处理器420、存储装置410、输入装置430和输出装置440；电子设备中处理器420的数量可以是一个或多个，图4中以一个处理器420为例；电子设备中的处理器420、存储装置410、输入装置430和输出装置440可以通过总线或其他方式连接，图4中以通过总线450连接为例。

存储装置410作为一种计算机可读存储介质，可用于存储软件程序、计算机可执行程序以及模块，如本发明实施例中的页面显示方法对应的程序指令/模块(例如，页面显示装置中的页面骨架图判断模块和页面骨架图显示模块)。

存储装置410可主要包括存储程序区和存储数据区，其中，存储程序区可存储操作系统、至少一个功能所需的应用程序；存储数据区可存储根据终端的使用所创建的数据等。此外，存储装置410可以包括高速随机存取存储器，还可以包括非易失性存储器，例如至少一个磁盘存储器件、闪存器件、或其他非易失性固态存储器件。在一些实例中，存储装置410可进一步包括相对于处理器420远程设置的存储器，这些远程存储器可以通过网络连接至电子设备。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。

输入装置430可用于接收输入的数字或字符信息，以及产生与电子设备的用户设置以及功能控制有关的键信号输入。输出装置440可包括显示屏等显示设备。

实施例五

本实施例提供一种包含计算机可执行指令的存储介质，计算机可执行指令在由计算机处理器执行时用于执行一种页面显示方法，该方法包括：

在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；

若是，则读取所述待显示页面的页面骨架图并进行显示，其中，所述页面骨架图依据所述待显示页面的页面架构预先生成。

当然，本发明实施例所提供的一种包含计算机可执行指令的存储介质，其计算机可执行指令不限于如上的方法操作，还可以执行本发明任意实施例所提供的页面显示方法中的相关操作。

通过以上关于实施方式的描述，所属领域的技术人员可以清楚地了解到，本发明可借助软件及必需的通用硬件来实现，当然也可以通过硬件实现，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以存储在计算机可读存储介质中，如计算机的软盘、只读存储器(Read-Only Memory,ROM)、随机存取存储器(RandomAccess Memory,RAM)、闪存(FLASH)、硬盘或光盘等，包括若干指令用以使得一台电子设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所提供的页面显示方法。

注意，上述仅为本发明的较佳实施例及所运用技术原理。本领域技术人员会理解，本发明不限于这里所述的特定实施例，对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本发明的保护范围。因此，虽然通过以上实施例对本发明进行了较为详细的说明，但是本发明不仅仅限于以上实施例，在不脱离本发明构思的情况下，还可以包括更多其他等效实施例，而本发明的范围由所附的权利要求范围决定。

Claims (9)

1.一种页面显示方法，其特征在于，包括：

在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；

若是，则读取所述待显示页面的页面骨架图并进行显示，其中，所述页面骨架图依据所述待显示页面的页面架构预先生成；

若所述页面骨架图为所述待显示页面的第一屏待显示子页面对应的页面骨架图，则在所述读取所述待显示页面的页面骨架图并进行显示之后，还包括：

依据目标显示页面的页面长度和当前设备的显示屏幕长度，确定所述目标显示页面的第二屏待显示子页面，并将所述第二屏待显示子页面作为当前待显示子页面；

依据所述当前待显示子页面，确定下一个待显示子页面；

依据下一个待显示子页面的页面架构，生成下一个待显示子页面对应的页面骨架图，作为所述待显示页面的后续页面骨架图，并存储所述后续页面骨架图；

利用下一个待显示子页面更新当前待显示子页面，并返回执行依据所述当前待显示子页面，确定下一个待显示子页面的步骤，直至当前待显示子页面为所述目标显示页面的最后一屏待显示子页面。

2.根据权利要求1所述的方法，其特征在于，所述待显示页面为所述目标程序的各页面中除了首页之外的各剩余页面；

相应地，依据所述待显示页面的页面架构预先生成所述页面骨架图包括：

在显示所述目标程序的首页后，依据所述目标程序中各所述剩余页面的页面链接，生成每个所述剩余页面对应的页面骨架图，并存储各所述页面骨架图。

3.根据权利要求2所述的方法，其特征在于，所述依据所述目标程序中各所述剩余页面的页面链接，生成每个所述剩余页面对应的页面骨架图包括：

确定所述目标程序中各所述剩余页面的页面链接；

针对每个所述页面链接，依据所述页面链接进行页面预加载，生成相应页面链接对应的预加载页面，并依据所述预加载页面的页面架构生成所述页面链接对应的剩余页面的页面骨架图。

4.根据权利要求3所述的方法，其特征在于，所述依据所述预加载页面的页面架构生成所述页面链接对应的剩余页面的页面骨架图包括：

确定所述预加载页面中每个页面节点在页面中的页面位置及节点样式信息；

依据当前可视屏幕区域生成区域范围一致的待绘制画布；

依据各所述页面节点的所述页面位置及所述节点样式信息，填充所述待绘制画布，生成预设二进制格式的图片，作为所述页面链接对应的剩余页面的页面骨架图。

5.根据权利要求1所述的方法，其特征在于，在所述判断是否存储有所述待显示页面的页面骨架图之前，还包括：

获取所述目标程序的当前版本号，并判断所述当前版本号与存储版本号是否一致，所述存储版本号为存储所述页面骨架图时存储的所述目标程序的版本号；

若是，则触发执行判断所述目标程序对应的当前设备中是否存在所述待显示页面的页面骨架图的步骤。

6.根据权利要求1-5任一项所述的方法，其特征在于，所述目标程序为微信应用程序中的小程序。

7.一种页面显示装置，其特征在于，包括：

页面骨架图判断模块，用于在目标程序中的待显示页面首次加载时，判断是否存储有所述待显示页面的页面骨架图；

页面骨架图显示模块，用于若是，则读取所述待显示页面的页面骨架图并进行显示，其中，所述页面骨架图依据所述待显示页面的页面架构预先生成；

所述装置还包括后续页面骨架图生成模块，用于：

若所述页面骨架图为所述待显示页面的第一屏待显示子页面对应的页面骨架图，则在所述读取所述待显示页面的页面骨架图并进行显示之后，依据目标显示页面的页面长度和当前设备的显示屏幕长度，确定所述目标显示页面的第二屏待显示子页面，并将所述第二屏待显示子页面作为当前待显示子页面；

依据所述当前待显示子页面，确定下一个待显示子页面；

依据下一个待显示子页面的页面架构，生成下一个待显示子页面对应的页面骨架图，作为所述待显示页面的后续页面骨架图，并存储所述后续页面骨架图；

利用下一个待显示子页面更新当前待显示子页面，并返回执行依据所述当前待显示子页面，确定下一个待显示子页面的步骤，直至当前待显示子页面为所述目标显示页面的最后一屏待显示子页面。

8.一种电子设备，其特征在于，所述电子设备包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-6中任一所述的页面显示方法。

9.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现如权利要求1-6中任一所述的页面显示方法。