CN108845839B

CN108845839B - 应用页面加载方法、装置及计算机可读存储介质

Info

Publication number: CN108845839B
Application number: CN201810546965.9A
Authority: CN
Inventors: 钟易宏; 万升; 毛俊杰; 胡进
Original assignee: Kangjian Information Technology Shenzhen Co Ltd
Current assignee: Kangjian Information Technology Shenzhen Co Ltd
Priority date: 2018-05-31
Filing date: 2018-05-31
Publication date: 2023-07-14
Anticipated expiration: 2038-05-31
Also published as: CN108845839A

Abstract

本发明公开了一种应用页面加载方法，该方法包括：在ReactNative应用启动时，加载并执行ReactNative应用的公共包，以生成公共执行上下文，其中，ReactNative应用的软件包由公共包和业务包组成；当需要加载ReactNati ve页面时，检测执行上下文的缓存列表中是否有ReactNative应用的执行上下文信息；若执行上下文的缓存列表中没有ReactNative应用的执行上下文信息，则获取并加载生成的公共执行上下文；获取业务包，并在加载的公共执行上下文上执行业务包的代码，以加载ReactNative页面。本发明还提出一种应用页面加载装置以及一种计算机可读存储介质。本发明解决了现有技术中React Native应用首次加载ReactNative页面等待时间过长的技术问题。

Description

应用页面加载方法、装置及计算机可读存储介质

技术领域

本发明涉及计算机技术领域，尤其涉及一种应用页面加载方法、装置及计算机可读存储介质。

背景技术

随着移动设备硬、软件技术的升级，移动端应用的应用场景越来越广泛，在以往的应用开发场景中，主要使用WEB技术进行实现跨平台应用开发。FaceBook公司发行了一套开源的跨平台移动应用开发框架，即ReactNative，可以简称为RN，由于RN使用Javascript语言，因此熟悉Web前端开发的技术人员只需很少的学习就可以进入移动应用开发领域。

基于ReactNative开发的应用ReactNative提供的打包方式是将应用的全部相关代码打包成一个完整的文件然后通过ReactNative SDK(Software Devel opment Kit，软件开发工具包)进行加载、执行以及渲染出对应的页面。在应用页面加载时，当从原生界面首次跳转到React Native界面时，会有一段时间的白屏过程，经过一段时间的加载，才会加载出界面内容。这就导致React Native应用首次加载ReactNative页面时存在等待时间过长的技术问题。

发明内容

本发明提供一种应用页面加载方法、装置及计算机可读存储介质，其主要目的在于解决现有技术中ReactNative应用首次加载ReactNative页面等待时间过长的技术问题。

为实现上述目的，本发明还提供一种应用页面加载方法，该方法包括：

在ReactNative应用启动时，加载并执行所述ReactNative应用的公共包，以生成公共执行上下文，其中，所述ReactNative应用的软件包由公共包和业务包组成；

当需要加载ReactNative页面时，检测执行上下文的缓存列表中是否有所述ReactNative应用的执行上下文信息；

若执行上下文的缓存列表中没有所述ReactNative应用的执行上下文信息，则获取并加载生成的公共执行上下文；

获取所述业务包，并在加载的所述公共执行上下文上执行所述业务包的代码，以加载所述ReactNative页面。

可选地，所述当需要加载ReactNative页面时，检测执行上下文的缓存列表中是否有所述ReactNative应用的执行上下文信息的步骤之后，所述方法还包括步骤：

若执行上下文的缓存列表中有所述ReactNative应用的执行上下文信息，则获取所述公共执行上下文的加载清单，并根据所述加载清单判断当前的Re actNative页面所属的模块是否被加载；

若当前的ReactNative页面所属的模块已被加载，则创建根视图，为所述根视图指定与当前的ReactNative页面对应的组件名，并将指定组件名后的根视图添加到当前的ReactNative页面的视图上，以加载所述ReactNative页面；

确定当前的ReactNative页面对应的组件名，并将所述组件名添加至所述加载清单中。

可选地，所述获取所述业务包，并在加载的所述公共执行上下文上执行所述业务包，以加载所述ReactNative页面的步骤包括：

读取所述业务包，在加载的所述公共执行上下文上执行所述业务包的代码；

根据所述业务包确定当前的ReactNative页面对应的组件名；

创建根视图，为所述根视图指定与当前的ReactNative页面对应的组件名，并将指定组件名后的根视图添加到当前的ReactNative页面的视图上，以加载所述ReactNative页面。

可选地，所述在ReactNative应用启动时，加载并执行所述ReactNative应用的公共包，以生成公共执行上下文的步骤之后，所述方法还包括步骤：

将生成的公共执行上下文添加至待使用执行上下文清单中；

所述获取生成的公共执行上下文并加载的步骤包括：

根据已获取公共执行上下文清单判断所述ReactNative应用是否已获取执行上下文；

若是，则将已缓存的公共执行上下文加载至内存中；

若否，则从所述待使用执行上下文清单中获取生成的公共执行上下文并加载；

从所述待使用执行上下文清单中移除所述公共执行上下文，并将所述公共执行上下文添加至已获取公共执行上下文清单中。

可选地，所述将所述公共执行上下文添加至已获取公共执行上下文清单中的步骤包括：

以所述ReactNative应用的名字和版本号作为键、以所述公共执行上下文作为值，将所述公共执行上下文添加至已获取公共执行上下文清单中。

此外，为实现上述目的，本发明还提供一种应用页面加载装置，该装置包括存储器和处理器，所述存储器中存储有可在所述处理器上运行的页面加载程序，所述页面加载程序被所述处理器执行时实现如下步骤：

可选地，所述页面加载程序还可被所述处理器执行，以在所述当需要加载ReactNative页面时，检测执行上下文的缓存列表中是否有所述ReactNative应用的执行上下文信息的步骤之后，还实现如下步骤：

根据所述业务包确定当前的ReactNative页面对应的组件名；

可选地，所述页面加载程序还可被处理器执行，以在所述在ReactNative应用启动时，加载并执行所述ReactNative应用的公共包，以生成公共执行上下文的步骤之后，还实现如下步骤：

将生成的公共执行上下文添加至待使用执行上下文清单中；

所述获取生成的公共执行上下文并加载的步骤包括：

若是，则将已缓存的公共执行上下文加载至内存中；

此外，为实现上述目的，本发明还提供一种计算机可读存储介质，所述计算机可读存储介质上存储有页面加载程序，所述页面加载程序可被一个或者多个处理器执行，以实现如上所述的应用页面加载方法的步骤。

本发明提出的应用页面加载方法、装置及计算机可读存储介质，在React Native应用启动时，加载并执行ReactNative应用的公共包，以生成公共执行上下文，其中，ReactNative应用的软件包由公共包和业务包组成；当需要加载ReactNative页面时，检测执行上下文的缓存列表中是否有ReactNative应用的执行上下文信息；若执行上下文的缓存列表中没有ReactNative应用的执行上下文信息，则获取并加载生成的公共执行上下文；获取业务包，并在加载的公共执行上下文上执行业务包的代码，以加载ReactNative页面。通过这种方式，在应用启动时就预先准备好一个执行上下文，在首次加载ReactNative页面时，已经有生成好的执行上下文可以使用，此时，只需要读取业务包在上述执行上下文中加载即可，缩短了ReactNative应用首次加载ReactNative页面时的等待时间，加快了ReactNative页面的加载速度。

附图说明

图1为本发明一实施例提供的应用页面加载方法的流程示意图；

图2为本发明一实施例提供的应用页面加载装置的内部结构示意图；

图3为本发明一实施例提供的应用页面加载装置中页面加载程序的模块示意图。

本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。

本发明提供一种应用页面加载方法。参照图1所示，为本发明一实施例提供的应用页面加载方法的流程示意图。该方法可以由一个装置执行，该装置可以由软件和/或硬件实现。

在本实施例中，应用页面加载方法包括：

步骤S10，在ReactNative应用启动时，加载并执行所述ReactNative应用的公共包，以生成公共执行上下文，其中，所述ReactNative应用的软件包由公共包和业务包组成。

本实施例中的ReactNative应用一共有两个包，一个公共包和一个业务包，其中公共包是将基于ReactNative开发的应用的完整代码中的react模块和rea ct-native模块打包成的，业务包是将完整代码中除上述react模块和react-nati ve模块之外的代码打包成的。

其中，对于应用服务器来说，在打包该应用时，通过以下步骤实现：

应用服务器接收开发人员上传的基于ReactNative开发的ReactNative应用的完整代码，将将完整代码拆分打包为公共包common.jsbundle以及对应的公共包描述文件、业务包business.jsbundle以及对应的业务包描述文件。

具体地，打包公共包的步骤包括以下细化步骤：

新建一个代码库，该代码库的入口文件只引用代码中的react模块和reac t-native模块；从ReactNative源代码库建立一个分支，在新建的分支中添加生成描述文件的功能，修改文件Bundle.js，以在该文件中添加根据模块信息生成描述信息的方法，其中，文件Bundle.js的路径为react-native/packager/src/Bundle/Bundle.js，然后在路径为react-native/local-cli/bundle/output/bundle.js的文件bundle.js的saveBundleAndMap方法中调用添加根据模块信息生成描述信息的方法，以输出公共包的描述文件，描述文件中包含有模块ID、模块哈希值以及对应的模块名称。

打包业务包的步骤包括以下细化步骤：

针对完整的代码，以模块为单位，取模块代码的哈希值作为关键字，判断对应的模块是否在公共包中，如果是，则根据公共包的描述文件确定上述哈希值对应的公共包ID；若不是，则为该模型定义新的ID，重复执行上述过程，确定出所有已经出现在公共包中的ID，从完整的代码中删除掉所有公共包ID对应的模块的代码，并且剩余模块在上述过程中都定义了新的ID。其中在定义ID时，通过打包命令传入开始标识start-ID、业务包标识ID后，以此为基准递增，避免与公共包中的模块的ID重复。过滤掉公共包ID对应的模块代码后，将剩余模块的代码打包为业务包，同时生成业务包的描述文件。

例如，公共包的描述文件为：

{

“modues”:{

……

“qt98wqhuq12dbq65zccc9d89a89jaadj”:{

“id”:12,

“name”:“react/index.js”

},

……

“udyu1t6532fdqrdoxcvtrftquyeqyexm”:{

“id”:361,

“name”:“takesnapshot”

}

},

“lastId”:361

}

业务包的描述文件为：

{

“modues”:{

“eyqidwqq7825qtwjkaduadyuk892jwd7”:{

“id”:1000,

“name”:“eva-rn/index.android.js”

},

……

“34b49cc9f442352cc078eed39af5ad96”:{

“id”:1074,

“name”:“eva-rn/styles/APPlink/style.react.js”

}

},

“lastId”:1074

}

在上述描述文件中，业务包的模块ID从1000开始编号，避免与公共包中的ID重复。应用服务器在下发ReactNative应用的软件包时，将上述公共包和业务包下发给用户。

在移动终端上加载该ReactNative应用时，并不是直接加载该应用的全部的代码，而是分成两部分加载，在应用启动时，加载公共包，基于加载的公共包生成一个公共执行上下文，以供在后续加载ReactNative页面时使用。此外，在首次生成公共执行上下文之后，创建一个待使用执行上下文清单，并将生成的公共执行上下文添加至待使用执行上下文清单中。

步骤S20，当需要加载ReactNative页面时，检测执行上下文的缓存列表中是否有所述ReactNative应用的执行上下文信息。

步骤S30，若执行上下文的缓存列表中没有所述ReactNative应用的执行上下文信息，则获取并加载生成的公共执行上下文。

