CN106020891A

CN106020891A - 页面加载的方法和装置

Info

Publication number: CN106020891A
Application number: CN201610353932.3A
Authority: CN
Inventors: 张建杰; 耿利达; 侯伟
Original assignee: BEIJING XINHUA RUIDE ELECTRONIC READING TECHNOLOGY Co Ltd
Current assignee: BEIJING XINHUA RUIDE ELECTRONIC READING TECHNOLOGY Co Ltd
Priority date: 2016-05-25
Filing date: 2016-05-25
Publication date: 2016-10-12

Abstract

本发明公开了一种页面加载的方法和装置。其中，该方法包括：接收页面加载请求；依据预先存储的代码文件列表获取页面加载请求对应的加载模块；依据加载模块加载待加载页面。本发明解决了由于相关技术中运行requireJs插件带来的代码量的执行多，消耗的时间长，导致的代码执行冗余执行效率低的技术问题。

Description

页面加载的方法和装置

技术领域

本发明涉及计算机应用技术领域，具体而言，涉及一种页面加载的方法和装置。

背景技术

随着移动互联网技术的快速发展以及第五版超文本标记语言(Hypertext MarkupLanguage，简称html5)在移动端的广泛应用，脚本语言(Java Script，简称js)作为一种脚本语言越来在网页web前端开发中发挥着重要作用。但是一个页面的开发可能需要大量js代码，如果一个页面中引入大量js文件，就会导致页面不整洁，逻辑混乱，甚至依赖关系不清晰，最终导致代码难以维护。

相关技术中有遵循AMD规范的模块化加载解决依赖关系的js插件，如JS请求requireJs，通过运行requireJs插件，进而解决由于大量JS文件的引入导致页面不整洁，逻辑混乱，甚至依赖关系不清晰，最终导致代码难以维护的问题发生。

但是requireJs插件的应用所带来的问题在于，requireJs插件在对于一个页面进行的加载之前需要先下载该requireJS插件，进而在加载该页面时，requireJS插件需要大量代码来实现，实际上一个页面对应的运行代码仅为requireJs插件中代码中的一部分，例如，【模块1】依赖A与B，【模块2】依赖C与D，插件加载会预先加载并解析A、B、C、D四个模块(解析会阻塞消耗一定时间)，然后再执行【模块1】与【模块2】，由此可知，requireJs插件虽然解决了依赖关系不清晰的问题，但是该requireJs插件的代码量的执行多，消耗的时间长，因此在代码维护上除了依旧难以维护外，还将对整个系统运行造成负担。

针对上述由于相关技术中运行requireJs插件带来的代码量的执行多，消耗的时间长，导致的代码执行冗余执行效率低的问题，目前尚未提出有效的解决方案。

发明内容

本发明实施例提供了一种页面加载的方法和装置，以至少解决由于相关技术中运行requireJs插件带来的代码量的执行多，消耗的时间长，导致的代码执行冗余执行效率低的技术问题。

根据本发明实施例的一个方面，提供了一种页面加载的方法，包括：接收页面加载请求；依据预先存储的代码文件列表获取页面加载请求对应的加载模块，加载模块用于加载待加载页面；依据加载模块加载待加载页面。

根据本发明实施例的另一方面，还提供了一种页面加载的装置，包括：接收模块，用于接收页面加载请求；获取模块，用于依据预先存储的代码文件列表获取页面加载请求对应的加载模块，加载模块用于加载待加载页面；加载模块，用于依据加载模块加载待加载页面。

在本发明实施例中，通过接收页面加载请求；依据预先存储的代码文件列表获取页面加载请求对应的加载模块；依据加载模块加载待加载页面。达到了减少代码量的目的，从而实现了执行时间短，执行效率高，系统负担小的技术效果，进而解决了由于相关技术中运行requireJs插件带来的代码量的执行多，消耗的时间长，导致的代码执行冗余执行效率低的技术问题。

附图说明

此处所说明的附图用来提供对本发明的进一步理解，构成本申请的一部分，本发明的示意性实施例及其说明用于解释本发明，并不构成对本发明的不当限定。在附图中：

图1是根据本发明实施例的页面加载的方法的流程示意图；

图2是是根据本发明实施例的一种页面加载的方法的流程示意图；

图3是根据本发明实施例的页面加载的装置的流程示意图；

图4是根据本发明实施例的一种页面加载的装置的流程示意图；

图5是根据本发明实施例的另一种页面加载的装置的流程示意图；

图6是根据本发明实施例的又一种页面加载的装置的流程示意图；

图7是根据本发明实施例的再一种页面加载的装置的流程示意图。

具体实施方式

为了使本技术领域的人员更好地理解本发明方案，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分的实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都应当属于本发明保护的范围。

需要说明的是，本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本发明的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。

实施例一

根据本发明实施例，提供了一种页面加载的方法的方法实施例，需要说明的是，在附图的流程图示出的步骤可以在诸如一组计算机可执行指令的计算机系统中执行，并且，虽然在流程图中示出了逻辑顺序，但是在某些情况下，可以以不同于此处的顺序执行所示出或描述的步骤。

图1是根据本发明实施例的页面加载的方法的流程示意图，如图1所示，该方法包括如下步骤：

步骤S102，接收页面加载请求；

步骤S104，依据预先存储的代码文件列表获取页面加载请求对应的加载模块，加载模块用于加载待加载页面；

步骤S106，依据加载模块加载待加载页面。

结合步骤S102至步骤S106，本申请实施例提供的页面加载的方法可以适用于互联网应用技术，特别是对网页的加载，其中，在接收到页面加载请求后，依据预先存储的代码文件列表获取该页面加载请求对应的加载模块，进而通过该加载模块加载待加载页面。

区别于相关技术中的requireJs插件加载待加载页面的方法，本申请实施例在加载待加载页面时，通过代码文件列表获取页面加载请求对应的加载模块，根据页面加载请求执行对应的加载模块，区别于requireJs插件在加载待加载页面的过程中，需要将所有加载模块进行全部加载，本申请实施例通过按需加载减少了代码量的执行，节省了模块解析时间，进而达到了提升代码量的执行效率和减轻系统负担的效果。

本申请实施例提供的页面加载的方法中，通过接收页面加载请求；依据预先存储的代码文件列表获取页面加载请求对应的加载模块；依据加载模块加载待加载页面。达到了减少代码量的目的，从而实现了执行时间短，执行效率高，系统负担小的技术效果，进而解决了由于相关技术中运行requireJs插件带来的代码量的执行多，消耗的时间长，导致的代码执行冗余执行效率低的技术问题。

可选的，步骤S104中依据预先存储的代码文件列表获取页面加载请求对应的加载模块包括：

Step1，解析页面加载请求，得到页面加载请求对应的加载对象；

Step2，依据代码文件列表查询加载对象，得到对应加载对象的模块名称；

Step3，依据模块名称获取对应的模块路径；

Step4，依据模块路径映射代码文件列表，得到模块名称对应的加载模块。

具体的，结合步骤Step1至Step4，本申请实施例通过解析该页面加载请求，得到加载对象，进而通过代码文件列表查询该加载对象，得到对应该加载对象的模块名称，进一步的通过该模块名称获取对应的模块路径，最后通过该模块路径映射代码文件列表得到模块名称对应的加载模块。

这里代码文件列表中加载对象与对应的模块名称存在映射关系，通过得到加载对象得到对应该加载对象的模块名称，同样，模块名称与对应的模块路径存在映射关系，在得到模块名称后，通过映射关系得到对应的模块路径，最后，在得到模块路径后将得到对应的加载模块。

Step2，依据代码文件列表查询加载对象，得到对应加载对象的模块名称和模块名称对应的属性值；

Step3，依据属性值映射代码文件列表，得到对应的加载模块。

本申请实施例提供的页面加载的方法中存在两种依据预先存储的代码文件列表获取页面加载请求对应的加载模块的方法，方法一为上述Step1至Step4的过程，方法二维步骤Step1至Step3，在得到模块名称后，由于模块名称在代码文件列表中存在对应的属性值，因此在得到模块名称后，也将得到对应该模块名称的属性质，进一步的在得到该属性值后通过代码文件列表中记录的映射关系，将得到该属性值对应的加载模块。

