CN106569856B - 一种应用视图资源文件的加载方法和装置 - Google Patents
一种应用视图资源文件的加载方法和装置 Download PDFInfo
- Publication number
- CN106569856B CN106569856B CN201610952330.XA CN201610952330A CN106569856B CN 106569856 B CN106569856 B CN 106569856B CN 201610952330 A CN201610952330 A CN 201610952330A CN 106569856 B CN106569856 B CN 106569856B
- Authority
- CN
- China
- Prior art keywords
- file
- business
- react
- module file
- business module
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Stored Programmes (AREA)
Abstract
本发明实施例提供一种应用视图资源文件的加载方法和装置。一种应用视图资源文件的加载方法,包括:获取针对应用客户端的启动指令;获取所述应用客户端的react‑native的基础模块文件和所述应用客户端的基础业务模块文件;将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包;根据所述目标应用资源文件包初始化react‑native环境并在所述react‑native环境中创建所述应用客户端的界面视图。本发明的技术方案启动应用客户端时加载的资源文件包较小,能缩短应用客户端的启动的时间,避免出现白屏现象。
Description
技术领域
本发明涉及计算机技术领域,尤其涉及一种应用视图资源文件的加载方法和装置。
背景技术
随着计算技术的发展,开发者们利用各种开发技术开发出了各种网站、客户端等互联网产物,丰富大众的工作与生活,为人们带来各种便利。为了使各种开发技术迅速发展,开发者们在网络上通过共享开源项目来促进各种开发技术变得更加成熟,react-native就是其中一种开源项目,它能在JavaScript(一种直译式脚本语言)中用React(一种设计思想)抽象操作系统原生的UI(User Interface,用户面)组件,代替DOM(DocumentObject Model,文档对象类型)元素进行渲染。
利用react-native开发应用为开发者们提供了便利,但是开发的应用功能越复杂,react-native经过本地编译打包生成的资源文件包就越大,因为在应用首次启动时需要将整个资源文件包进行加载,这样导致启动时间较长,应用客户端界面长时间处于白屏状态。
发明内容
本发明提供一种应用视图资源文件的加载方法和装置,在应用客户端启动时加载的资源文件包较小,能缩短应用客户端的启动的时间,避免出现白屏现象。
本发明实施例第一方面提供一种应用视图资源文件的加载方法,所述方法包括:
获取针对应用客户端的启动指令;
获取所述应用客户端的react-native的基础模块文件和所述应用客户端的基础业务模块文件;
将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包;
根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图。
相应的,本发明实施例第二方面提供一种应用视图资源文件的加载装置,所述装置包括:
启动指令获取模块,用于获取针对应用客户端的启动指令;
基础文件获取模块,用于获取所述应用客户端的react-native的基础模块文件和所述应用客户端的基础业务模块文件;
文件合并模块,用于将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包;
界面视图创建模块,用于根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图。
本发明实施例通过获取针对应用客户端的启动指令和应用客户端的react-native的基础模块文件和基础业务模块文件,将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包,根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图,目标应用资源文件包中只包含基础模块文件和基础业务模块文件,不含其他业务模块文件,在用户启动应用客户端而不访问其他业务的情况下可以节省用户流量,启动应用客户端时只需加载目标资源文件包中的模块,缩短应用客户端的启动的时间,避免出现白屏现象。
附图说明
为了更清楚地说明本发明实施例中的技术方案,下面将对实施例中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是本发明实施例中的一种应用视图资源文件的加载方法的流程示意图;
图2-a是本发明实施中的首次启动应用客户端时创建的界面视图;
图2-b是本发明实施例中的首次启动应用客户端时创建的另一种界面视图;
图2-c是本发明实施例中获取用户访问请求后创建的界面视图;
图3是本发明实施例中的另一种应用视图资源文件的加载方法的流程示意图;
图4是本发明实施例中的又一种应用视图资源文件的加载方法的流程示意图;
图5是本发明实施例的应用资源文件的加载方法的具体实现情况示意图;
图6是本发明实施例中的一种应用视图资源文件的加载装置的组成结构示意图;
图7是本发明实施例中的应用视图资源文件的加载装置的基础文件获取模块的组成结构示意图;
图8是本发明实施例中的应用视图资源文件的加载装置的一个硬件组成结构示意图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
本发明的说明书和权利要求书及上述附图中的术语“第一”是用于区别不同对象,而不是用于描述特定顺序。此外,术语“包括”和“具有”以及它们任何变形,意图在于覆盖不排他的包含。例如包含了一系列步骤或单元的过程、方法、系统、产品或设备没有限定于已列出的步骤或单元,而是可选地还包括没有列出的步骤或单元,或可选地还包括对于这些过程、方法、产品或设备固有的其他步骤或单元。
首先参见图1,图1是本发明实施例中的一种应用视图资源文件的加载方法的流程示意图,本发明实施例中的方法可以实现在包括手机、平板电脑、台式电脑、IPAD等具备文件加载功能的计算机或计算系统上。如图所示本发明的方法至少包括:
S101、获取针对应用客户端的启动指令。
可选的,所述应用客户端可以为APP、应用软件等各种客户端。
具体的,例如安装在手机上的即时通讯客户端、资讯浏览应用客户端等。
可选的,所述启动指令包括但不限于用户的长按应用客户端、单击应用客户端、双击应用客户端等各种用于启动应用客户端的动作。
S102、获取所述应用客户端的react-native的基础模块文件和所述应用客户端的基础业务模块文件。
可选的,可以从所述应用客户端的本地安装资源中获取所述应用客户端的react-native的基础模块文件。
具体的,本地安装资源可以为APK(Android Package)包,IPA(iPhoneApplication)包等各种安装包。
可选的,可以从所述应用客户端的后台服务器获取所述应用客户端的基础业务模块文件,也可以从所述应用客户端的本地安装资源中的获取所述应用客户端的基础业务模块文件。
在具体实现中,可以通过http(Hyper Text Transfer Protocol,超文本传输协议)请求的方式从所述应用客户端的后台服务器获取所述应用客户端的基础业务模块文件。
可选的,所述基础模块文件可以包括react-native系统模块或es6(JavaScript脚本语言的下一代标准)兼容polyfill(用于为低版本的浏览器或系统提供标准接口的兼容性文件)文件等用于支持所述应用客户端能正常启动的基础库文件。
可选的,所述基础业务模块文件包括但不限于所述应用客户端的首页模块。
S103、将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包。
可选的,目标应用资源文件包可以为一个bundle文件包。
S104、根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图。
在具体实现中,可以将所述目标应用资源文件包注入到react-native环境的JavaScriptCore(对JavaScript语言进行解析和提供执行环境的框架)解析引擎中完成对react-native环境的初始化,通过调用react-native中的View(视图)组件完成对界面视图的创建,通过react-native中的Bridge(JavaScript语言与Object-C(编程语言)或Java(编程语言)之间的模块配置表)向用户展示界面。
在可选实施例中,JavaScriptCore解析引擎可以由WebView(网络视图)解析引擎代替。
可选的,所述界面视图可以有一幅或多幅界面视图,具体的,如图2-a所示,所述界面视图可以直接为应用客户端的首页界面视图;如图2-b所示,所述界面视图也可以为多幅连贯的界面视图。
本发明实施例通过获取针对应用客户端的启动指令,获取应用客户端的react-native的基础模块文件和基础业务模块文件,将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包,根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图,目标应用资源文件包中只包含基础模块文件和基础业务模块文件,不含其他业务模块文件,在用户启动应用客户端而不访问其他业务的情况下可以节省用户流量,启动应用客户端时只需加载目标资源文件包中模块,缩短应用客户端的启动的时间,避免出现白屏现象。
再请参见图3,图3是本发明实施例中的另一种应用视图资源文件的加载方法的流程示意图,本发明实施例中的方法可以实现在包括手机、平板电脑、台式电脑、IPAD等具备文件加载功能的计算机或计算系统上。如图所示本发明的方法至少包括:
S201、获取针对应用客户端的启动指令。
可选的,所述应用客户端可以为APP、应用软件等各种客户端。
具体的,例如安装在手机上的即时通讯客户端、资讯浏览应用客户端等。
可选的,启动指令包括但不限于用户的长按应用客户端、单击应用客户端、双击应用客户端等各种用于启动应用客户端的动作。
S202、获取所述应用客户端的react-native的基础模块文件和所述应用客户端的基础业务模块文件。
可选的,可以从所述应用客户端的本地安装资源中获取所述应用客户端的react-native的基础模块文件。
具体的,本地安装资源可以为APK包,IPA包等各种安装包。
可选的,可以从所述应用客户端的后台服务器获取所述应用客户端的基础业务模块文件,也可以从所述应用客户端的本地安装资源中的获取所述应用客户端的基础业务模块文件。
在具体实现中,可以通过http请求的方式从所述应用客户端的后台服务器获取所述应用客户端的基础业务模块文件。
可选的,所述基础模块文件可以包括react-native系统模块或es6兼容polyfill文件等用于支持所述应用客户端能正常启动的基础库文件。
可选的,所述基础业务模块文件包括但不限于所述应用客户端的首页模块。
S203、将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包。
可选的,目标应用资源文件包可以为一个bundle文件包。
S204、根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图。
在具体实现中,可以将所述目标应用资源文件包注入到react-native环境的JavaScriptCore解析引擎中完成对react-native环境的初始化,通过调用react-native中的View组件完成对界面视图的创建,通过react-native中的Bridge向用户展示界面。
在可选实施例中,JavaScriptCore解析引擎可以由WebView解析引擎代替。
可选的,所述界面视图可以有一幅或多幅界面视图,具体的,如图2-a所示,所述界面视图可以直接为应用客户端的首页界面视图;如图2-a所示,所述界面视图也可以为多幅连贯的界面视图。
S205、获取针对所述应用客户端的业务访问请求。
可选的,所述业务访问请求可以为用户请求访问应用客户端的部分界面视图的请求。
S206、从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件。
可选的,第一业务模块文件可以为一个bundle文件。
可选的,可以根据用户想要访问的界面确定第一业务模块文件。
可选的,从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件之前可以判断所述react-native环境中是否存在所述业务访问请求对应的第一业务模块文件,当确定所述react-native环境中不存在所述业务访问请求对应的第一业务模块文件时从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件。
可选的,获取到所述第一业务模块文件后,可以将所述第一业务模块文件缓存到所述应用客户端的本地资源中,等到用户再次访问第一业务模块文件对应的界面视图时可以直接从本地资源中获取,节省用户等待的时间。
S207、在所述react-native环境中添加所述第一业务模块文件。
在具体实现中,可以将所述第一业务模块文件注入到所述react-native环境的JavaScriptCore解析引擎中。
在可选实施例中,JavaScriptCore解析引擎可以由WebView解析引擎代替。
S208、根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
可选的,可以通过调用AppRegistry.runApplication运行所述第一业务模块文件来在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
可选的,可以在销毁当前界面视图的同时根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
具体的,例如当前界面如图2-a所示,假设用户请求访问的是名称为“我”的界面视图,则销毁图2-a的界面,创建如图2-c所示的界面视图。
本发明实施例通过获取针对应用客户端的启动指令,获取应用客户端的react-native的基础模块文件和基础业务模块文件,将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包,根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图,目标应用资源文件包中只包含基础模块文件和基础业务模块文件,不含其他业务模块文件,启动应用客户端时只需加载目标资源文件包中的模块,缩短启动的时间,避免应用客户端界面出现白屏现象,同时根据用户的访问请求按需加载业务模块文件和创建界面视图可以减少用户的流量消耗。
进一步的,请参见图4,图4是本发明实施例中的又一种应用视图资源文件的加载方法的流程示意图,本发明实施例中的方法可以实现在包括手机、平板电脑、台式电脑、IPAD等具备文件加载功能的计算机或计算系统上。如图所示本发明的方法至少包括:
S301、获取针对所述应用客户端的业务访问请求。
可选的,所述业务访问请求可以为用户请求访问应用客户端的部分界面视图的请求。
S302、判断所述业务访问请求对应的第一业务模块文件是否存在于所述react-native环境中。
可选的,可以根据用户想要访问的界面确定第一业务模块文件。
具体的,当所述第一业务模块文件不在所述react-native环境中时,执行步骤S304。
S303、当所述第一业务模块文件在所述react-native环境中时,判断所述第一业务模块文件是否过期。
其中,所述第一业务模块文件在所述react-native环境中说明所述业务访问请求为重复的业务访问请求。
可选的,还可以以预设时间段为周期判断所述react-native环境中的所述第一业务模块文件是否已经过期。
具体的,当所述第一业务模块文件已经过期时,执行步骤S304;当所述第一业务模块文件未过期时,执行步骤S306。
可选的,可以通过http 304的方案判断所述第一模块文件是否过期。
具体的,例如当所述第一业务模块文件存在于所述react-native环境中时,可以向所述应用客户端的后台服务器发起获取第一业务模块文件的http请求,当服务器发现所述第一业务模块文件的资源没有变化,则返回http状态码304表示第一业务模块文件没有过期;当服务器发现所述第一业务模块文件的资源发生了变化,则允许客户端获取更新后的第一业务模块文件。
S304、从所述应用客户端的服务器获取所述第一业务模块文件。
在具体实现中,当所述第一业务模块文件过期时,从所述应用客户端的服务器获取到的更新的第一业务模块文件会覆盖原有的第一业务模块文件。
可选的,获取到所述第一业务模块文件后,可以将业务模块文件缓存到所述应用客户端的本地资源中,等到用户再次访问第一业务模块文件对应的界面视图时可以直接从本地资源中获取,节省用户等待的时间。
S305、在所述react-native环境中添加所述第一业务模块文件。
在具体实现中,可以将所述第一业务模块文件注入到所述react-native环境的JavaScriptCore解析引擎中。
在可选实施例中,JavaScriptCore解析引擎可以由WebView解析引擎代替。
S306、根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
可选的,可以通过调用AppRegistry.runApplication运行所述第一业务模块文件来在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
可选的,可以在销毁当前界面视图的同时根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
具体的,例如当前界面如图2-a所示,假设用户请求访问的是名称为“我”的界面视图,则销毁图2-a的界面,创建如图2-c所示的界面视图。
本发明实施例通过获取针对所述应用客户端的业务访问请求,判断所述业务访问请求对应的第一业务模块文件是否存在于所述react-native环境中,当所述react-native环境中不存在第一业务模块文件则说明用户请求访问的界面之前未被请求过,则从所述应用客户端的后台服务器中获取所述第一业务模块文件,按实际访问请求加载模块可以减少用户的流量消耗;当所述react-native环境中存在第一业务模块文件时说明用户请求访问的界面之前已经访问过,则判断所述第一业务模块文件是否过期,未过期则直接调用第一业务模块文件创建视图,过期则从所述应用客户端的后台服务器获取更新后的第一业务模块文件,更新后的第一业务模块文件会覆盖原有的第一业务模块文件,根据更新后的第一业务模块文件创建视图,这样只对部分业务模块文件进行更新而非对整个资源文件包进行更新,可以减少更新的流量消耗,省去应用客户端更新后的初始化过程,提升模块载入的速度。
为便于更好理解和实施本发明实施例的上述方案,下面结合具体的应用场景来进行说明,如图5所示,图5是本发明实施例的应用资源文件的加载方法的具体实现情况示意图。假设用户的手机中下载一个采用react-native开发出来的APP,根据用户的不同操作,手机会执行不同的步骤,具体如下:
第一种情况,用户启动APP时手机执行的步骤为:
手机创建ReactView作为native视图,在创建过程中手机通过RCTBridgeDelegateloadSourceForBridge方法代理,即手机会从APP的本地安装资源中获取react-native基础模块文件P,通过http请求的方式从APP的后台服务器获取基础业务模块文件A,将P和A合并成完整的bundle文件,将这个bundle文件注入到JavaScriptCore解析引擎中,完成初始化逻辑,然后通过JavaScript端和Object-C端的Bridge展示初始化后的界面。
第二种情况,当用户需要访问APP的其他功能界面时手机执行的步骤为:
手机通过RCT_EXPORT_MODULE(react-native开源项目中的方法)创建一个自定义模块,根据用户的访问请求通过http请求的方式从APP的后台服务器获取用户访问请求对应的业务模块文件B,通过Bridge enqueApplication(react-native开源项目中的方法)的方式将业务模块文件B注入到JavaScriptCore解析引擎中,再通过Bridge通知JavaScriptCore解析引擎运行AppRegistry.runApplication来运行业务模块文件B,同时已经运行的业务模块文件会受到销毁事件从而使界面切换到业务模块文件B对应的界面视图。
第三种情况,当部分业务模块文件需要更新时手机执行的步骤为:
手机通过http 304的方案判断JavaScriptCore解析引擎中的业务模块文件是否过期,假设业务模块文件B过期,手机从APP的后台服务器获取更新后的业务模块文件B1,通过Bridge enqueApplication的方式将更新后的业务模块文件B1注入到JavaScriptCore解析引擎中并覆盖原有的业务模块文件B,再通过Bridge通知JavaScriptCore解析引擎运行AppRegistry.runApplication来运行业务模块文件B1以将界面切换到业务模块文件B1对应的界面视图。
参见图6,图6是本发明实施例中的一种应用视图资源文件的加载装置的组成结构示意图,本发明实施例中的装置可以为手机、平板电脑、台式电脑、IPAD等具备文件加载功能的计算机或计算系统。如图所示本发明的装置至少包括:
启动指令获取模块410,用于获取针对应用客户端的启动指令。
可选的,所述应用客户端可以为APP、应用软件等各种客户端。
具体的,例如安装在手机上的即时通讯客户端、资讯浏览应用客户端等。
可选的,所述启动指令包括但不限于用户的长按应用客户端、单击应用客户端、双击应用客户端等各种用于启动应用客户端的动作。
基础文件获取模块420,用于获取所述应用客户端的react-native的基础模块文件和所述应用客户端的基础业务模块文件。
可选的,如图7所示,所述基础文件获取模块420可以包括:
基础模块文件获取单元421,用于从所述应用客户端的本地安装资源中获取所述应用客户端的react-native的基础模块文件。
具体的,本地安装资源可以为APK包,IPA包等各种安装包。
基础业务模块获取单元422,用于从所述应用客户端的后台服务器获取所述应用客户端的基础业务模块文件。
在具体实现中,基础业务模块单元422可以通过http请求的方式从所述应用客户端的后台服务器获取所述应用客户端的基础业务模块文件。
可选的,基础业务模块获取单元422还用于从所述应用客户端的本地安装资源中获取所述应用客户端的react-native的基础模块文件。
可选的,所述基础模块文件可以包括react-native系统模块或es6兼容polyfill文件等用于支持所述应用客户端能正常启动的基础库文件。
可选的,所述基础业务模块文件包括但不限于所述应用客户端的首页模块。
文件合并模块430,用于将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包。
可选的,目标应用资源文件包可以为一个bundle文件包。
界面视图创建模块440,用于根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图。
在具体实现中,所述界面视图创建模块440可以将所述目标资源文件包注入到react-native环境的JavaScriptCore解析引擎中完成对react-native环境的初始化,通过调用react-native中的View组件完成对界面视图的创建,通过react-native中的Bridge向用户展示界面。
在可选实施例中,JavaScriptCore解析引擎可以由WebView解析引擎代替。
可选的,所述界面视图可以有一幅或多幅界面视图,具体的,如图2-a所示,所述界面视图可以直接为应用客户端的首页界面视图;如图2-b所示,所述界面视图也可以为多幅连贯的界面视图。
可选的,所述装置还可以包括:
业务访问请求获取模块450,用于获取针对所述应用客户端的业务访问请求。
可选的,所述业务访问请求可以为用户请求访问应用客户端的部分界面视图的请求。
业务模块文件获取模块460,用于从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件。
可选的,可以根据用户想要访问的界面确定第一业务模块文件。
可选的,第一业务模块文件可以为一个bundle文件。
可选的,业务访问请求获取模块450从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件之前可以判断所述react-native环境中是否存在所述业务访问请求对应的第一业务模块文件,当确定所述react-native环境中不存在所述业务访问请求对应的第一业务模块文件时从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件。
可选的,业务访问请求获取模块450获取到所述第一业务模块文件后,可以将所述第一业务模块文件缓存到所述应用客户端的本地资源中,等到用户再次访问第一业务模块文件对应的界面视图时可以直接从本地资源中获取,节省用户等待的时间。
业务模块文件添加模块470,用于在所述react-native环境中添加所述第一业务模块文件。
在具体实现中,业务模块文件添加模块470可以将所述第一业务模块文件注入到所述react-native环境的JavaScriptCore解析引擎中。
界面视图创建模块440还用于根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
可选的,界面视图创建模块440可以通过调用AppRegistry.runApplication运行所述第一业务模块文件来在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
可选的,界面视图创建模块440可以在销毁当前界面视图的同时根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
具体的,例如当前界面如图2-a所示,假设用户请求访问的是名称为“我”的界面视图,则销毁图2-a的界面,创建如图2-c所示的界面视图。
可选的,所述装置还可以包括:
判断模块480,用于判断所述react-native环境中的所述第一业务模块文件是否已经过期。
可选的,判断模块480可以在业务访问请求获取模块450已经获取到针对所述应用客户端的业务访问请求且所述业务访问请求对应的第一业务模块已经被业务模块文件添加模块470添加进所述react-native环境中时,判断所述react-native环境中的所述第一业务模块文件是否已经过期;也可以以预设时间段为周期判断所述react-native环境中的所述第一业务模块文件是否已经过期。
可选的,判断模块480可以通过http 304的方案判断所述react-native环境中的所述第一业务模块文件是否已经过期。
具体的,例如当所述第一业务模块文件存在于所述react-native环境中时,可以向所述应用客户端的后台服务器发起获取第一业务模块文件的http请求,当服务器发现所述第一业务模块文件的资源没有变化,则返回http状态码304表示第一业务模块文件没有过期;当服务器发现所述第一业务模块文件的资源发生了变化,则允许客户端获取更新后的第一业务模块文件。
业务模块文件获取模块460还用于当所述第一业务模块文件已经过期时,从所述应用客户端的后台服务器获取更新后的第一业务模块文件。
业务模块文件添加模块470还用于将所述更新后的第一业务模块文件添加进所述react-native环境中。
界面视图创建模块440还用于根据更新后的所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
本发明实施例通过获取针对应用客户端的启动指令,获取应用客户端的react-native的基础模块文件和基础业务模块文件,将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包,根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图,目标应用资源文件包中只包含基础模块文件和基础业务模块文件,不含其他业务模块文件,启动应用客户端时只需加载目标资源文件包中的模块,缩短启动的时间,避免应用客户端界面出现白屏现象,根据用户的访问请求按需加载业务模块文件可以减少用户的流量消耗,只对有需要更新的业务模块进行更新既可以减少更新的流量消耗,还能省去应用客户端更新后的初始化过程,提升模块载入的速度。
这里需要指出的是,上述应用视图资源文件的加载装置终端可以为PC这种电子设备,还可以为如PAD,平板电脑,手提电脑这种便携电子设备,不限于这里的描述,应用视图资源文件的加载装置至少包括用于存储数据的数据库和用于数据处理的处理器,可以包括内置的存储介质或独立设置的存储介质。
其中,对于用于数据处理的处理器而言,在执行处理时,可以采用微处理器、中央处理器(CPU,Central Processing Unit)、数字信号处理器(DSP,DigitalSingnalProcessor)或可编程逻辑阵列(FPGA,Field-Programmable Gate Array)实现;对于存储介质来说,包含操作指令,该操作指令可以为计算机可执行代码,通过所述操作指令来实现上述本发明实施例如结合图1、图3或图4所描述的应用视图资源文件的加载流程中的各个步骤。
应用视图资源文件的加载装置作为硬件实体的一个示例如图8所示。所述装置包括处理器501、存储介质502以及至少一个外部通信接口503;所述处理器501、存储介质502以及通信接口503均通过总线504连接。
获取针对应用客户端的启动指令;
获取所述应用客户端的react-native的基础模块文件和所述应用客户端的基础业务模块文件;
将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包;
根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图。
这里需要指出的是:以上涉及应用视图资源文件的加载装置的描述,与前文应用视图资源文件的加载方法的描述是类似的,同方法的有益效果描述,不做赘述。对于本发明应用视图资源文件的加载装置实施例中未披露的技术细节,请参照本发明方法实施例的描述。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程,是可以通过计算机程序来指令相关的硬件来完成,所述的程序可存储于一计算机可读取存储介质中,该程序在执行时,可包括如上述各方法的实施例的流程。其中,所述的存储介质可为磁碟、光盘、只读存储记忆体(Read-Only Memory,ROM)或随机存储记忆体(Random AccessMemory,RAM)等。
本发明实施例方法中的步骤可以根据实际需要进行顺序调整、合并和删减。
本发明实施例装置中的模块可以根据实际需要进行合并、划分和删减。
以上所揭露的仅为本发明较佳实施例而已,当然不能以此来限定本发明之权利范围,因此依本发明权利要求所作的等同变化,仍属本发明所涵盖的范围。
Claims (14)
1.一种应用视图资源文件的加载方法,其特征在于,所述方法包括:
获取针对应用客户端的启动指令;
获取所述应用客户端的react-native的基础模块文件和所述应用客户端的基础业务模块文件;
将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包;
根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图;
获取针对所述应用客户端的业务访问请求;
从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件;
在所述react-native环境中添加所述第一业务模块文件;
根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
2.如权利要求1所述的方法,其特征在于,所述获取所述应用客户端的react-native的基础模块文件和所述应用客户端的基础业务模块文件包括:
从所述应用客户端的本地安装资源中获取所述应用客户端的react-native的基础模块文件;
从所述应用客户端的后台服务器获取所述应用客户端的基础业务模块文件。
3.如权利要求1所述的方法,其特征在于,所述从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件包括:
确定所述react-native环境中不存在所述业务访问请求对应的第一业务模块文件时从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件。
4.如权利要求1或3所述的方法,其特征在于,所述在所述react-native环境中添加所述第一业务模块文件包括:
将所述第一业务模块注入到react-native环境的JavaScriptCore解析引擎中;
所述根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图包括:
通过调用AppRegistry.runApplication运行所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
5.如权利要求1或3所述的方法,其特征在于,所述根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图包括:
在销毁当前界面视图的同时根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
6.如权利要求1所述的方法,其特征在于,所述方法还包括:
判断所述react-native环境中的所述第一业务模块文件是否已经过期;
当所述第一业务模块文件已经过期时,从所述应用客户端的后台服务器获取更新后的第一业务模块文件;
在所述react-native环境中添加所述更新后的第一业务模块文件;
根据所述更新后的第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
7.如权利要求6所述的方法,其特征在于,所述判断所述react-native环境中的所述第一业务模块文件是否已经过期包括:
当获取到针对所述应用客户端的业务访问请求并确定所述业务访问请求对应的第一业务模块已经存在于所述react-native环境中时,判断所述react-native环境中的所述第一业务模块文件是否已经过期;或
以预设时间段为周期判断所述react-native环境中的所述第一业务模块文件是否已经过期。
8.一种应用视图资源文件的加载装置,其特征在于,所述装置包括:
启动指令获取模块,用于获取针对应用客户端的启动指令;
基础文件获取模块,用于获取所述应用客户端的react-native的基础模块文件和所述应用客户端的基础业务模块文件;
文件合并模块,用于将所述基础模块文件与所述基础业务模块文件合并为目标应用资源文件包;
界面视图创建模块,用于根据所述目标应用资源文件包初始化react-native环境并在所述react-native环境中创建所述应用客户端的界面视图;
业务访问请求获取模块,用于获取针对所述应用客户端的业务访问请求;
业务模块文件获取模块,用于从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件;
业务模块文件添加模块,用于在所述react-native环境中添加所述第一业务模块文件;
界面视图创建模块还用于根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
9.如权利要求8所述的装置,其特征在于,所述基础文件获取模块包括:
基础模块文件获取单元,用于从所述应用客户端的本地安装资源中获取所述应用客户端的react-native的基础模块文件;
基础业务模块文件获取单元,用于从所述应用客户端的后台服务器获取所述应用客户端的基础业务模块文件。
10.如权利要求8所述的装置,其特征在于,所述业务模块文件获取模块具体用于确定所述react-native环境中不存在所述业务访问请求对应的第一业务模块文件时从所述应用客户端的后台服务器获取所述业务访问请求对应的第一业务模块文件。
11.如权利要求8或10所述的装置,其特征在于,所述业务模块文件添加模块具体用于将所述第一业务模块注入到react-native环境的JavaScriptCore解析引擎中;
所述界面视图创建模块具体用于通过调用AppRegistry.runApplication运行所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
12.如权利要求8或10所述的装置,其特征在于,所述界面视图创建模块具体用于在销毁当前界面视图的同时根据所述第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
13.如权利要求8所述的装置,其特征在于,所述装置还包括:
判断模块,用于判断所述react-native环境中的所述第一业务模块文件是否已经过期;
业务模块文件获取模块还用于当所述第一业务模块文件已经过期时,从所述应用客户端的后台服务器获取更新后的第一业务模块文件;
业务模块文件添加模块还用于在所述react-native环境中添加所述更新后的第一业务模块文件;
界面视图创建模块还用于根据所述更新后的第一业务模块文件在所述react-native环境中创建所述第一业务模块文件对应的界面视图。
14.如权利要求13所述的装置,其特征在于,所述判断模块具体用于当获取到针对所述应用客户端的业务访问请求并确定所述业务访问请求对应的第一业务模块已经存在于所述react-native环境中时,判断所述react-native环境中的所述第一业务模块文件是否已经过期;或
以预设时间段为周期判断所述react-native环境中的所述第一业务模块文件是否已经过期。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201610952330.XA CN106569856B (zh) | 2016-11-02 | 2016-11-02 | 一种应用视图资源文件的加载方法和装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201610952330.XA CN106569856B (zh) | 2016-11-02 | 2016-11-02 | 一种应用视图资源文件的加载方法和装置 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN106569856A CN106569856A (zh) | 2017-04-19 |
CN106569856B true CN106569856B (zh) | 2019-11-22 |
Family
ID=58535081
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201610952330.XA Active CN106569856B (zh) | 2016-11-02 | 2016-11-02 | 一种应用视图资源文件的加载方法和装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN106569856B (zh) |
Families Citing this family (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN107807831A (zh) * | 2017-10-11 | 2018-03-16 | 五八有限公司 | 应用程序中的业务执行方法、装置、终端及存储介质 |
CN107659516B (zh) * | 2017-10-25 | 2020-09-25 | 新华三技术有限公司 | 一种宽带远程接入服务器bras的功能控制方法和装置 |
CN108132809A (zh) * | 2017-11-29 | 2018-06-08 | 五八有限公司 | 加载的方法、装置、终端及存储介质 |
CN108647304B (zh) * | 2018-05-09 | 2023-11-21 | 中国平安人寿保险股份有限公司 | 报表显示系统、方法、计算机设备及存储介质 |
CN108595160B (zh) * | 2018-05-16 | 2022-04-01 | 福建天泉教育科技有限公司 | Js调用原生对象的方法、存储介质 |
CN110597564A (zh) * | 2018-05-25 | 2019-12-20 | 阿里巴巴集团控股有限公司 | 一种安装包构建和业务组件加载方法、装置、终端设备 |
CN110889058A (zh) * | 2018-09-06 | 2020-03-17 | 福建天泉教育科技有限公司 | 一种React-Native原生能力的加载方法及终端 |
CN112219188A (zh) * | 2019-09-26 | 2021-01-12 | 深圳市大疆创新科技有限公司 | 显示界面控制方法、通信控制方法、系统及控制终端 |
CN111177600B (zh) * | 2019-12-26 | 2023-03-21 | 北京明略软件系统有限公司 | 一种基于移动应用的内置网页加载方法及装置 |
CN113076128B (zh) * | 2020-01-03 | 2023-11-10 | 北京猎户星空科技有限公司 | 用于机器人配置的方法、装置、电子设备及存储介质 |
Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN103440151A (zh) * | 2013-09-05 | 2013-12-11 | 北京京东尚科信息技术有限公司 | 一种动态加载Web页面的方法和装置 |
CN104156243A (zh) * | 2014-08-05 | 2014-11-19 | 网际傲游(北京)科技有限公司 | 一种应用分发和快速加载运行的系统及方法 |
CN104536752A (zh) * | 2014-12-26 | 2015-04-22 | 北京京东尚科信息技术有限公司 | 自动生成apk的方法及装置 |
CN105824900A (zh) * | 2016-03-14 | 2016-08-03 | 传线网络科技(上海)有限公司 | 一种基于react-native的页面展示系统 |
Family Cites Families (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US9547505B2 (en) * | 2013-06-04 | 2017-01-17 | Sap Se | Adaptive contextual graphical representation of development entities |
-
2016
- 2016-11-02 CN CN201610952330.XA patent/CN106569856B/zh active Active
Patent Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN103440151A (zh) * | 2013-09-05 | 2013-12-11 | 北京京东尚科信息技术有限公司 | 一种动态加载Web页面的方法和装置 |
CN104156243A (zh) * | 2014-08-05 | 2014-11-19 | 网际傲游(北京)科技有限公司 | 一种应用分发和快速加载运行的系统及方法 |
CN104536752A (zh) * | 2014-12-26 | 2015-04-22 | 北京京东尚科信息技术有限公司 | 自动生成apk的方法及装置 |
CN105824900A (zh) * | 2016-03-14 | 2016-08-03 | 传线网络科技(上海)有限公司 | 一种基于react-native的页面展示系统 |
Also Published As
Publication number | Publication date |
---|---|
CN106569856A (zh) | 2017-04-19 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN106569856B (zh) | 一种应用视图资源文件的加载方法和装置 | |
US9471704B2 (en) | Shared script files in multi-tab browser | |
CN102567516B (zh) | 脚本加载方法及装置 | |
CN104980512B (zh) | 一种基于移动应用提供目标对象的方法与设备 | |
CN103942225A (zh) | 一种混合型应用客户端的资源调用方法、客户端及系统 | |
Adetunji et al. | Dawning of progressive web applications (pwa): Edging out the pitfalls of traditional mobile development | |
WO2017081558A1 (en) | Monitoring and actuation of view controller parameters to reach deep states without manual developer intervention | |
CN108647032B (zh) | 应用加载方法及装置、计算机装置和计算机可读存储介质 | |
CN104750487A (zh) | 一种移动终端app的开发方法及启动方法 | |
CN104965723B (zh) | 应用程序的运行方法及装置 | |
CN112328301B (zh) | 维护运行环境一致性的方法、装置、存储介质及电子设备 | |
CN109857963A (zh) | 本地资源访问方法、装置及电子设备 | |
CN103544271B (zh) | 一种浏览器中加载图片处理窗口的方法和装置 | |
CN106815037B (zh) | 应用功能的执行方法及装置 | |
CN106293790B (zh) | 基于Firefox操作系统的应用程序升级方法和装置 | |
US9830307B1 (en) | Ahead of time compilation of content pages | |
CN103258055B (zh) | 一种文件下载设备和方法 | |
CN111158777B (zh) | 组件调用方法、装置及计算机可读存储介质 | |
US9916391B2 (en) | Method, apparatus and terminal for webpage content browsing | |
CN111414154A (zh) | 前端开发的方法、装置、电子设备和存储介质 | |
CN103793459B (zh) | 一种网页打开方法及装置 | |
CN111338928A (zh) | 基于chrome浏览器测试的方法及装置 | |
CN106126198B (zh) | 在移动端加载pc端应用页面的方法及装置 | |
CN110324345B (zh) | 服务器的登陆方法、装置、存储介质及终端 | |
RU2595763C2 (ru) | Способ и устройство менеджмента загрузки на базе браузера android |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |