CN111352665A - 页面加载方法、装置、设备及其存储介质 - Google Patents

Abstract

本申请公开了页面加载方法、装置、设备及其存储介质。该方法包括：接收用于启动待加载页面的触发事件，该待加载页面包括预先写入的标志图像的可缩放矢量图，该可缩放矢量图包括至少一个元素部件；响应于触发事件，按照元素部件的布局位置加载元素部件的属性数据，使得在待加载页面被加载的过程中可缩放矢量图呈现动态变化。根据本申请实施例的技术方案，通过控制可缩放矢量图的属性数据变换，可以减少静态图像的体积，节省了页面加载资源的时间，从而减少用户等待的时间，提升了页面加载的性能，并优化了用户体验度。

Description

页面加载方法、装置、设备及其存储介质

技术领域

本申请一般涉及计算机技术领域，具体涉及软件应用技术领域，尤其涉及页面加载方法、装置、设备及其存储介质。

背景技术

目前，用户在各种电子设备上启动应用程序时或者使用网页浏览器进入某主页时，由于不同的网络环境导致启动过程所需时间可能较长，或者启动页面单一等现象。

例如采用图像互换格式GIF(Graphics Interchange Format)获取图像，将GIF图像嵌入启动页面，GIF图像需要其他设计者提供，以致读取GIF图像资源所需时间过长，使得启动页面加载时间延长；又或者，采用层叠样式表CSS(Cascading Style Sheet)获取图像，将CSS图像嵌入启动页面，但是CSS图像不能实现复杂图形，导致用户的体验度不高，还有一些图像嵌入启动页面，其代码量和工作量，导致时间成本和人力成本过高。这些启动页面在加载过程中，除了上述问题以外，还存在加载对象不明确的问题。

发明内容

鉴于现有技术中的上述缺陷或不足，期望提供一种页面加载方法、装置、设备及其存储介质，来提升页面加载的性能，优化用户的体验。

第一方面，本申请实施例提供了一种页面加载方法，该方法包括：

接收用于启动待加载页面的触发事件，该待加载页面包括预先写入的标志图像的可缩放矢量图，该可缩放矢量图包括至少一个元素部件；

响应于触发事件，按照元素部件的布局位置加载元素部件的属性数据，使得在待加载页面被加载的过程中可缩放矢量图呈现动态变化。

第二方面，本申请实施例提供了一种页面加载装置，该装置包括：

接收单元，用于接收用于启动待加载页面的触发事件，该待加载页面包括预先写入的标志图像的可缩放矢量图，该可缩放矢量图包括至少一个元素部件；

动态加载单元，用于响应于触发事件，按照元素部件的布局位置加载元素部件的属性数据，使得在待加载页面被加载的过程中可缩放矢量图呈现动态变化。

第三方面，本申请实施例提供了一种计算机设备，包括存储器、处理器以及存储在存储器上并可在处理器上运行的计算机程序，该处理器执行该程序时实现如本申请实施例描述的方法。

第四方面，本申请实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该计算机程序用于：

该计算机程序被处理器执行时实现如本申请实施例描述的方法。

本申请实施例提出页面加载方法、装置、设备以及存储介质。该该方法在接收到用于启动待加载页面的触发事件时，响应于触发事件加载页面时按照可缩放矢量形式的标志图像的元素部件的布局位置动态地显示标志图像的元素部件，以使得标志图像呈现动态变化。

本申请实施例通过控制可缩放矢量图的属性数据的变换，例如可以通过层叠样式表版本3控制可缩放矢量图的色彩变换，从而减少静态图像的体积，节省了页面加载资源的时间，进一步减少用户等待的时间，提升了页面加载的性能，并优化了用户体验度。

附图说明

通过阅读参照以下附图所作的对非限制性实施例所作的详细描述，本申请的其它特征、目的和优点将会变得更明显：

图1示出了本申请实施例提供的页面加载方法的流程示意图；

图2示出了标志图像的SVG图像的示意图；

图3示出了本申请实施例提供的页面加载装置200的示例性结构框图；

图4示出了适于用来实现本申请实施例的终端设备的计算机系统的结构示意图。

具体实施方式

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

需要说明的是，在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本申请。

如背景技术描述的，启动页面在加载过程中可能存在时间成本、人力成本过高等问题，为了提升启动页面记载的性能，本申请实施例提出一种页面加载方法，以节省页面记载资源的时间，减少用户等待的时间。

请参考图1，图1示出了本申请实施例提供的页面加载方法的流程示意图。该方法可以在终端侧执行。

如图1所示，该方法包括：

步骤110，接收用于启动待加载页面的触发事件。

本申请实施例中，待加载页面可以是应用程序的启动页面，也可以其他网页的起始页面。启动待加载页面的触发事件，例如可以是由图片加载装置来实现的，该图片加载装置具体可以为终端设备，即终端设备接收启动待加载页面的触发事件。终端设备可以是移动终端，优选的可以是具有操作系统的移动智能终端设备，也可以是电脑等终端设备。

移动终端是指可以在移动中使用的设备，广义的讲包括手机、笔记本、平板电脑，甚至包括车载电脑。但是，大部分情况下是指手机或者具有多种应用功能的智能手机以及平板电脑。随着网络和技术朝着越来越宽带化的方向的发展，移动通信产业将走向真正的移动信息时代。随着集成电路技术的飞速发展，移动终端的处理能力已经拥有了强大的处理能力，移动终端正在从简单的通话工具变为一个综合信息处理平台。移动智能终端可以简称为智能终端，移动智能终端拥有接入互联网能力，通常搭载各种操作系统，可根据用户需求定制化各种功能。生活中常见的智能终端包括移动智能终端、车载智能终端、智能电视、可穿戴设备等。

具体的，用户在终端的显示界面输入用于启动待加载页面的触发事件，可以是进行相关搜索，获得相关搜索的浏览页面；也可以是用户在终端的显示界面上点击相应的客户端图标，打开该客户端的浏览页面。

待加载页面包括预先写入的标志图像的可缩放矢量图，其中，可缩放矢量图包括至少一个元素部件。标志图像，例如可以是用户打开客户端图标对应标志图像，或者某个客户端的Logo标志图像，例如，小蜜蜂的形状。以小蜜蜂形状为例，小蜜蜂包括头部，翅膀部分、身体部分、以及尾部等。这些部件可以称为小蜜蜂的可缩放矢量图的元素部件。本申请实施例中，通过引入标志图像使得用户直观可视地知晓访问对象，将标志图像采用可缩放矢量图的形式，可以有效地减少研发时间，节约时间成本。

可缩放矢量图(Scalable Vector Graphics)，与其他图像格式相比，其他图像格式是基于像素处理的，而SVG是属于对图像的形状描述，其本质上是文本文件，体积也比较小，还具有不管放大多少倍都不会失真的优异性。

步骤120，响应于触发事件，按照元素部件的布局位置加载元素部件的属性数据，使得在待加载页面被加载的过程中可缩放矢量图呈现动态变化。

本申请实施例中，在接收到用户输入的触发事件后，启动页面的数据会被从预设的存储空间读取出来，即待加载页面的加载。在加载页面时，读取页面的相关数据，例如页面中的图像数据。本申请实施例中采用SVG图像嵌入待加载页面中，在读取SVG图像数据时，会获取SVG图像的静态图像.该SVG图像可以客户端的或者访问页面的Logo标志。SVG图像可以包括至少一个元素部件。例如可以是一个单独的图像数据，也可以是若干个元素部件组成的Logo标识。例如，小蜜蜂的SVG图像包括多个元素部件，如图2所示，图2示出了标志图像的SVG图像的示意图。每个框标识一个元素部件。

按照元素部件的布局位置加载元素部件的属性数据，包括：

调用层叠样式表版本3来控制元素部件的填充色呈现动态变化。

本申请实施例中，可以调用层叠样式表版本3(CSS3，Cascading Style Sheet，第3版本)按照每个元素部件的访问方式，对每个元素部件的填充色进行改变。例如，可以使用CSS3的fill属性来改变每个元素部件的填充色。然后，再利用CSS3的animation对填充色进行动画设置。

调用层叠样式表版本3来控制元素部件的填充色呈现动态变化，可以包括：

确定每个元素部件的填充色；

确定每个填充色的渐变属性；

确定每个渐变属性的时间属性和/或延迟属性；

根据时间属性和/或延迟属性控制填充色在渐变属性范围内动态变化。

本申请实施例通过层叠样式表版本3的fill属性设置每个元素部件的填充颜色。定义关键帧keyframes，确定填充颜色的渐变过程。例如0％时，颜色为#ffa319，50％时，颜色为#ffc919。

本申请实施例中通过给对应的元素部件添加animation动画，animation属性结合@keyframes使用，animation属性中animation-name需要设置成@keyframes的name一致。其中0％和50％还可以使用关键词from和to来代表，大括号中设置不同时间段的样式规则。

Animation属性中还可以设置animation-duration的值是预定值，例如2s，10s，并通过animation-name为changebox引入@keyframes changebox中的样式，表示在预定值时间内执行动画，动画执行过程。对应@keyframes changebee中的规则，例如，在前2秒内，小蜜蜂的头部由默认色变为紫色0％{firstcolor：purple；}，或者，小蜜蜂的头部和尾部由默认色变为绿色，或者定义小蜜蜂的其他元素部件的颜色变化。同一时间内有可能有多个元素部件同时在执行，也有可能只有一个元素部件在执行。

在定义关键帧之后，可以设置animation属性，animation也是一个复合属性，可以简写语法如下：

animation{animation-name animation-duration animatino-timing-functionanimation-delay animation-iteration-count animation-direction animtion-play-state animation-fill-mode}其中，animation-name：用来调用@keyframes定义好的动画，与@keyframes定义的动画名称一致。animation-duration：指定元素播放动画所持续的时间。例如持续2s。animatino-timing-function，根据前面@keframes中分析的animation中可能存在多个元素部件的动画，可以通过设置该值针对每一个元素部件的动画所在时间范围内的属性变换速率。animation-delay：定义在浏览器开始执行每个元素部件的动画之前等待的时间。animation-iteration-count：定义动画的播放次数，其通常为整数，默认是1；取值为infinite，动画将无限次的播放。还可以通过animation-direction的设置来实现动画播放方向的改变。

本申请实施例中，根据时间属性和/或延迟属性控制填充色在渐变属性范围内动态变化，可以通过animation属性实现对标志图像的各个元素部件的动画，例如在启动页面加载的过程，标志图像对象按照各个元素部件在可视平面内，从上到下或者从左到右，或者按照指定的方式，逐个加载元素部件，通过CSS3控制每个元素部件的颜色呈现动态变化，从而使得用户在等待启动页面的过程，呈现标志图像的动态变化，以优化用户的体验。

进一步，本申请实施例中预先写入的标志图像的可缩放矢量图，包括：利用文本编辑器读取可缩放矢量图的源码；

将源码写入待加载页面。

本申请实施例中，通过将Logo图像，即标志图像转换成SVG图像，然后SVG图像的源码作为外部资源引入待加载页面，将SVG图像直接作为HTML的标签渲染。获取SVG图像的源码，例如可以通过文本编辑器，例如Atom来打开SVG格式的Logo图像，即可以获取其源码，将该源码包裹在<svg></svg>标签中，复制黏贴到待加载页面中。重新启动浏览器打开该待加载页面，可以看到Logo图像显示在该待加载页面，此时Logo图像是静态的。待加载页面，例如可是以HTML页面，或者HTML5页面。

本申请实施例通过层叠样式表版本3控制可缩放矢量图的色彩变换，可以减少静态图像的体积，节省了页面加载资源的时间，从而减少用户等待的时间，提升了页面加载的性能，并优化了用户体验度。

应当注意，尽管在附图中以特定顺序描述了本发明方法的操作，但是，这并非要求或者暗示必须按照该特定顺序来执行这些操作，或是必须执行全部所示的操作才能实现期望的结果。相反，流程图中描绘的步骤可以改变执行顺序。附加地或备选地，可以省略某些步骤，将多个步骤合并为一个步骤执行，和/或将一个步骤分解为多个步骤执行。

进一步参考图3，图3示出了本申请实施例提供的页面加载装置200的示例性结构框图。该装置可以在终端执行。

如图3所示，该方法包括：

接收单元310，用于接收用于启动待加载页面的触发事件。

本申请实施例中，待加载页面可以是应用程序的启动页面，也可以其他网页的起始页面。启动待加载页面的触发事件，例如可以是由图片加载装置来实现的，该图片加载装置具体可以为终端设备，即终端设备接收启动待加载页面的触发事件。终端设备可以是移动终端，优选的可以是具有操作系统的移动智能终端设备，也可以是电脑等终端设备。

移动终端是指可以在移动中使用的设备，广义的讲包括手机、笔记本、平板电脑，甚至包括车载电脑。但是，大部分情况下是指手机或者具有多种应用功能的智能手机以及平板电脑。随着网络和技术朝着越来越宽带化的方向的发展，移动通信产业将走向真正的移动信息时代。随着集成电路技术的飞速发展，移动终端的处理能力已经拥有了强大的处理能力，移动终端正在从简单的通话工具变为一个综合信息处理平台。移动智能终端可以简称为智能终端，移动智能终端拥有接入互联网能力，通常搭载各种操作系统，可根据用户需求定制化各种功能。生活中常见的智能终端包括移动智能终端、车载智能终端、智能电视、可穿戴设备等。

具体的，用户在终端的显示界面输入用于启动待加载页面的触发事件，可以是进行相关搜索，获得相关搜索的浏览页面；也可以是用户在终端的显示界面上点击相应的客户端图标，打开该客户端的浏览页面。

待加载页面包括预先写入的标志图像的可缩放矢量图，其中，可缩放矢量图包括至少一个元素部件。标志图像，例如可以是用户打开客户端图标对应标志图像，或者某个客户端的Logo标志图像，例如，小蜜蜂的形状。

以小蜜蜂形状为例，小蜜蜂包括头部，翅膀部分、身体部分、以及尾部等。这些部件可以称为小蜜蜂的可缩放矢量图的元素部件。

本申请实施例中，通过引入标志图像使得用户直观可视地知晓访问对象，将标志图像采用可缩放矢量图的形式，可以有效地减少研发时间，节约时间成本。

可缩放矢量图(Scalable Vector Graphics)，与其他图像格式相比，其他图像格式是基于像素处理的，而SVG是属于对图像的形状描述，其本质上是文本文件，体积也比较小，还具有不管放大多少倍都不会失真的优异性。

动态加载单元320，用于响应于触发事件，按照元素部件的布局位置加载元素部件的属性数据，使得在待加载页面被加载的过程中可缩放矢量图呈现动态变化。

本申请实施例中，在接收到用户输入的触发事件后，启动页面的数据会被从预设的存储空间读取出来，即待加载页面的加载。在加载页面时，读取页面的相关数据，例如页面中的图像数据。本申请实施例中采用SVG图像嵌入待加载页面中，在读取SVG图像数据时，会获取SVG图像的静态图像.该SVG图像可以客户端的或者访问页面的Logo标志。SVG图像可以包括至少一个元素部件。例如可以是一个单独的图像数据，也可以是若干个元素部件组成的Logo标识。例如，小蜜蜂的SVG图像包括多个元素部件，如图2所示，图2示出了标志图像的SVG图像的示意图。每个框标识一个元素部件。

按照元素部件的布局位置加载元素部件的属性数据，包括：

调用层叠样式表版本3来控制元素部件的填充色呈现动态变化。

本申请实施例中，可以调用层叠样式表版本3(CSS3，Cascading Style Sheet，第3版本)按照每个元素部件的访问方式，对每个元素部件的填充色进行改变。例如，可以使用CSS3的fill属性来改变每个元素部件的填充色。然后，再利用CSS3的animation对填充色进行动画设置。

动态加载单元，还用于调用层叠样式表版本3来控制元素部件的填充色呈现动态变化，可以包括：

第一确定子单元，用于确定每个元素部件的填充色；

第二确定子单元，用于确定每个填充色的渐变属性；

第三确定子单元，用于确定每个渐变属性的时间属性和/或延迟属性；

控制子单元，用于根据时间属性和/或延迟属性控制填充色在渐变属性范围内动态变化。

本申请实施例通过层叠样式表版本3的fill属性设置每个元素部件的填充颜色。定义关键帧keyframes，确定填充颜色的渐变过程。例如0％时，颜色为#ffa319，50％时，颜色为#ffc919。

本申请实施例中通过给对应的元素部件添加animation动画，animation属性结合@keyframes使用，animation属性中animation-name需要设置成@keyframes的name一致。其中0％和50％还可以使用关键词from和to来代表，大括号中设置不同时间段的样式规则。