可选的，步骤S106中依据加载模块加载待加载页面包括：

Step1，依据加载模块的模块名称定义文件；

Step2，通过预设的映射函数依据模块名称映射至对应的待加载页面；

Step3，依据文件加载待加载页面。

具体的，结合步骤S106中的Step1至Step3，在执行完步骤S104后，根据definerequire files(name)，即，依据加载模块的模块名称定义文件，进而通过映射函数将该模块名映射至对应的待加载页面，即，通过映射关系找到对应的待加载页面，最后根据js文件加载待加载页面。

可选的，在步骤S102中接收页面加载请求之前，本申请实施例提供的页面加载的方法还包括：

步骤S101，将代码文件列表以及对应各个加载模块的算法封装至通用类中。

具体的，图2是是根据本发明实施例的一种页面加载的方法的流程示意图，如图2所示，本申请实施例提供的页面加载的方法中，在对页面加载前，计算机系统内部会预先配置一个依赖关系列表(即，本申请实施例中的代码文件列表)，该依赖关系列表中包含了配置对象和模块名称，以及该模块名称对应的模块路径或/模块名称对应的属性值；

在得到代码文件列表后，将对应各个加载模块的算法也一并与该代码文件列表进行封装，最后得到一个js通用类，因此在执行本申请实施例提供的步骤S102至步骤S106的过程中，在接收到页面加载请求后，将依据该js通用类中的代码文件列表获取页面加载请求中的加载对象，以及该加载对象对应的模块名称，进而得到对应的加载模块，最后由该加载模块加载待加载页面。

实施例二

图3是根据本发明实施例的页面加载的装置的结构示意图，如图3所示，该装置包括：接收模块32、获取模块34和加载模块36，其中，

接收模块32，用于接收页面加载请求；

获取模块34，用于依据预先存储的代码文件列表获取页面加载请求对应的加载模块，加载模块用于加载待加载页面；

加载模块36，用于依据加载模块加载待加载页面。

本申请实施例提供的页面加载的装置中，通过接收页面加载请求；依据预先存储的代码文件列表获取页面加载请求对应的加载模块；依据加载模块加载待加载页面。达到了减少代码量的目的，从而实现了执行时间短，执行效率高，系统负担小的技术效果，进而解决了由于相关技术中运行requireJs插件带来的代码量的执行多，消耗的时间长，导致的代码执行冗余执行效率低的技术问题。

可选的，图4是根据本发明实施例的一种页面加载的装置的流程示意图，如图4所示，获取模块34包括：第一解析单元341、第一查询单元342、获取单元343和第一映射单元344，其中，

第一解析单元341，用于解析页面加载请求，得到页面加载请求对应的加载对象；

第一查询单元342，用于依据代码文件列表查询加载对象，得到对应加载对象的模块名称；

获取单元343，用于依据模块名称获取对应的模块路径；

第一映射单元344，用于依据模块路径映射代码文件列表，得到模块名称对应的加载模块。

可选的，图5是根据本发明实施例的另一种页面加载的装置的流程示意图，如图5所示，获取模块34包括：第二解析单元345、第二查询单元346和第二映射单元347，其中，

第二解析单元345，用于解析页面加载请求，得到页面加载请求对应的加载对象；

第二查询单元346，用于依据代码文件列表查询加载对象，得到对应加载对象的模块名称和模块名称对应的属性值；

第二映射单元347，用于依据属性值映射代码文件列表，得到对应的加载模块。

可选的，图6是根据本发明实施例的又一种页面加载的装置的流程示意图，如图6所示，加载模块36包括：文件定义单元361、映射单元362和加载单元363，其中，

文件定义单元361，用于依据加载模块的模块名称定义文件；

映射单元362，用于通过预设的映射函数依据模块名称映射至对应的待加载页面；

加载单元363，用于依据文件加载待加载页面。

可选的，图7是根据本发明实施例的再一种页面加载的装置的流程示意图，如图7所示，本申请实施例提供的页面加载的装置还包括：封装模块31，其中，

封装模块31，用于在接收页面加载请求之前，将代码文件列表以及对应各个加载模块的算法封装至通用类中。

上述本发明实施例序号仅仅为了描述，不代表实施例的优劣。

在本发明的上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。

在本申请所提供的几个实施例中，应该理解到，所揭露的技术内容，可通过其它的方式实现。其中，以上所描述的装置实施例仅仅是示意性的，例如所述单元的划分，可以为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，单元或模块的间接耦合或通信连接，可以是电性或其它的形式。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。

所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可为个人计算机、服务器或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、只读存储器(ROM，Read-OnlyMemory)、随机存取存储器(RAM，Random Access Memory)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。

以上所述仅是本发明的优选实施方式，应当指出，对于本技术领域的普通技术人员来说，在不脱离本发明原理的前提下，还可以做出若干改进和润饰，这些改进和润饰也应视为本发明的保护范围。

Claims

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

接收页面加载请求；

依据预先存储的代码文件列表获取所述页面加载请求对应的加载模块，所述加载模块用于加载待加载页面；

依据所述加载模块加载所述待加载页面。

2.根据权利要求1所述的方法，其特征在于，所述依据预先存储的代码文件列表获取所述页面加载请求对应的加载模块包括：

解析所述页面加载请求，得到所述页面加载请求对应的加载对象；

依据所述代码文件列表查询所述加载对象，得到对应所述加载对象的模块名称；

依据所述模块名称获取对应的模块路径；

依据所述模块路径映射所述代码文件列表，得到所述模块名称对应的所述加载模块。

3.根据权利要求1所述的方法，其特征在于，所述依据预先存储的代码文件列表获取所述页面加载请求对应的加载模块包括：

依据所述代码文件列表查询所述加载对象，得到对应所述加载对象的模块名称和所述模块名称对应的属性值；

依据所述属性值映射所述代码文件列表，得到对应的所述加载模块。

4.根据权利要求1所述的方法，其特征在于，所述依据所述加载模块加载所述待加载页面包括：

依据所述加载模块的模块名称定义文件；

通过预设的映射函数依据所述模块名称映射至对应的待加载页面；

依据所述文件加载所述待加载页面。

5.根据权利要求1所述的方法，其特征在于，在所述接收页面加载请求之前，所述方法还包括：

将所述代码文件列表以及对应各个加载模块的算法封装至通用类中。

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

接收模块，用于接收页面加载请求；

获取模块，用于依据预先存储的代码文件列表获取所述页面加载请求对应的加载模块，所述加载模块用于加载待加载页面；

加载模块，用于依据所述加载模块加载所述待加载页面。

7.根据权利要求6所述的装置，其特征在于，所述获取模块包括：

第一解析单元，用于解析所述页面加载请求，得到所述页面加载请求对应的加载对象；

第一查询单元，用于依据所述代码文件列表查询所述加载对象，得到对应所述加载对象的模块名称；

获取单元，用于依据所述模块名称获取对应的模块路径；

第一映射单元，用于依据所述模块路径映射所述代码文件列表，得到所述模块名称对应的所述加载模块。

8.根据权利要求6所述的装置，其特征在于，所述获取模块包括：

第二解析单元，用于解析所述页面加载请求，得到所述页面加载请求对应的加载对象；

第二查询单元，用于依据所述代码文件列表查询所述加载对象，得到对应所述加载对象的模块名称和所述模块名称对应的属性值；

第二映射单元，用于依据所述属性值映射所述代码文件列表，得到对应的所述加载模块。

9.根据权利要求6所述的装置，其特征在于，所述加载模块包括：

文件定义单元，用于依据所述加载模块的模块名称定义文件；

映射单元，用于通过预设的映射函数依据所述模块名称映射至对应的待加载页面；

加载单元，用于依据所述文件加载所述待加载页面。

10.根据权利要求6所述的装置，其特征在于，所述装置还包括：

封装模块，用于在所述接收页面加载请求之前，将所述代码文件列表以及对应各个加载模块的算法封装至通用类中。