[发明专利]一种前端资源加载方法及装置

说明书

技术领域

本发明涉及计算机技术领域，特别涉及一种前端资源加载方法及装置。

背景技术

单页Web应用(SPA，single-page application)是一种特殊的Web应用。它将所有的活动局限于一个Web页面中，仅在该Web页面初始化时加载相应的超文本标记语言(HTML，HyperText Mark-up Language)、JavaScript和层叠样式表(CSS，Cascading Style Sheets)。一旦页面加载完成了，SPA不会因为用户的操作而进行页面的重新加载或跳转。取而代之的是利用JavaScript动态的变换HTML的内容，从而实现用户界面(UI，User Interface)与用户的交互。由于避免了页面的重新加载，SPA可以提供较为流畅的用户体验。

现有技术中，通常利用HTML标签进行直接内嵌资源内容或外联资源文件，或者，使用一些浏览器所具有的应用程序编程接口(API，Application Programming Interface)动态的生成相应资源的标签并插入到文档当中以引导浏览器进行资源的下载。

在上述现有技术中，在下载资源文件时，将会阻断整个页面的渲染，并同时中断对用户交互的响应直到相应资源文件加载并解析完成才会恢复页面的渲染，并且，在非首次加载资源文件时，即使资源文件并没有更新，浏览器依然需要发出足够多的请求以获取资源的内容，请求过多时占用网络资源，降低效率，以及，如果出现某一资源加载失败，则可能导致页面布局错乱、交互失效。

发明内容

有鉴于此，本发明提供一种前端资源加载方法及装置，通过客户端并发请求拉取前端资源，以及利用该客户端的本地存储能力，提高非首次使用该客户端时加载所需前端资源的速度，减少加载所占用的流量，并且降低客户端渲染网页时由于加载该前端资源而造成的渲染中断率。

本发明实施例提供一种前端资源加载方法，包括：

客户端获取并解析目标站点的网页文档，所述网页文档中包含待加载前端资源的描述信息；

根据所述待加载前端资源的描述信息，判断是否在本地存储有所述待加载前端资源；

若是，则读取所述待加载前端资源并添加入所述网页文档，若否，则向服务器请求下载所述待加载前端资源，将下载的所述待加载前端资源添加入所述网页文档；

展示添加入所述待加载前端资源的所述网页文档。

本发明实施例提供一种前端资源加载装置，包括：

获取模块，用于获取目标站点的网页文档，所述网页文档中包含待加载前端资源的描述信息；

解析模块，用于解析所述获取模块获取的所述目标站点的网页文档；

判断模块，用于根据所述待加载前端资源的描述信息，判断是否在本地存储有所述待加载前端资源；

读取模块，用于若所述判断模块判断在本地存储有所述待加载前端资源，则读取所述待加载前端资源；

添加模块，用于将所述读取模块读取的本地存储的所述待加载前端资源添加入所述网页文档；

请求模块，用于若所述判断模块判断在本地未存储有所述待加载前端资源，则向服务器请求下载所述待加载前端资源；

所述添加模块，还用于将下载的所述待加载前端资源添加入所述网页文档；

展示模块，用于展示添加入所述待加载前端资源的所述网页文档。

根据上述实施例提供的一种前端资源加载方法及装置，通过客户端根据网页文档中包含的待加载前端资源的描述信息，判断在本地是否存储有该待加载前端资源，若是，则直接从本地读取该待加载前端资源并添加入该网页文档，若否，则向服务器请求下载该待加载前端资源并加入该网页文档，可提高非首次使用该客户端时加载所需前端资源的速度，减少流量占用。

为让本发明的上述和其他目的、特征和优点能更明显易懂，下文特举较佳实施例，并配合所附图式，作详细说明如下。

附图说明

图1为本发明实施例提供的前端资源加载方法及装置的应用环境图。

图2为一种移动终端的结构示意图；

图3为本发明第一实施例提供的前端资源加载方法的流程图；

图4为本发明第二实施例提供的前端资源加载方法的流程图；

图5为本发明第三实施例提供的前端资源加载装置的结构示意图；

图6为本发明第四实施例提供的前端资源加载装置的结构示意图。

具体实施方式