Animation属性中还可以设置animation-duration的值是预定值，例如2s，10s，并通过animation-name为changebox引入@keyframes changebox中的样式，表示在预定值时间内执行动画，动画执行过程。对应@keyframes changebee中的规则，例如，在前2秒内，小蜜蜂的头部由默认色变为紫色0％{firstcolor：purple；}，或者，小蜜蜂的头部和尾部由默认色变为绿色，或者定义小蜜蜂的其他元素部件的颜色变化。同一时间内有可能有多个元素部件同时在执行，也有可能只有一个元素部件在执行。

在定义关键帧之后，可以设置animation属性，animation也是一个复合属性，可以简写语法如下：

animation{animation-name animation-duration animatino-timing-functionanimation-delay animation-iteration-count animation-direction animtion-play-state animation-fill-mode}其中，animation-name：用来调用@keyframes定义好的动画，与@keyframes定义的动画名称一致。animation-duration：指定元素播放动画所持续的时间。例如持续2s。animatino-timing-function，根据前面@keframes中分析的animation中可能存在多个元素部件的动画，可以通过设置该值针对每一个元素部件的动画所在时间范围内的属性变换速率。animation-delay：定义在浏览器开始执行每个元素部件的动画之前等待的时间。animation-iteration-count：定义动画的播放次数，其通常为整数，默认是1，；取值为infinite，动画将无限次的播放。还可以通过animation-direction的设置来实现动画播放方向的改变。

本申请实施例中，控制子单元，用于根据时间属性和/或延迟属性控制填充色在渐变属性范围内动态变化，可以通过animation属性实现对标志图像的各个元素部件的动画，例如在启动页面加载的过程，标志图像对象按照各个元素部件在可视平面内，从上到下或者从左到右，或者按照指定的方式，逐个加载元素部件，通过CSS3控制每个元素部件的颜色呈现动态变化，从而使得用户在等待启动页面的过程，呈现标志图像的动态变化，以优化用户的体验。

进一步，本申请实施例中预先写入的标志图像的可缩放矢量图，包括：

源码读取单元，用于利用文本编辑器读取可缩放矢量图的源码；

源码写入单元，用于将源码写入待加载页面。

本申请实施例中，通过将Logo图像，即标志图像转换成SVG图像，然后SVG图像的源码作为外部资源引入待加载页面，将SVG图像直接作为HTML的标签渲染。获取SVG图像的源码，例如可以通过文本编辑器，例如Atom来打开SVG格式的Logo图像，即可以获取其源码，将该源码包裹在<svg></svg>标签中，复制黏贴到HTML页面中。重新启动浏览器打开该HTML页面，可以看到Logo图像显示在该HTML页面，此时Logo图像是静态的。

本申请实施例通过层叠样式表版本3控制可缩放矢量图的色彩变换，以提升页面加载的性能，并优化用户体验度。

应当理解，装置300中记载的诸单元或模块与参考图1描述的方法中的各个步骤相对应。由此，上文针对方法描述的操作和特征同样适用于装置300及其中包含的单元，在此不再赘述。装置300可以预先实现在电子设备的浏览器或其他安全应用中，也可以通过下载等方式而加载到电子设备的浏览器或其安全应用中。装置300中的相应单元可以与电子设备中的单元相互配合以实现本申请实施例的方案。

下面参考图4，其示出了适于用来实现本申请实施例的终端设备的计算机系统400的结构示意图。

如图4所示，计算机系统400包括中央处理单元(CPU)401，其可以根据存储在只读存储器(ROM)402中的程序或者从存储部分408加载到随机访问存储器(RAM)403中的程序而执行各种适当的动作和处理。在RAM 403中，还存储有系统400操作所需的各种程序和数据。CPU 401、ROM 402以及RAM 403通过总线404彼此相连。输入/输出(I/O)接口405也连接至总线404。

以下部件连接至I/O接口405：包括键盘、鼠标等的输入部分406；包括诸如阴极射线管(CRT)、液晶显示器(LCD)等以及扬声器等的输出部分407；包括硬盘等的存储部分408；以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分409。通信部分409经由诸如因特网的网络执行通信处理。驱动器410也根据需要连接至I/O接口405。可拆卸介质411，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器410上，以便于从其上读出的计算机程序根据需要被安装入存储部分408。

特别地，根据本公开的实施例，上文参考流程图图1描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在机器可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分409从网络上被下载和安装，和/或从可拆卸介质411被安装。在该计算机程序被中央处理单元(CPU)401执行时，执行本申请的系统中限定的上述功能。