在ReactNative应用的运行过程中，当需要加载ReactNative页面时，通过执行上下文的缓存列表判断该应用是否被加载过，若该应用不是首次加载ReactNative页面，则上述缓存列表中会有该应用的执行上下文信息，若是首次加载，则上述缓存列表中没有该应用的执行上下文信息。此时，获取并加载生成的公共执行上下文。

具体地，获取生成的公共执行上下文并加载的步骤包括：

根据已获取公共执行上下文清单判断所述ReactNative应用是否已获取执行上下文；若是，则将已缓存的公共执行上下文加载至内存中；若否，则从所述待使用执行上下文清单中获取生成的公共执行上下文并加载；从所述待使用执行上下文清单中移除所述公共执行上下文，并将所述公共执行上下文添加至已获取公共执行上下文清单中。

在要加载生成的公共执行上下文时，先根据已获取公共执行上下文清单判断ReactNative应用是否已获取过执行上下文；若是，则直接将已获取并缓存的公共执行上下文加载至内存中。否则，从待使用执行上下文清单中获取生成的公共执行上下并加载，此时，将该公共执行上下文从待使用执行上下文清单中移除，并添加至已获取公共执行上下文清单中。具体地，以所述ReactNative应用的名字和版本号作为键、以所述公共执行上下文作为值，将所述公共执行上下文添加至已获取公共执行上下文清单中。

步骤S40，获取所述业务包，并在加载的所述公共执行上下文上执行所述业务包的代码，以加载所述ReactNative页面。

在完成公共执行上下文的加载后，在该公共执行上下文中执行该业务包的代码，实现ReactNative页面的加载。具体地，读取所述业务包，在加载的所述公共执行上下文上执行所述业务包的代码；根据所述业务包确定当前的ReactNative页面对应的组件名；创建根视图，为所述根视图指定与当前的ReactNative页面对应的组件名，并将指定组件名后的根视图添加到当前的ReactNative页面的视图上，以加载所述ReactNative页面。

此外，在步骤S20之后，若执行上下文的缓存列表中有ReactNative应用的执行上下文信息，则获取公共执行上下文的加载清单，并根据加载清单判断当前的ReactNative页面所属的模块是否被加载；若当前的ReactNative页面所属的模块已被加载，则创建根视图，为根视图指定与当前的ReactNative页面对应的组件名，并将指定组件名后的根视图添加到当前的ReactNative页面的视图上，以加载ReactNative页面；将确定当前的ReactNative页面对应的组件名，并将组件名添加至加载清单中。

若当前的ReactNative页面所属的模块未被加载，则获取业务包。由于此时执行上下文的缓存列表中有所述ReactNative应用的执行上下文信息，因此，可以从缓存中获取公共执行上下文并加载，在该公共执行上下文上执行获取的业务包，若执行成功，则创建根视图，为所述根视图指定与当前的ReactNative页面对应的组件名，并将指定组件名后的根视图添加到当前的ReactNative页面的视图上，以加载所述ReactNative页面，并且确定当前的ReactNative页面对应的组件名，并将所述组件名添加至所述加载清单中。

若该应用不是首次加载ReactNative页面，则上述缓存列表中会有该应用的执行上下文信息，此时，获取公共执行上下文的加载清单，该清单上包含有已经该ReactNative应用已加载过的模块和组件信息，其中，对于一个应用来说，可以包含多个模块，一个模块中可以有多个组件。一个ReactNative页面可以对应于一个组件。

进一步地，由于应用启动时，会生成一个公共执行上下文，并将其添加到了待使用执行上下文清单中，后续使用时会将其取出使用，因此，还可以实时地对待使用执行上下文清单中的公共执行上下文的数量进行检测，当检测到待使用清单中的公共执行上下文的数量小于1时，根据公共包生成一个公共执行上下文，添加到待使用执行上下文清单中，以保证随时有一个公共执行上下文可供使用。

进一步地，在当前的ReactNative页面退出时，从公共执行上下文的加载清单中移除对应的组件名，如果该应用对应的组件名全部移除，则从已获取公共执行上下文清单中移除执行上下文，并释放执行上下文。