需要说明的是，本发明所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本发明中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本发明中，计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、电线、光缆、RF等等，或者上述的任意合适的组合。

附图中的流程图和框图，图示了按照本发明各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，前述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

描述于本申请实施例中所涉及到的单元或模块可以通过软件的方式实现，也可以通过硬件的方式来实现。所描述的单元或模块也可以设置在处理器中，例如，可以描述为：一种处理器包括接收单元和动态加载单元。其中，这些单元或模块的名称在某种情况下并不构成对该单元或模块本身的限定，例如，接收单元还可以被描述为“用于接收用于启动待加载页面的触发事件的单元”。

作为另一方面，本申请还提供了一种计算机可读存储介质，该计算机可读存储介质可以是上述实施例中描述的电子设备中所包含的；也可以是单独存在，而未装配入该电子设备中的。上述计算机可读存储介质存储有一个或者多个程序，当上述前述程序被一个或者一个以上的处理器用来执行描述于本申请的页面加载方法。

以上描述仅为本申请的较佳实施例以及对所运用技术原理的说明。本领域技术人员应当理解，本申请中所涉及的发明范围，并不限于上述技术特征的特定组合而成的技术方案，同时也应涵盖在不脱离前述发明构思的情况下，由上述技术特征或其等同特征进行任意组合而形成的其它技术方案。例如上述特征与本申请中公开的(但不限于)具有类似功能的技术特征进行互相替换而形成的技术方案。

Claims (10)

1.一种页面加载方法，其特征在于，该方法包括：

接收用于启动待加载页面的触发事件，所述待加载页面包括预先写入的标志图像的可缩放矢量图，所述可缩放矢量图包括至少一个元素部件；

响应于所述触发事件，按照所述元素部件的布局位置加载所述元素部件的属性数据，使得在所述待加载页面被加载的过程中所述可缩放矢量图呈现动态变化。

2.根据权利要求1所述的页面加载方法，其特征在于，按照所述元素部件的布局位置加载所述元素部件的属性数据，包括：

调用层叠样式表版本3来控制所述元素部件的填充色呈现动态变化。

3.根据权利要求2所述的页面加载方法，其特征在于，所述调用层叠样式表版本3来控制所述元素部件的填充色呈现动态变化，包括：

确定每个所述元素部件的所述填充色；

确定每个所述填充色的渐变属性；

确定每个所述渐变属性的时间属性和/或延迟属性；

根据所述时间属性和/或延迟属性控制所述填充色在所述渐变属性范围内动态变化。

4.根据权利要求1所述的页面加载方法，其特征在于，所述预先写入的标志图像的可缩放矢量图，包括：

利用文本编辑器读取所述可缩放矢量图的源码；将所述源码写入所述待加载页面。

5.一种页面加载装置，其特征在于，该装置包括：

接收单元，用于接收用于启动待加载页面的触发事件，所述待加载页面包括预先写入的标志图像的可缩放矢量图，所述可缩放矢量图包括至少一个元素部件；

动态加载单元，用于响应于所述触发事件，按照所述元素部件的布局位置加载所述元素部件的属性数据，使得在所述待加载页面被加载的过程中所述可缩放矢量图呈现动态变化。

6.根据权利要求5所述的页面加载装置，其特征在于，所述动态加载单元还用于调用层叠样式表版本3来控制所述元素部件的填充色呈现动态变化。

7.根据权利要求5所述的页面加载装置，其特征在于，所述动态加载单元，包括：

第一确定子单元，用于确定每个所述元素部件的所述填充色；

第二确定子单元，用于确定每个所述填充色的渐变属性；

第三确定子单元，用于确定每个所述渐变属性的时间属性和/或延迟属性；

控制子单元，用于根据所述时间属性和/或延迟属性控制所述填充色在所述渐变属性范围内动态变化。

8.根据权利要求5所述的页面加载装置，其特征在于，该装置还包括：

源码读取单元，用于利用文本编辑器读取所述可缩放矢量图的源码；源码写入单元，用于将所述源码写入所述待加载页面。

9.一种计算机设备，包括存储器、处理器以及存储在存储器上并可在处理器上运行的计算机程序，其特征在于，所述处理器执行所述程序时实现如权利要求1-4中任一项所述的方法。

10.一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现如权利要求1-4中任一项所述的方法。

Images