本实施例提出的应用页面加载方法，在ReactNative应用启动时，加载并执行ReactNative应用的公共包，以生成公共执行上下文，其中，ReactNative应用的软件包由公共包和业务包组成；当需要加载ReactNative页面时，检测执行上下文的缓存列表中是否有ReactNative应用的执行上下文信息；若执行上下文的缓存列表中没有ReactNative应用的执行上下文信息，则获取并加载生成的公共执行上下文；获取业务包，并在加载的公共执行上下文上执行业务包的代码，以加载ReactNative页面。通过这种方式，在应用启动时就预先准备好一个执行上下文，在首次加载ReactNative页面时，已经有生成好的执行上下文可以使用，此时，只需要读取业务包在上述执行上下文中加载即可，缩短了ReactNative应用首次加载ReactNative页面时的等待时间，加快了ReactNative页面的加载速度。

本发明还提供一种应用页面加载装置。参照图2所示，为本发明一实施例提供的应用页面加载装置的内部结构示意图。

在本实施例中，应用页面加载装置1可以是PC(Personal Computer，个人电脑)，也可以是智能手机、平板电脑、便携计算机等终端设备。该应用页面加载装置1至少包括存储器11、处理器12，通信总线13，以及网络接口14。

其中，存储器11至少包括一种类型的可读存储介质，所述可读存储介质包括闪存、硬盘、多媒体卡、卡型存储器(例如，SD或DX存储器等)、磁性存储器、磁盘、光盘等。存储器11在一些实施例中可以是应用页面加载装置1的内部存储单元，例如该应用页面加载装置1的硬盘。存储器11在另一些实施例中也可以是应用页面加载装置1的外部存储设备，例如应用页面加载装置1上配备的插接式硬盘，智能存储卡(Smart Media Card,SMC)，安全数字(Secure Digital,SD)卡，闪存卡(Flash Card)等。进一步地，存储器11还可以既包括应用页面加载装置1的内部存储单元也包括外部存储设备。存储器11不仅可以用于存储安装于应用页面加载装置1的应用软件及各类数据，例如页面加载程序01的代码等，还可以用于暂时地存储已经输出或者将要输出的数据。

处理器12在一些实施例中可以是一中央处理器(Central Processing Uni t,CPU)、控制器、微控制器、微处理器或其他数据处理芯片，用于运行存储器11中存储的程序代码或处理数据，例如执行页面加载程序01等。

通信总线13用于实现这些组件之间的连接通信。

网络接口14可选的可以包括标准的有线接口、无线接口(如WI-FI接口)，通常用于在该装置1与其他电子设备之间建立通信连接。

可选地，该装置1还可以包括用户接口，用户接口可以包括显示器(Display)、输入单元比如键盘(Keyboard)，可选的用户接口还可以包括标准的有线接口、无线接口。可选地，在一些实施例中，显示器可以是LED显示器、液晶显示器、触控式液晶显示器以及OLED(Organic Light-Emitting Diode，有机发光二极管)触摸器等。其中，显示器也可以适当的称为显示屏或显示单元，用于显示在应用页面加载装置1中处理的信息以及用于显示可视化的用户界面。

图2仅示出了具有组件11-14以及页面加载程序01的应用页面加载装置1，本领域技术人员可以理解的是，图1示出的结构并不构成对应用页面加载装置1的限定，可以包括比图示更少或者更多的部件，或者组合某些部件，或者不同的部件布置。

在图2所示的装置1实施例中，存储器11中存储有页面加载程序01；处理器12执行存储器11中存储的页面加载程序01时实现如下步骤：

在ReactNative应用启动时，加载并执行所述ReactNative应用的公共包，以生成公共执行上下文，其中，所述ReactNative应用的软件包由公共包和业务包组成。

本实施例中的ReactNative应用一共有两个包，一个公共包和一个业务包，其中公共包是将基于ReactNative开发的应用的完整代码中的react模块和react-native模块打包成的，业务包是将完整代码中除上述react模块和react-native模块之外的代码打包成的。

具体地，打包公共包的步骤包括以下细化步骤：

新建一个代码库，该代码库的入口文件只引用代码中的react模块和react-native模块；从ReactNative源代码库建立一个分支，在新建的分支中添加生成描述文件的功能，修改文件Bundle.js，以在该文件中添加根据模块信息生成描述信息的方法，其中，文件Bundle.js的路径为react-native/packager/src/Bundle/Bundle.js，然后在路径为react-native/local-cli/bundle/output/bundle.js的文件bundle.js的saveBundleAndMap方法中调用添加根据模块信息生成描述信息的方法，以输出公共包的描述文件，描述文件中包含有模块ID、模块哈希值以及对应的模块名称。

打包业务包的步骤包括以下细化步骤：

例如，公共包的描述文件为：

{

“modues”:{

……

“qt98wqhuq12dbq65zccc9d89a89jaadj”:{

“id”:12,

“name”:“react/index.js”

},

……

“udyu1t6532fdqrdoxcvtrftquyeqyexm”:{

“id”:361,

“name”:“takesnapshot”

}

},

“lastId”:361

}

业务包的描述文件为：

{

“modues”:{

“eyqidwqq7825qtwjkaduadyuk892jwd7”:{

“id”:1000,

“name”:“eva-rn/index.android.js”

},

……

“34b49cc9f442352cc078eed39af5ad96”:{

“id”:1074,

“name”:“eva-rn/styles/APPlink/style.react.js”

}

},

“lastId”:1074

}

当需要加载ReactNative页面时，检测执行上下文的缓存列表中是否有所述ReactNative应用的执行上下文信息。

若执行上下文的缓存列表中没有所述ReactNative应用的执行上下文信息，则获取并加载生成的公共执行上下文。

具体地，获取生成的公共执行上下文并加载的步骤包括：

此外，在检测执行上下文的缓存列表中是否有所述ReactNative应用的执行上下文信息的步骤之后，若执行上下文的缓存列表中有ReactNative应用的执行上下文信息，则获取公共执行上下文的加载清单，并根据加载清单判断当前的ReactNative页面所属的模块是否被加载；若当前的ReactNative页面所属的模块已被加载，则创建根视图，为根视图指定与当前的ReactNative页面对应的组件名，并将指定组件名后的根视图添加到当前的ReactNative页面的视图上，以加载ReactNative页面；将确定当前的ReactNative页面对应的组件名，并将组件名添加至加载清单中。

本实施例提出的应用页面加载装置，在ReactNative应用启动时，加载并执行ReactNative应用的公共包，以生成公共执行上下文，其中，ReactNative应用的软件包由公共包和业务包组成；当需要加载ReactNative页面时，检测执行上下文的缓存列表中是否有ReactNative应用的执行上下文信息；若执行上下文的缓存列表中没有ReactNative应用的执行上下文信息，则获取并加载生成的公共执行上下文；获取业务包，并在加载的公共执行上下文上执行业务包的代码，以加载ReactNative页面。通过这种方式，在应用启动时就预先准备好一个执行上下文，在首次加载ReactNative页面时，已经有生成好的执行上下文可以使用，此时，只需要读取业务包在上述执行上下文中加载即可，缩短了ReactNative应用首次加载ReactNative页面时的等待时间，加快了ReactNative页面的加载速度。

可选地，在其他的实施例中，页面加载程序还可以被分割为一个或者多个模块，一个或者多个模块被存储于存储器11中，并由一个或多个处理器(本实施例为处理器12)所执行以完成本发明，本发明所称的模块是指能够完成特定功能的一系列计算机程序指令段，用于描述页面加载程序在应用页面加载装置中的执行过程。

例如，参照图3所示，为本发明应用页面加载装置一实施例中的页面加载程序的程序模块示意图，该实施例中，页面加载程序可以被分割为第一加载模块10、信息检测模块20、第二加载模块30和应用页面加载模块40，示例性地：

第一加载模块10用于：在ReactNative应用启动时，加载并执行所述ReactNative应用的公共包，以生成公共执行上下文，其中，所述ReactNative应用的软件包由公共包和业务包组成；

信息检测模块20用于：当需要加载ReactNative页面时，检测执行上下文的缓存列表中是否有所述ReactNative应用的执行上下文信息；

第二加载模块30用于：若执行上下文的缓存列表中没有所述ReactNative应用的执行上下文信息，则获取并加载生成的公共执行上下文；

应用页面加载模块40用于：获取所述业务包，并在加载的所述公共执行上下文上执行所述业务包的代码，以加载所述ReactNative页面。

上述第一加载模块10、信息检测模块20、第二加载模块30和应用页面加载模块40等程序模块被执行时所实现的功能或操作步骤与上述实施例大体相同，在此不再赘述。

此外，本发明实施例还提出一种计算机可读存储介质，所述计算机可读存储介质上存储有页面加载程序，所述页面加载程序可被一个或多个处理器执行，以实现如下操作：

本发明计算机可读存储介质具体实施方式与上述应用页面加载装置和方法各实施例基本相同，在此不作累述。

需要说明的是，上述本发明实施例序号仅仅为了描述，不代表实施例的优劣。并且本文中的术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、装置、物品或者方法不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、装置、物品或者方法所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括该要素的过程、装置、物品或者方法中还存在另外的相同要素。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在如上所述的一个存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，计算机，服务器，或者网络设备等)执行本发明各个实施例所述的方法。

以上仅为本发明的优选实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims

1.一种应用页面加载方法，其特征在于，所述方法包括：

若执行上下文的缓存列表中有所述ReactNative应用的执行上下文信息，则获取所述公共执行上下文的加载清单，根据所述加载清单判断当前的ReactNative页面所属的模块是否被加载，若当前的ReactNative页面所属的模块已被加载，则创建根视图，为所述根视图指定与当前的ReactNative页面对应的组件名，并将指定组件名后的根视图添加到当前的ReactNative页面的视图上以加载所述ReactNative页面，以及，确定当前的ReactNative页面对应的组件名，将所述组件名添加至所述加载清单中；

2.如权利要求1所述的应用页面加载方法，其特征在于，所述获取所述业务包，并在加载的所述公共执行上下文上执行所述业务包，以加载所述ReactNative页面的步骤包括：

根据所述业务包确定当前的ReactNative页面对应的组件名；

3.如权利要求1或2所述的应用页面加载方法，其特征在于，所述在ReactNative应用启动时，加载并执行所述ReactNative应用的公共包，以生成公共执行上下文的步骤之后，所述方法还包括步骤：

将生成的公共执行上下文添加至待使用执行上下文清单中；

所述获取并加载生成的公共执行上下文的步骤包括：

若是，则将已缓存的公共执行上下文加载至内存中；

4.如权利要求3所述的应用页面加载方法，其特征在于，所述将所述公共执行上下文添加至已获取公共执行上下文清单中的步骤包括：

5.一种应用页面加载装置，其特征在于，所述装置包括存储器和处理器，所述存储器上存储有可在所述处理器上运行的页面加载程序，所述页面加载程序被所述处理器执行时实现如下步骤：

6.如权利要求5所述的应用页面加载装置，其特征在于，所述获取所述业务包，并在加载的所述公共执行上下文上执行所述业务包，以加载所述ReactNative页面的步骤包括：

根据所述业务包确定当前的ReactNative页面对应的组件名；

7.如权利要求5或6所述的应用页面加载装置，其特征在于，所述页面加载程序还可被处理器执行，以在所述在ReactNative应用启动时，加载并执行所述ReactNative应用的公共包，以生成公共执行上下文的步骤之后，还实现如下步骤：

将生成的公共执行上下文添加至待使用执行上下文清单中；

所述获取并加载生成的公共执行上下文的步骤包括：

若是，则将已缓存的公共执行上下文加载至内存中；

8.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质上存储有页面加载程序，所述页面加载程序可被一个或者多个处理器执行，以实现如权利要求1至4中任一项所述的应用页面加载方法的步骤。