CN117130688B

CN117130688B - 快应用卡片加载方法、电子设备及存储介质

Info

Publication number: CN117130688B
Application number: CN202311150472.0A
Authority: CN
Inventors: 曹银飞; 李明孝
Original assignee: Nanjing Glory Software Technology Co ltd
Current assignee: Nanjing Glory Software Technology Co ltd
Priority date: 2023-09-06
Filing date: 2023-09-06
Publication date: 2024-05-24
Anticipated expiration: 2043-09-06
Also published as: CN117130688A

Abstract

本申请提供了一种快应用卡片加载方法、电子设备及存储介质，涉及终端技术领域。通过本申请方案，在加载并渲染快应用卡片的过程中，通过异步将任务分解，然后将任务分发到对应的线程上处理，无需在主线程中对任务进行分解，从而减少主线程耗时；并且，创建任务流程，将耗时较多的DOM解析步骤挪到子线程中进行异步处理，从而减少主线程耗时。本申请技术方案有助于使得电子设备能够快速向用户呈现卡片，防止出现卡顿的情况，从而提高用户体验。

Description

快应用卡片加载方法、电子设备及存储介质

技术领域

本申请涉及终端技术领域，尤其涉及一种快应用卡片加载方法、电子设备及存储介质。

背景技术

快应用是新型的手机应用形态，无需下载安装，能够即点即用。卡片是属于快应用中定义的一个页面，是以嵌入其他应用进行展示的一种信息载体。快应用卡片可以在各类使用场景的原生应用中嵌入展示，比如：负一屏、桌面、快服务中心、全局搜索等。

目前，当用户触发在电子设备的负一屏加载快应用卡片时，此时用户在负一屏上下滑动页面，电子设备会出现卡顿现象，用户体验不佳。因此，亟需一种能够提升快应用卡片加载速度的方法。

发明内容

本申请提供一种快应用卡片加载方法、电子设备及存储介质，能够提升快应用卡片加载速度，改善用户体验。

第一方面，本申请提供一种快应用卡片加载方法，该方法包括：接收用户将第一快应用卡片添加到电子设备的***应用的第一操作；响应于所述第一操作，通过用户界面UI线程创建所述第一快应用卡片；在渲染所述第一快应用卡片的过程中，通过第一工作线程将每个渲染任务分解成多个子任务，并将所述多个子任务分发到对应的工作线程进行处理，并将每个渲染任务的执行结果返回所述用户界面UI线程；在渲染所述第一快应用卡片的过程中，通过第二工作线程解析虚拟文档对象模型DOM，并将解析虚拟DOM的结果返回所述用户界面UI线程；通过所述用户界面UI线程，根据所述每个渲染任务的执行结果和所述虚拟DOM解析的结果，渲染得到所述第一快应用卡片的页面；在所述***应用的界面中显示所述第一快应用卡片的页面；其中，所述用户界面UI线程、所述第一工作线程和所述第二工作线程分别为异步处理的线程。

通过本申请实施例提供的快应用卡片加载方法，在渲染第一快应用卡片的过程中，通过异步将任务分解，然后将任务分发到对应的线程上处理，无需在主线程中对任务进行分解，从而减少主线程耗时；并且，创建任务流程，将耗时较多的DOM解析步骤挪到子线程中进行异步处理，从而减少主线程耗时。本申请技术方案有助于使得电子设备能够快速向用户呈现卡片，防止出现卡顿的情况，从而提高用户体验。

其中，通过JavaScript实现的快应用卡片，可以称为JS卡片。电子设备的JS(JavaScript)服务可以用于为快应用引擎提供卡片创建、卡片渲染等服务。

在一种可能实现方式中，所述***应用为以下任一项：负一屏应用、桌面应用、锁屏应用、全局搜索应用。

在一种可能实现方式中，所述方法还包括：在渲染所述第一快应用卡片的过程中，调用applyAction函数通过所述用户界面UI线程执行渲染动作，并调用applyChangeAction函数，指示由所述第二工作线程解析所述虚拟DOM。

本申请方案新增了VDOM异步处理类(VDomAsyncHandler)，通过VDOM异步处理类(VDomAsyncHandler)实现VDOM解析的异步处理。

通过上述方案，先异步将任务分解，然后再调用Handler()函数将任务分发到对应的线程上处理，无需在主线程中对任务进行分解，从而减少主线程耗时。也就是说，本申请方案通过将主线程工作类(MainThreadFrameWorker)在主线程中对任务分批次分解的过程去除。

在一种可能实现方式中，所述***应用包括卡片软件开发工具包SDK，所述电子设备包括快应用引擎。所述渲染所述第一快应用卡片，包括：所述***应用向所述卡片SDK发送第一消息，所述第一消息用于请求加载所述第一快应用卡片；响应于所述第一消息，所述卡片SDK向快应用引擎发送第二消息，所述第一消息用于请求渲染所述第一快应用卡片；响应于所述第二消息，所述快应用引擎基于所述第一快应用卡片的RPK文件渲染所述第一快应用卡片。

在一种可能实现方式中，所述第一快应用卡片的RPK文件包括JavaScript文件。所述快应用引擎基于所述第一快应用卡片的RPK包渲染所述第一快应用卡片，包括：所述快应用引擎绑定V8服务模块，并初始化所述V8服务模块的子线程；所述快应用引擎将所述JavaScript文件转换为Json文件；所述快应用引擎将所述Json文件发送给所述V8服务模块；所述V8服务模块通过子线程根据所述Json文件生成虚拟DOM树，并将所述虚拟DOM树发送给所述快应用引擎；所述快应用引擎根据所述虚拟DOM树进行虚拟DOM解析。其中，所述虚拟DOM解析的结果用于渲染所述第一快应用卡片。

通过本申请方案，创建任务(Task)流程，将耗时较多的DOM解析步骤挪到子线程中进行异步处理：在Action＝8或Action＝9时，可以将创建元素的过程细拆为generateComponent->bindAttrs->bindStyles->bindEvents->applyHook->createView，由于这些过程中解析并组装view树不涉及布局刷新，因此可以放到子线程中进行异步处理，减轻主线程的解析耗时，待子线程处理完成后再切回到主线程进行页面布局添加，即执行添加元素(addElement)动作。因此，本申请方案可以减少主线程耗时。

在一种可能实现方式中，所述通过用户界面UI线程创建所述第一快应用卡片，包括：所述***应用向所述卡片SDK发送第三消息，所述第三消息用于请求创建所述第一快应用卡片；响应于所述第三消息，所述卡片SDK启动JavaScript线程，触发所述快应用引擎初始化并获取所述第一快应用卡片的RPK文件；所述卡片SDK从所述快应用引擎获取所述第一快应用卡片的RPK文件；所述卡片SDK通过所述JavaScript线程，根据所述第一快应用卡片的RPK文件完成所述第一快应用卡片的资源加载；所述卡片SDK向所述***应用返回第四消息，所述第四消息用于指示所述第一快应用卡片创建完成。

在一种可能实现方式中，所述用户界面UI线程包括虚拟DOM解析类和视图父类，所述第二工作线程包括虚拟DOM异步处理类；所述虚拟DOM解析类为主线程，所述虚拟DOM异步处理类为子线程。

所述通过第二工作线程解析虚拟文档对象模型DOM，并将解析虚拟DOM的结果返回所述用户界面UI线程，包括：所述虚拟DOM解析类调用addElement函数，以添加所述虚拟DOM树的所有元素；所述虚拟DOM解析类指示由所述虚拟DOM异步处理类添加所述虚拟DOM树的所有元素；所述虚拟DOM异步处理类递归处理所述虚拟DOM树的所有叶子节点，并调用createElement函数创建所有叶子节点对应的元素；所述虚拟DOM异步处理类调用addChild函数，将所创建的元素发送给所述视图父类。

本申请方案新增了VDOM异步处理类(VDomAsyncHandler)，通过VDOM异步处理类(VDomAsyncHandler)实现VDOM解析的异步处理，从而减少主线程耗时。本申请技术方案有助于使得电子设备能够快速向用户呈现卡片，防止出现卡顿的情况，从而提高用户体验。

第二方面，本申请提供一种快应用卡片加载装置，该装置包括用于执行上述第一方面中的方法的单元。该装置可对应于执行上述第一方面中描述的方法，该装置中的单元的相关描述请参照上述第一方面的描述，为了简洁，在此不再赘述。

其中，上述第一方面描述的方法可以通过硬件实现，也可以通过硬件执行相应的软件实现。硬件或软件包括一个或多个与上述功能相对应的模块或单元。例如，处理模块或单元、显示模块或单元等。

第三方面，本申请提供一种电子设备，所述电子设备包括处理器、处理器以及存储器中存储的计算机程序或指令，处理器用于执行计算机程序或指令，使得第一方面中的方法被执行。

第四方面，本申请提供一种计算机可读存储介质，其上存储有用于实现第一方面中的方法的计算机程序(也可称为指令或代码)。例如，该计算机程序被计算机执行时，使得该计算机可以执行第一方面中的方法。

第五方面，本申请提供一种芯片，包括处理器。处理器用于读取并执行存储器中存储的计算机程序，以执行第一方面及其任意可能的实现方式中的方法。可选地，所述芯片还包括存储器，存储器与处理器通过电路或电线连接。

第六方面，本申请提供一种芯片***，包括处理器。处理器用于读取并执行存储器中存储的计算机程序，以执行第一方面及其任意可能的实现方式中的方法。可选地，所述芯片***还包括存储器，存储器与处理器通过电路或电线连接。

第七方面，本申请提供一种计算机程序产品，所述计算机程序产品包括计算机程序(也可称为指令或代码)，所述计算机程序被电子设备执行时使得电子设备实现第一方面中的方法。

可以理解的是，上述第二方面至第七方面的有益效果可以参见上述第一方面中的相关描述，在此不再赘述。

附图说明

图1为本申请实施例提供的电子设备显示快应用卡片的界面示意图；

图2为本申请实施例提供的一种电子设备的结构示意图；

图3为本申请实施例提供的一种电子设备的软件架构示意图；

图4A为本申请实施例提供的快应用卡片加载方法的界面示意图一；

图4B为本申请实施例提供的快应用卡片加载方法的界面示意图二；

图5为本申请实施例提供的快应用卡片加载方法中view树结构的示意图；

图6为本申请实施例提供的快应用卡片加载方法中DOM树结构的示意图；

图7为本申请实施例提供的快应用卡片加载方法中通过DOM元素实现卡片页面渲染的示意图；

图8为本申请实施例提供的快应用卡片加载方法的流程示意图一；

图9为本申请实施例提供的快应用卡片加载方法的流程示意图二；

图10为本申请实施例提供的快应用卡片加载方法的流程示意图三；

图11为本申请实施例提供的快应用卡片加载方法的流程示意图四；

图12为本申请实施例提供的快应用卡片加载方法的流程示意图五；

图13为本申请实施例提供的快应用卡片加载方法采用的异步处理示意图；

图14为本申请实施例提供的快应用卡片加载方法采用的交互架构示意图；

图15为本申请实施例提供的快应用卡片加载方法采用的软件架构示意图；

图16为本申请实施例提供的快应用卡片加载装置的示意性框图。

具体实施方式

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

本文中术语“和/或”，是一种描述关联对象的关联关系，表示可以存在三种关系，例如，A和/或B，可以表示：单独存在A，同时存在A和B，单独存在B这三种情况。本文中符号“/”表示关联对象是或者的关系，例如A/B表示A或者B。

本文中的说明书和权利要求书中的术语“第一”和“第二”等是用于区别不同的对象，而不是用于描述对象的特定顺序。在本申请实施例的描述中，除非另有说明，“多个”的含义是指两个或者两个以上，例如，多个处理单元是指两个或者两个以上的处理单元等；多个元件是指两个或者两个以上的元件等。

在本申请实施例中，“示例性的”或者“例如”等词用于表示作例子、例证或说明。本申请实施例中被描述为“示例性的”或者“例如”的任何实施例或设计方案不应被解释为比其它实施例或设计方案更优选或更具优势。确切而言，使用“示例性的”或者“例如”等词旨在以具体方式呈现相关概念。

快应用是一种新型的应用形态，以往的手机端应用主要有两种方式：网页、原生应用。网页无需安装，却体验不是很好；原生应用体验流畅，却需要从应用商店下载安装，难以一步直达用户。快应用的出现，能够让用户无需下载安装，并且还能流畅的体验应用内容，能够即点即用。

快应用卡片是属于快应用中定义的一个页面，是以嵌入其他应用进行展示的一种信息载体。快应用卡片可以在各类使用场景的原生应用中嵌入展示，比如：负一屏、桌面、快服务中心、全局搜索等。

示例性地，图1中的(a)示出了在快服务中心界面中显示快应用卡片“头条热榜”的示意图。

示例性地，图1中的(b)示出了在负一屏界面中显示快应用卡片“出行导航”的示意图。

示例性地，图1中的(c)示出了在桌面界面中显示快应用卡片“航班日程”的示意图。

基于此，本申请实施例提供一种快应用卡片加载方法及电子设备，通过在手机***底层进行改进，以提高用户体验。

在本申请实施例中，接收用户将第一快应用卡片添加到电子设备的***应用的第一操作；响应于所述第一操作，通过用户界面UI线程创建所述第一快应用卡片；在渲染所述第一快应用卡片的过程中，通过第一工作线程将每个渲染任务分解成多个子任务，并将所述多个子任务分发到对应的工作线程进行处理，并将每个渲染任务的执行结果返回所述用户界面UI线程；在渲染所述第一快应用卡片的过程中，通过第二工作线程解析虚拟文档对象模型DOM，并将解析虚拟DOM的结果返回所述用户界面UI线程；通过所述用户界面UI线程，根据所述每个渲染任务的执行结果和所述虚拟DOM解析的结果，渲染得到所述第一快应用卡片的页面；在所述***应用的界面中显示所述第一快应用卡片的页面；其中，所述用户界面UI线程、所述第一工作线程和所述第二工作线程分别为异步处理的线程。

通过本申请实施例提供的快应用卡片加载方法，在加载并渲染快应用卡片的过程中，通过异步将任务分解，然后将任务分发到对应的线程上处理，无需在主线程中对任务进行分解，从而减少主线程耗时；并且，创建任务流程，将耗时较多的DOM解析步骤挪到子线程中进行异步处理，从而减少主线程耗时。本申请技术方案有助于使得电子设备能够快速向用户呈现卡片，防止出现卡顿的情况，从而提高用户体验。

以下，先结合附图对本申请实施例提供的快应用卡片加载方法应用的电子设备进行说明。

示例性的，本申请实施例中的电子设备可以是手机、平板电脑、超级移动个人计算机(ultra-mobile personal computer，UMPC)、上网本，以及蜂窝电话、个人数字助理(personal digital assistant，PDA)、可穿戴式设备(如：智能手表、智能手环)，等具备语音通信功能的设备，本申请实施例对该电子设备的具体形态不作特殊限制。

示例地，以电子设备为手机为例，图2示出了本申请实施例提供的一种电子设备的结构示意图。

如图2所示，手机可以包括：处理器110，外部存储器接口120，内部存储器121，通用串行总线(universal serial bus，USB)接口130，充电管理模块140，电源管理模块141，电池142，天线1，天线2，移动通信模块150，无线通信模块160，音频模块170，扬声器170A，受话器(即听筒)170B，麦克风170C，耳机接口170D，传感器模块180，按键190，马达191，指示器192，摄像头193，显示屏194，以及用户标识模块(subscriber identification module，SIM)卡接口195等。

示例性地，上述传感器模块可以包括压力传感器、陀螺仪传感器、气压传感器、磁传感器、加速度传感器、距离传感器、接近光传感器、指纹传感器、温度传感器、触摸传感器、环境光传感器以及骨传导传感器等传感器。在本申请实施例中，电子设备可以通过接近光传感器(即光线传感器)、距离传感器等传感器来检测用户耳朵是否贴靠在听筒附近。例如，电子设备可以通过距离传感器检测手机前面板(或者屏幕)前方是否有遮挡，以及遮挡物与屏幕之间的距离，确定当前用户耳朵是否贴靠在听筒附近。

可以理解的是，本实施例示意的结构并不构成对手机的具体限定。在另一些实施例中，手机可以包括比图示更多或更少的部件，或者组合某些部件，或者拆分某些部件，或者不同的部件布置。图示的部件可以以硬件，软件或软件和硬件的组合实现。

处理器110可以包括一个或多个处理单元，例如：处理器110可以包括应用处理器(application processor，AP)，调制解调处理器，图形处理器(graphics processingunit，GPU)，图像信号处理器(image signal processor，ISP)，控制器，存储器，视频编解码器，数字信号处理器(digital signal processor，DSP)，基带处理器，和/或神经网络处理器(neural-network processing unit，NPU)等。其中，不同的处理单元可以是独立的器件，也可以集成在一个或多个处理器中。

其中，处理器110用于：接收用户将第一快应用卡片添加到电子设备的***应用的第一操作；响应于所述第一操作，通过用户界面UI线程创建所述第一快应用卡片；在渲染所述第一快应用卡片的过程中，通过第一工作线程将每个渲染任务分解成多个子任务，并将所述多个子任务分发到对应的工作线程进行处理，并将每个渲染任务的执行结果返回所述用户界面UI线程；在渲染所述第一快应用卡片的过程中，通过第二工作线程解析虚拟文档对象模型DOM，并将解析虚拟DOM的结果返回所述用户界面UI线程；通过所述用户界面UI线程，根据所述每个渲染任务的执行结果和所述虚拟DOM解析的结果，渲染得到所述第一快应用卡片的页面；在所述***应用的界面中显示所述第一快应用卡片的页面；其中，所述用户界面UI线程、所述第一工作线程和所述第二工作线程分别为异步处理的线程。

通过本申请实施例提供的快应用卡片加载方法，在加载并渲染快应用卡片的过程中，通过异步将任务分解，然后调用Handler()函数将任务分发到对应的线程上处理，无需在主线程中对任务进行分解，从而减少主线程耗时；并且，创建任务流程，将耗时较多的DOM解析步骤挪到子线程中进行异步处理，从而减少主线程耗时。本申请技术方案有助于使得电子设备能够快速向用户呈现卡片，防止出现卡顿的情况，从而提高用户体验。

控制器可以是手机的神经中枢和指挥中心。控制器可以根据指令操作码和时序信号，产生操作控制信号，完成取指令和执行指令的控制。

处理器110中还可以设置存储器，用于存储指令和数据。在一些实施例中，处理器110中的存储器为高速缓冲存储器。该存储器可以保存处理器110刚用过或循环使用的指令或数据。如果处理器110需要再次使用该指令或数据，可从所述存储器中直接调用。避免了重复存取，减少了处理器110的等待时间，因而提高了***的效率。

在一些实施例中，处理器110可以包括一个或多个接口。接口可以包括集成电路(inter-integrated circuit，I2C)接口，集成电路内置音频(inter-integrated circuitsound，I2S)接口，脉冲编码调制(pulse code modulation，PCM)接口，通用异步收发传输器(universal asynchronous receiver/transmitter，UART)接口，移动产业处理器接口(mobile industry processor interface，MIPI)，通用输入输出(general-purposeinput/output，GPIO)接口，用户标识模块(subscriber identity module，SIM)接口，和/或通用串行总线(universal serial bus，USB)接口等。

可以理解的是，本实施例示意的各模块间的接口连接关系，只是示意性说明，并不构成对手机的结构限定。在另一些实施例中，手机也可以采用上述实施例中不同的接口连接方式，或多种接口连接方式的组合。

手机的无线通信功能可以通过天线1，天线2，移动通信模块150，无线通信模块160，调制解调处理器以及基带处理器等实现。

手机可以通过GPU，显示屏194，以及应用处理器等实现显示功能。GPU为图像处理的微处理器，连接显示屏194和应用处理器。GPU用于执行数学和几何计算，用于图形渲染。处理器110可包括一个或多个GPU，其执行程序指令以生成或改变显示信息。显示屏194用于显示图像，视频等。

在本申请实施例中，显示屏194用于显示快应用卡片。

在本申请实施例中，快应用卡片的入口可以设置在显示屏的不同界面，具体可以由***预设，也可以由用户自定义设置。例如可以在显示屏的桌面上显示快应用卡片，也可以在显示屏的负一屏显示快应用卡片，还可以在显示屏的快服务中心显示快应用卡片，或者可以在锁屏界面中显示快应用卡片。对于具有小屏的折叠屏电子设备而言，可以在小屏上显示快应用卡片。

外部存储器接口120可以用于连接外部存储卡，例如Micro SD卡，实现扩展手机的存储能力。内部存储器121可以用于存储计算机可执行程序代码，所述可执行程序代码包括指令。处理器110通过运行存储在内部存储器121的指令，从而执行手机的各种功能应用以及数据处理。例如，在本申请实施例中，处理器110可以通过执行存储在内部存储器121中的指令，内部存储器121可以包括存储程序区和存储数据区。

手机可以通过音频模块170，扬声器170A，受话器(即听筒)170B，麦克风170C，耳机接口170D，以及应用处理器等实现音频功能。例如音乐播放，录音等。

以上是以电子设备为例对本申请实施例做出的具体说明。应该理解的是，本申请实施例示意的结构并不构成对电子设备的具体限定。电子设备可以具有比图中所示的更多的或者更少的部件，可以组合两个或多个的部件，或者可以具有不同的部件配置。图中所示出的各种部件可以在包括一个或多个信号处理和/或专用集成电路在内的硬件、软件、或硬件和软件的组合中实现。

本申请实施例提供的电子设备可以是用户设备(user equipment，UE)，例如可以为移动终端(例如用户手机)、平板电脑、桌面型、膝上型笔记本电脑、手持计算机、上网本、个人数字助理(personal digital assistant，PDA)等设备。

另外，在上述硬件之上，运行有操作***，操作***层的操作***可以是任意一种或多种通过进程(process)实现业务处理的计算机操作***，例如，Linux操作***、Unix操作***、Android操作***、iOS操作***或windows操作***等。在操作***上可以安装运行应用程序。

电子设备的操作***可以采用分层架构，事件驱动架构，微核架构，微服务架构，或云架构。本申请实施例以分层架构的Android***为例，示例性说明电子设备的软件结构。

图3是本申请实施例的电子设备的软件结构框图。

分层架构将软件分成若干个层，每一层都有清晰的角色和分工。层与层之间通过软件接口通信。在一些实施例中，将Android***分为四层，从上至下分别为应用程序层(applications)，应用程序框架层(application framework)，安卓运行时(AndroidRuntime)和***库，以及内核层(kernel)。

其中，应用程序层可以包括一系列应用程序包。例如，应用程序层可以包括***桌面APP，负一屏APP，快服务中心APP等应用程序(应用程序可以简称为应用)，本申请实施例对此不做任何限制。

示例性地，负一屏APP可以作为快应用卡片的宿主。

示例性地，***桌面APP也可以作为快应用卡片的宿主。

示例性地，快服务中心APP也可以作为快应用卡片的宿主。

例如，负一屏APP作为快应用卡片的宿主，负一屏APP包含卡片软件开发工具包(software development kit，SDK)，该卡片SDK用于在负一屏加载、渲染并显示。

例如，对于操作***的电子设备而言，可以基于JavaScript编程语言生成卡片，并在屏幕上显示卡片，比如可以通过卡片呈现航班信息、火车信息、会议信息或日程信息。

其中，JavaScript简称“JS”，是一种具有函数优先的轻量级、解释型或即时编译型的编程语言。JavaScript基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式、声明式、函数式编程范式。JavaScript可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备，常用来为网页添加各式各样的动态功能，为用户提供更流畅美观的浏览效果。

本申请实施例中，应用程序层还可以包括快应用引擎APP。快应用引擎APP包括快应用RPK文件，该文件的后缀名为.rpk。

其中，快应用引擎APP为电子设备中预安装的应用程序，用于实现快应用卡片的下载、安装以及更新。快应用引擎APP还用于创建卡片、加载卡片以及加载页面，创建卡片的过程包括创建JS线程、绑定JS服务，以及绑定V8。快应用引擎APP还用于执行卡片渲染动作。快应用引擎APP还用于对卡片进行网络请求。

本申请实施例中，应用程序层还可以包括情景感知模块、业务逻辑处理模块和业务呈现模块等。情景感知模块、业务逻辑处理模块和业务呈现模块可以是独立的APP，或者可以分别集成在不同的APP中，或者可以集成在同一个APP中，本申请不做限定。

其中，情境感知模块，常驻运行或以低功耗形式运行，具有感知外部事实或者环境的能力。情境感知模块可以通过应用程序接口(application programming interface，API)从应用程序层的其他应用程序或应用程序框架层或***层或内核层来检测相关事件和获取事件的状态，比如检测蓝牙连接、网络连接、监测用户短信、定制定时器等。在本申请实施例中，情境感知模块主要作用是监听是否添加快应用卡片。情境感知模块还可以用于获取快应用卡片的参数信息。情境感知模块可以将监听到的快应用卡片以及参数信息，通知给业务逻辑处理模块。

业务逻辑处理模块(如：计算引擎)具有业务逻辑处理能力，用于根据情境感知模块监听到的快应用卡片以及参数信息，以及预设的逻辑算法进行数据处理或逻辑判断，确定在桌面或负一屏界面中按照参数信息显示快应用卡片。

业务呈现模块(如：YOYO建议)，用于根据业务逻辑处理模块的指示，在电子设备的屏幕上显示快应用卡片。通过快应用卡片实现的推荐服务，信息展示更直观，服务推荐更全面，关联性更显著。

应用程序框架层为应用程序层的应用程序提供应用编程接口(applicationprogramming interface，API)和编程框架。应用程序框架层包括一些预先定义的函数。如图3所示，应用程序框架层可以包括窗口管理器，JS(JavaScript)服务，视图***，资源管理器等，本申请实施例对此不做任何限制。

JS服务用于为快应用引擎提供卡片创建、卡片渲染等服务。通过JavaScript实现的快应用卡片，可以称为JS卡片。

窗口管理器用于管理窗口程序，例如用于管理YOYO建议提供的窗口程序。

资源管理器为应用程序提供各种资源，比如本地化字符串，图标，图片等。

视图***包括可视控件，例如显示文字的控件，显示图片的控件等。视图***可用于构建应用程序。显示界面可以由一个或多个视图组成的。

例如，在本申请实施例中，视图***可用于在桌面中显示快应用卡片。

Android Runtime包括核心库和虚拟机。Android Runtime负责安卓***的调度和管理。

核心库包含两部分：一部分是java语言需要调用的功能函数，另一部分是安卓的核心库。

应用程序层和应用程序框架层运行在虚拟机中。虚拟机将应用程序层和应用程序框架层的java文件执行为二进制文件。虚拟机用于执行对象生命周期的管理，堆栈管理，线程管理，安全和异常的管理，以及垃圾回收等功能。

***库可以包括多个功能模块。例如：表面管理器(surface manager)，媒体库(media libraries)，三维图形处理库(例如：openGL ES)，二维图形引擎(例如：SGL)等。表面管理器用于对显示子***进行管理，并且为多个应用程序提供了二维图层和三维图层的融合。

内核层是硬件和软件之间的层。内核层至少包含显示驱动，摄像头驱动，音频驱动，传感器驱动。

为了便于说明，在图中还体现了与上述软件结构交互的硬件层。例如，硬件层可以包括显示屏。

需要说明的是，本申请实施例虽然以***为例进行说明，但是其基本原理同样适用于基于/>或/>等操作***的电子设备。

本申请实施例提供的快应用卡片加载方法的执行主体可以为上述的电子设备，也可以为该电子设备中能够实现该快应用卡片加载方法的功能模块和/或功能实体，并且本申请方案能够通过硬件和/或软件的方式实现，具体的可以根据实际使用需求确定，本申请实施例不作限定。下面以电子设备为例，结合附图对本申请实施例提供的快应用卡片加载方法进行示例性的说明。

下面将结合附图，通过下述多个示例性实施例对本申请实施例进行举例说明。以下实施例中的方法均可以在具有上述硬件结构和软件架构的电子设备中实现。电子设备的硬件结构图可以如图2所示，电子设备的软件结构框图可以如图3所示，但本申请实施例并不限于此。为了便于说明，本申请实施例中均以电子设备为如图2所示的手机为例。

下面结合具体的实施例介绍本申请实施例提供的快应用卡片加载方法。

首先结合附图说明本申请方案的应用场景。

图4A和图4B示出了通过快服务中心入口找到快应用卡片并将快应用卡片添加到桌面的界面示意图。如图4A中的(a)所示，电子设备显示负一屏的界面，负一屏的界面中显示有快服务中心的入口控件41。电子设备接收到用户在入口控件41上的操作。如图4A中的(b)所示，电子设备响应于用户操作，从负一屏的界面跳转到快服务中心界面。在快服务中心界面中显示有***推荐的快应用卡片以及“添加”控件42，***推荐的快应用卡片例如为快应用卡片。电子设备接收到用户在控件42上的操作。如图4A中的(c)所示，电子设备响应于用户操作，从快服务中心界面跳转到添加设置界面，在添加设置界面中显示有快应用卡片、“添加到桌面”控件43以及“添加到负一屏”控件44。

示例性地，如图4A中的(c)所示，电子设备接收到用户在控件43上的操作。如图4A中的(d)所示，电子设备响应于用户操作，从添加设置界面跳转到桌面，在桌面新增显示有快应用卡片。需要说明的是，这里快应用卡片以桌面为宿主进行显示。

示例性地，如图4B中的(a)至(d)所示，电子设备接收到用户在控件44上的操作，电子设备响应于用户操作，从添加设置界面跳转到负一屏，在负一屏新增显示有快应用卡片。需要说明的是，这里快应用卡片以负一屏为宿主进行显示。

在实际操作中，当用户触发在电子设备的负一屏加载快应用卡片，且用户在负一屏上下滑动页面时，电子设备会出现卡顿现象。本申请实施例主要针对这一问题进行技术改进。

由于快应用卡片加载过程中涉及主线程MainThread，因此下面先介绍一下主线程MainThread和工作线程WorkerThread。

安卓***中包含两种类型的线程：主线程MainThread和工作线程WorkerThread。其中，主线程MainThread又称为UI(user interface，用户界面)线程。安卓应用程序中所有UI相关的代码都是运行在主线程的，除了主线程MainThread之外的其他所有线程都称为工作线程WorkerThread，工作线程还被称为子线程。

在主线程MainThread中可以启动工作线程WorkerThread，由工作线程WorkerThread执行一些动作。

主线程MainThread和工作线程WorkerThread的关系表现为以下几点：

a.安卓应用程序中所有UI相关的代码都是运行在主线程MainThread中。

b.从原则上来讲，不允许工作线程WorkerThread操作主线程MainThread中的UI对象。

c.有部分特殊的UI组件可以在工作线程WorkerThread中进行操作。

需要说明的是，在电子设备的负一屏或桌面等宿主界面加载快应用卡片的过程，大部分都是在主线程MainThread中实现的。

以上说明了主线程MainThread和工作线程WorkerThread，下面结合本申请在技术方案上的改进进行说明。

为了避免当用户触发在电子设备的负一屏加载快应用卡片，且用户在负一屏上下滑动页面时电子设备出现卡顿现象，本申请实施例的改进策略为：

a.分析主线程中哪些动作耗时较长。

b.针对主线程中耗时较长的动作，如何进行处理，以避免耗时较长。

首先，在本申请实施例中，通过测试发现，快应用卡片在DOM解析并组装view树时，均发生在主线程，这一过程耗费时间较长，导致负一屏在加载快应用卡片的同时上下滑动页面会出现卡顿。

其次，在本申请实施例中，做了下述两方面改进：

改进点一：从主线程中移除“组装view树”的过程。

改进点二：由主线程完成“DOM解析”，切换成由子线程完成“DOM解析”。

关于这两方面的改进，具体实现方式将在下文进行详细描述。

下面对View树结构及组装View树进行解释说明。

View是安卓***中所有控件的基类，例如按钮(button)、视图父类(ViewGroup)等常见控件的基类都是View。View本身可以是单个控件，也可以是由多个控件组成的一组控件，通过这种关系就形成了View树的结构。

图5示出了View树结构的示意图。View树结构包括活动Activity、窗口Window、布局视图DecorView、根视图RootView。在根视图RootView中包括视图父类ViewGroup和视图View1。视图父类ViewGroup包括子视图View2和子视图View3。

当活动Anctivity接收到用户触摸焦点的操作时，会触发请求绘制布局。处理方法是从根节点开始测量和绘制。View树组装流程是通过测量measure、布局layout和绘制draw三个方法来实现的。

其中，测量measure的作用在于确定是否重新计算视图大小。布局layout的作用在于确定是否需要重新安置视图的位置。绘制draw的作用在于确定是否需要重绘。

View树的组装流程是一个递归过程。在测量measure方法里，会对所有的子元素进行测量，测量过程就从视图父类ViewGroup传递到子视图view，经过子元素的递归，测量完所有子元素的长度，然后进行递归，反复之后，就完成了整个视图父类ViewGroup的测量。对于布局layout和绘制draw，与测量measure方法类似。由此，按照measure->layout->draw的顺序完成view树的组装流程。

下面再对VDOM树结构及解析VDOM进行解释说明。

DOM：JavaScript操作网页的接口，全称为“文档对象模型”(document objectmodel)。

DOM树：DOM树是一种层级结构，所谓层级结构是指元素和元素之间的关系，例如父子关系，兄弟关系等。

例如，如图6所示，DOM树包括元素、文本、属性，分别作为DOM树的树枝和树叶。

如图7所示，利用JavaScript对象操作DOM元素，可以更改卡片页面的交互方式。所有网页的交互都依赖这种DOM技术。DOM树中的树枝和树叶都有对应的标签，通过脚本的函数去寻找某一枝干的某一叶子，对这个叶子做某一改变。

VDOM指虚拟Dom，采用JavaScript对象描述真实DOM，通过JavaScript对象与真实DOM建立了一一对应的关系。卡片VDOM解析，指卡片解析VDOM树。通过解析VDOM树，可得到DOM元素和属性节点，供JavaScript对象动态修改卡片状态。

图8是本申请实施例提供的快应用卡片加载方法的整体流程示意图。参照图8所示，该方法包括下述的步骤S201-S228。

其中，快应用卡片以负一屏APP为宿主为例进行示例性说明。负一屏APP、快应用引擎APP和配置服务器之间进行交互，实现快应用卡片的创建。其中，负一屏APP包括负一屏模块和卡片SDK模块。快应用引擎APP包括快应用引擎模块和V8服务模块。

S201，负一屏模块接收用户创建快应用卡片的操作。

示例性地，再次参考图4B中的(c)，用户创建快应用卡片的操作可以为用户点击“添加到负一屏”控件44的操作。

以下说明快应用卡片初始化的过程。

S202，负一屏模块向卡片SDK模块发送用于指示初始化的消息。

S203，在卡片SDK模块接收到用于指示初始化的消息之后，卡片SDK模块创建卡片客户类CardClientImpl对象，并生成类加载器classloader，并创建卡片服务类CardServiceClass()对象。

在Java中，程序在虚拟机中运行，通常编写的程序都是.java格式的文件。java虚拟机并不能直接识别.java源文件，需要javac命令转换成后缀为.class的类文件。

类加载器classloader用于将后缀为.class的类文件加载到java虚拟机以运行程序；其中，后缀为.class的类文件是字节码格式文件。需要说明的是，当java虚拟机启动时，并不会一次性加载所有的类文件，而是根据需要去动态加载。

S204，卡片SDK模块向快应用引擎模块发送用于指示初始化的消息。

S205，在快应用引擎模块接收到用于指示初始化的消息之后，快应用引擎模块创建卡片服务类CardServiceImpl对象，创建卡片服务工作类CardServiceWorker对象，并且对运行时间runtime进行初始化。

S206，快应用引擎模块向负一屏模块返回卡片客户类CardClientImpl对象。

由此完成快应用卡片的初始化。

以上说明了快应用卡片初始化的过程，以下说明获取快应用卡片的过程。

S207，在负一屏模块接收到卡片客户类CardClientImpl对象之后，负一屏模块向卡片SDK模块发送用于请求获取卡片的消息。

S208，在卡片SDK模块接收到用于请求获取卡片的消息之后，卡片SDK模块向快应用引擎模块发送用于请求创建卡片的消息。

S209，在快应用引擎模块接收到用于请求创建卡片的消息之后，快应用引擎模块创建卡片类CardImpl对象。

S210，快应用引擎模块向卡片SDK模块返回卡片类CardImpl对象。

S211，在卡片SDK模块接收到卡片类CardImpl对象之后，卡片SDK模块创建卡片CardImplClass()。

S212，卡片SDK模块向负一屏模块返回卡片CardImplClass()。

相应地，负一屏模块接收到卡片CardImplClass()。

以上说明了获取快应用卡片的过程，以下说明加载快应用卡片，创建卡片页面的过程。

S213，在负一屏模块接收到卡片CardImplClass之后，负一屏模块向卡片SDK模块发送用于请求加载URL(uniform resource locator，统一资源***)的消息。

示例性地，URL可以表示为：hap://widget/com.xxx.hotsearch.card/SmallCard。

S214，卡片SDK模块将用于请求加载URL的消息转发给快应用引擎模块。

S215，在快应用引擎模块接收到用于请求加载URL的消息之后，快应用引擎模块创建卡片视图cardview。

S216，快应用引擎模块向配置服务器发送用于请求下载RPK文件的消息。

S217，在配置服务器接收到用于请求下载RPK文件的消息之后，配置服务器向快应用引擎模块发送RPK文件。

S218，在快应用引擎模块接收到RPK文件之后，快应用引擎模块根据RPK文件初始创建JS对象(例如JsThread4Card对象)。

S219，快应用引擎模块与V8服务模块绑定。

S220，快应用引擎模块指示V8服务模块对V8服务子线程进行初始化。

S221，快应用引擎模块创建JS对象(例如JsThread4Card对象)，注册JavaMethod方法，解析JS文件，并将解析的JS文件转换为Json文件。

其中，Json文件是以JavaScript对象表示法(Json)格式存储的简单数据结构和对象的文件，该格式是标准的数据交换格式。其主要用于在Web应用程序和服务器之间传输数据。

S222，快应用引擎模块将Json文件发送给V8服务模块。

S223，在V8服务模块接收到Json文件之后，V8服务模块基于Json文件进行卡片渲染，然后向负一屏模块发送卡片渲染成功的消息。

S224，在负一屏模块接收到卡片渲染成功的消息之后，负一屏模块加载卡片视图(卡片骨架图)。

S225，在V8服务模块接收到Json文件之后，V8服务模块将Json文件解析成VDOM树，并回调快应用引擎模块，由快应用引擎模块执行VDOM解析。

S226，V8服务模块向快应用引擎模块发送用于指示执行VDOM解析的消息。

S227，在快应用引擎模块接收到用于指示执行VDOM解析的消息之后，快应用引擎模块执行VDOM解析。

其中，卡片VDOM解析，指卡片解析VDOM树。

S228，快应用引擎模块向负一屏模块发送卡片页面创建完成的消息。

需要说明是，本申请实施例提供的快应用卡片加载方法，针对图8中的虚线框中的卡片加载、渲染以及解析等过程进行了改进。

在本申请实施例中，卡片加载、渲染以及解析的过程包括执行多个动作(action＝0，action＝1…action＝11)。需要说明的是，这里action采用数字标记为示例性地说明，在实际实现时，还可以采用其他字符标记，本申请不作限定。并且，数字标记的具体取值可以根据实际使用需求设置，本申请实施例不作限定。

action＝0，表示开始运行第一快应用卡片的RPK文件。

action＝8，表示VDOM开始解析。action＝9，表示VDOM解析完成。其中，卡片VDOM解析包括VDOM开始解析以及VDOM解析完成。以下将这两个动作称为“解析动作”。

“解析动作”中包括在主线程中实现“VDOM解析”。

需要说明的是，在上述解析动作逻辑中，本申请方案可以将由主线程完成“VDOM解析”，切换成由子线程完成“VDOM解析”，减少耗时。

action＝11，表示首屏渲染。以下将该动作称为“渲染动作”。其中，在“渲染动作”中包括在主线程中实现“组装view树”。

需要说明的是，在上述渲染动作逻辑中，本申请方案可以从主线程中移除“组装view树”的过程，减少耗时。

以上结合图8说明了快应用卡片加载方法的整体流程。下面通过实施例一和实施例二分别说明快应用卡片加载方法中渲染动作(RenderAction)以及解析动作(applyChangeAction)的具体实现过程，然后通过对实施例一和实施例二进行比对，说明本申请实施例的改进点。

首先需要说明的是，VDOM会递归地进行渲染，根据类型的不同，元素、文本会分别用createTextNode、createElement来递归创建DOM并组装到一起，其中元素还要设置属性，风格、事件***和其他属性分别用addEventListener、setAttribute等接口进行设置。通过不同的接口创建DOM和设置属性，这就是VDOM的渲染和解析流程。

实施例一：

图9示出了本申请实施例一提供的快应用卡片加载方法的时序示意图。图8中的S226和S227包括图9中的S301-S313。

在图9中，功能模块包括JS通知引擎连接类(JsBridgeCard)、渲染管理类(RenderActionManager)、渲染管理和工作类(RenderActionManager&RenderWorker)、根视图(rootview)、卡片视图(cardview)、主线程工作类(MainThreadFrameWorker)、VDOM解析类(VdomActionApplier)。其中，主线程工作类还可以称为按照16ms拆解任务类。

S301，V8服务模块调用JS通知引擎连接类(JsBridgeCard)，通知快应用引擎进行VDOM解析。

S302，快应用引擎通知渲染管理类(RenderActionManager)通过调用本地库对应的callNative()函数进行VDOM解析。

S303，渲染管理类(RenderActionManager)调用与开始运行对应的run()函数，通知渲染管理和工作类(RenderActionManager&RenderWorker)开启线程池。

S304，渲染管理和工作类(RenderActionManager&RenderWorker)调用与渲染动作对应的RenderAction()函数，启动渲染动作。

S305，渲染管理和工作类(RenderActionManager&RenderWorker)调用与发送渲染动作对应的onSendRenderAction()函数，通知根视图(rootview)执行渲染动作。

S306，根视图(rootview)切回到UI线程。

S307，根视图(rootview)调用applyAction()函数，通知卡片视图(cardview)执行渲染动作。

S308，卡片视图(cardview)调用mApplyActionWorker.start()函数，通知主线程工作类(MainThreadFrameWorker)启动任务分解。

S309，主线程工作类(MainThreadFrameWorker)将applyAction任务按照16毫秒(ms)分解成小的批次，防止阻塞主应用的UI线程任务。

S310，主线程工作类(MainThreadFrameWorker)调用doMiniTask()函数，执行被分解成小的批次的渲染任务。

S311，主线程工作类(MainThreadFrameWorker)通知卡片视图(cardview)执行渲染动作。

S312，卡片视图(cardview)执行渲染动作，然后向根视图(rootview)发送已完成applyAction任务的消息。

需要说明的是，上述S307-S312为在主线程中实现“组装view树”的过程。

S313，根视图(rootview)调用applyChangeAction()函数，指示VDOM解析类(VdomActionApplier)开始根据Action进行VDOM解析。

根据上述实施例一中图9所示步骤可知，在主线程进行卡片渲染过程中，可以将applyAction的任务分解成小的批次，防止阻塞主应用的UI线程任务。在任务分解后，在主线程进行卡片DOM解析并组装view树。

其中，卡片DOM解析并组装view树过程参见下述图10。

在图9的基础上，图10示出了本申请实施例一提供的快应用卡片加载方法的另一时序示意图。在图10中，功能模块包括VDOM解析类(VDomActionApplier)、组件(Component)以及视图父类(ViewGroup)。

S314，VDOM解析类(VDomActionApplier)调用addElement()函数，添加元素。

需要说明的是，这里添加元素的动作会递归所有叶子节点。

S315，VDOM解析类(VDomActionApplier)调用createElement()函数，创建元素。

S316，VDOM解析类(VDomActionApplier)调用generateComponent()函数，创建组件(Component)。

S317，VDOM解析类(VDomActionApplier)调用bindAttrs()函数，与组件(Component)绑定控件属性。

S318，VDOM解析类(VDomActionApplier)调用bindstyles()函数，与组件(Component)绑定控件风格。

S319，VDOM解析类(VDomActionApplier)调用applyEvents()函数，与组件(Component)绑定事件。

S320，VDOM解析类(VDomActionApplier)调用applyHook()函数，与组件(Component)绑定钩子功能。

其中，hook(可称为“钩子”)功能是一种“中断”机制。在对特定的***事件进行hook后，一旦发生hook事件，对该事件进行hook的程序就会收到***的通知，这时程序就能在第一时间对该事件做出响应。

S321，VDOM解析类(VDomActionApplier)调用createView()函数，与组件(Component)创建视图。

S322，VDOM解析类(VDomActionApplier)调用createElement()函数，创建元素。

S323，VDOM解析类(VDomActionApplier)调用addChild()函数，将创建的元素添加到视图父类上。

在上述实施例一中图10所示步骤中，步骤S314-S321耗时较多。

根据上述实施例一可知，首先需要在主线程中对任务进行分解。在将任务分解后，在主线程进行卡片DOM解析并组装view树。实施例一虽然可以将applyAction的任务分解成小的批次，防止阻塞主应用的UI线程任务，但是由于任务在主线程，耗时较多，仍然会造成宿主负一屏的卡顿。

实施例二：

图11示出了本申请实施例二提供的快应用卡片加载方法的时序示意图。

在图11中，功能模块包括JS通知引擎连接类(JsBridgeCard)、渲染管理类(RenderActionManager)、渲染管理和工作类(RenderActionManager&RenderWorker)、根视图(rootview)、VDOM解析类(VdomActionApplier)。

需要说明的是，本申请实施例二中不包括主线程工作类(MainThreadFrameWorker)和卡片视图(cardview)，其中不再使用按照16ms拆解任务类。

S401-S406的实现过程与上述实施例一中S301-S306的实现过程相同，此处不再赘述。

S407，根视图(rootview)调用applyAction()函数，执行渲染动作。

S408，根视图(rootview)调用applyChangeAction()函数，指示VDOM解析类(VDomActionApplier)开始根据Action进行VDOM解析。

在实施例二中，在主线程进行卡片渲染过程中，去除了对任务分批次分解的过程。

在图11的基础上，图12示出了本申请实施例二提供的快应用卡片加载方法的另一时序示意图。在图12中，功能模块包括VDOM解析类(VDomActionApplier)、VDOM异步处理类(VDomAsyncHandler)、组件(Component)以及视图父类(ViewGroup)。

需要说明的是，本申请实施例二中新增了VDOM异步处理类(VDomAsyncHandler)，用于在子线程中进行异步处理。

通过下述S409-S417，从主线程切换到子线程，进行异步处理。

S409，VDOM解析类(VDomActionApplier)调用addElement()函数，递归所有叶子节点。

S410，VDOM异步处理类(VDomAsyncHandler)调用createElement()函数，创建元素。

S411，VDOM异步处理类(VDomAsyncHandler)调用generateComponent()函数，创建组件(Component)。

S412，VDOM异步处理类(VDomAsyncHandler)调用bindAttrs()函数，与组件(Component)绑定控件属性。

S413，VDOM异步处理类(VDomAsyncHandler)调用bindstyles()函数，与组件(Component)绑定控件风格。

S414，VDOM异步处理类(VDomAsyncHandler)调用applyEvents()函数，与组件(Component)绑定事件。

S415，VDOM异步处理类(VDomAsyncHandler)调用applyHook()函数，与组件(Component)绑定钩子功能。

S416，VDOM异步处理类(VDomAsyncHandler)调用createView()函数，与组件(Component)创建视图。

S417，VDOM异步处理类(VDomAsyncHandler)调用createElement()函数，创建元素。

通过下述S418，从子线程切回到主线程。

S418，VDOM异步处理类(VDomAsyncHandler)调用addChild()函数，将创建的元素添加到视图父类上。

在实施例二中，将耗时较多的步骤S409-S417挪到子线程中进行异步处理。

需要说明的是，在卡片渲染时，可以将创建元素的过程细拆为generateComponent->bindAttrs->bindStyles->bindEvents->applyHook->createView，由于这些过程中解析并组装view不涉及布局刷新，因此可以放到子线程中进行异步处理，减轻主线程的解析耗时，待子线程处理完成后再切回到主线程进行页面布局添加，即执行添加元素(addElement)动作。由此可以较少主线程耗时。

下面将实施例二与实施例一进行比对，说明本申请实施例的改进点。

实施例二与实施例一的不同之处在于：

(1)实施例二不使用主线程工作类(MainThreadFrameWorker)和卡片视图(cardview)，将主线程工作类(MainThreadFrameWorker)在主线程中对任务分批次分解的过程去除。

(2)实施例二新增了VDOM异步处理类(VDomAsyncHandler)，通过VDOM异步处理类(VDomAsyncHandler)实现VDOM解析的异步处理。

相比而言，本申请实施例二相对于实施例一的改进点包括：

1)如图13所示，首先异步先将任务分解，然后再调用Handler()函数将任务分发到对应的线程上处理，无需在主线程中对任务进行分解，从而减少主线程耗时。

2)如图13所示，创建任务(Task)流程，将耗时较多的DOM解析步骤挪到子线程中进行异步处理：

在Action＝8或Action＝9时，可以将创建元素的过程细拆为generateComponent->bindAttrs->bindStyles->bindEvents->applyHook->createView，由于这些过程中解析并组装view树不涉及布局刷新，因此可以放到子线程中进行异步处理，减轻主线程的解析耗时，待子线程处理完成后再切回到主线程进行页面布局添加，即执行添加元素(addElement)动作。因此，本申请方案可以减少主线程耗时。

以上说明了本申请实施例提供的快应用卡片加载方法的具体实现方式，下面结合附图说明在电子设备侧、云服务器以及开发者服务平台侧之间创建快应用卡片的过程。

如图14所示，在云服务器侧，开发者服务平台通过快应用卡片接口向云服务器上传快应用卡片数据。

在电子设备侧，快应用引擎将引擎代码加载到宿主进程，完成软件开发工具包(software development kit，SDK)的初始化。

其中，快应用引擎是电子设备中预置的快应用(RPK)执行环境，具备完整的快应用能力，可用于验证RPK在电子设备上的真实表现。

其中，宿主进程指宿主的一系列进程，例如UI线程、创建快应用卡片、节点转换以及绘制渲染。宿主可以为快服务中心、负一屏、桌面、锁屏、或者YOYO建议。

在创建卡片的进程中，电子设备启动SDK中的JS线程，由此触发快应用引擎从云服务下载快应用RPK包，并将快应用RPK包发送给JS线程，完成资源加载、使用V8引擎建立DOM模型。在节点转换后进行绘制渲染，得到卡片。

其中，V8引擎是一个JavaScript引擎实现。

在本申请实施例中，快应用引擎提供卡片API，所有宿主可以共享JS卡片。

在本申请实施例中，在宿主展示JS卡片时，可以按需动态加载卡片组件到宿主进程。

图15示出了含有快应用引擎的软件架构示意图。如图15所示，软件架构包括UI、场景入口、快应用引擎、OS基础设施及硬件。

如图15所示，UI包括页面和卡片。其中，页面可以包括诸如桌面、负一屏等***页面，也可以包括应用程序的页面。卡片包括快应用卡片。

场景入口可以包括快应用中心、负一屏、锁屏、桌面、应用市场、浏览器、二维码、全局搜索等。这些场景入口都支持添加快应用卡片，便于用户查找和使用。

快应用引擎中包括如下四部分：

(1)V-DOM、业务API和UI组件；V-DOM指虚拟DOM，用于优化页面渲染性能；

(2)引擎SDK，即引擎软件开发工具包；

(3)JavaScript引擎；标准渲染引擎、快速渲染引擎、安全机制、机器学习、情景感知等功能模块；应用管理和权限管理等功能模块；

(4)推送、账号、支付、定位等功能模块，用于为用户提供各种场景服务。

OS基础设施及硬件包括图形库、原始控件、***服务和GPU/NPU等硬件，与上述软件结构交互，通过快应用引擎实现在电子设备的各种场景入口中添加快应用卡片，并在UI界面中显示快应用卡片。

需要说明的是，在本申请实施例中，“大于”可以替换为“大于或等于”，“小于或等于”可以替换为“小于”，或者，“大于或等于”可以替换为“大于”，“小于”可以替换为“小于或等于”。

本文中描述的各个实施例可以为独立的方案，也可以根据内在逻辑进行组合，这些方案都落入本申请的保护范围中。

上文主要从方法步骤的角度对本申请实施例提供的方案进行了描述。可以理解的是，为了实现上述功能，实施该方法的电子设备包含了执行各个功能相应的硬件结构和/或软件模块。本领域技术人员应该可以意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，本申请能够以硬件或硬件和计算机软件的结合形式来实现。某个功能究竟以硬件还是计算机软件驱动硬件的方式来执行，取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本申请的保护范围。

本申请实施例可以根据上述方法示例，对电子设备进行功能模块的划分，例如，可以对应各个功能划分各个功能模块，也可以将两个或两个以上的功能集成在一个处理模块中。上述集成的模块既可以采用硬件的形式实现，也可以采用软件功能模块的形式实现。需要说明的是，本申请实施例中对模块的划分是示意性的，仅仅为一种逻辑功能划分，实际实现时可以有其它可行的划分方式。下面以采用对应各个功能划分各个功能模块为例进行说明。

图16为本申请实施例提供的快应用卡片加载装置500的示意性框图。该装置500可以用于执行上文方法实施例中电子设备所执行的动作。该装置500包括接收单元510、处理单元520和显示单元530。

接收单元510，用于接收用户将第一快应用卡片添加到电子设备的***应用的第一操作；

处理单元520，用于：

响应于所述第一操作，通过用户界面UI线程创建所述第一快应用卡片；在渲染所述第一快应用卡片的过程中，通过第一工作线程将每个渲染任务分解成多个子任务，并将所述多个子任务分发到对应的工作线程进行处理，并将每个渲染任务的执行结果返回所述用户界面UI线程；

在渲染所述第一快应用卡片的过程中，通过第二工作线程解析虚拟文档对象模型DOM，并将解析虚拟DOM的结果返回所述用户界面UI线程；

通过所述用户界面UI线程，根据所述每个渲染任务的执行结果和所述虚拟DOM解析的结果，渲染得到所述第一快应用卡片的页面；

其中，所述用户界面UI线程、所述第一工作线程和所述第二工作线程分别为异步处理的线程；

显示单元530，用于在所述***应用的界面中显示所述第一快应用卡片的页面。

通过本申请方案，在加载并渲染快应用卡片的过程中，通过异步将任务分解，然后将任务分发到对应的线程上处理，无需在主线程中对任务进行分解，从而减少主线程耗时；并且，创建任务流程，将耗时较多的DOM解析步骤挪到子线程中进行异步处理，从而减少主线程耗时。本申请技术方案有助于使得电子设备能够快速向用户呈现卡片，防止出现卡顿的情况，从而提高用户体验。

根据本申请实施例的装置500可对应于执行本申请实施例中描述的方法，并且装置500中的单元的上述和其它操作和/或功能分别为了实现方法的相应流程，为了简洁，在此不再赘述。

本申请还提供一种芯片，该芯片与存储器耦合，该芯片用于读取并执行存储器中存储的计算机程序或指令，以执行上述各实施例中的方法。

本申请还提供一种电子设备，该电子设备包括芯片，该芯片用于读取并执行存储器存储的计算机程序或指令，使得各实施例中的方法被执行。

本实施例还提供一种计算机可读存储介质，该计算机可读存储介质中存储有计算机指令，当该计算机指令在电子设备上运行时，使得电子设备执行上述相关方法步骤实现上述实施例中的快应用卡片加载方法。

本实施例还提供了一种计算机程序产品，该计算机可读存储介质存储有程序代码，当该计算机程序产品在计算机上运行时，使得计算机执行上述相关步骤，以实现上述实施例中的快应用卡片加载方法。

另外，本申请的实施例还提供一种装置，这个装置具体可以是芯片，组件或模块，该装置可包括相连的处理器和存储器；其中，存储器用于存储计算机执行指令，当装置运行时，处理器可执行存储器存储的计算机执行指令，以使芯片执行上述各方法实施例中的快应用卡片加载方法。

其中，本实施例提供的电子设备、计算机可读存储介质、计算机程序产品或芯片均用于执行上文所提供的对应的方法，因此，其所能达到的有益效果可参考上文所提供的对应的方法中的有益效果，此处不再赘述。

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

以上所述，仅为本申请的具体实施方式，但本申请的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本申请揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本申请的保护范围之内。因此，本申请的保护范围应以所述权利要求的保护范围为准。

Claims

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

接收用户将第一快应用卡片添加到电子设备的***应用的第一操作；

响应于所述第一操作，通过用户界面UI线程创建所述第一快应用卡片；

在渲染所述第一快应用卡片的过程中，通过第一工作线程将每个渲染任务分解成多个子任务，并将所述多个子任务分发到对应的工作线程进行处理，并将每个渲染任务的执行结果返回所述用户界面UI线程；

在所述***应用的界面中显示所述第一快应用卡片的页面；

所述方法还包括：在渲染所述第一快应用卡片的过程中，调用applyAction函数通过所述用户界面UI线程执行渲染动作，并调用applyChangeAction函数，指示由所述第二工作线程解析所述虚拟DOM。

2.根据权利要求1所述的方法，其特征在于，所述***应用包括卡片软件开发工具包SDK，所述电子设备包括快应用引擎；

所述渲染所述第一快应用卡片，包括：

所述***应用向所述卡片SDK发送第一消息，所述第一消息用于请求加载所述第一快应用卡片；

响应于所述第一消息，所述卡片SDK向快应用引擎发送第二消息，所述第一消息用于请求渲染所述第一快应用卡片；

响应于所述第二消息，所述快应用引擎基于所述第一快应用卡片的RPK文件渲染所述第一快应用卡片。

3.根据权利要求2所述的方法，其特征在于，所述第一快应用卡片的RPK文件包括JavaScript文件；

所述快应用引擎基于所述第一快应用卡片的RPK包渲染所述第一快应用卡片，包括：

所述快应用引擎绑定V8服务模块，并初始化所述V8服务模块的子线程；

所述快应用引擎将所述JavaScript文件转换为Json文件；

所述快应用引擎将所述Json文件发送给所述V8服务模块；

所述V8服务模块通过子线程根据所述Json文件生成虚拟DOM树，并将所述虚拟DOM树发送给所述快应用引擎；

所述快应用引擎根据所述虚拟DOM树进行虚拟DOM解析；

其中，所述虚拟DOM解析的结果用于渲染所述第一快应用卡片。

4.根据权利要求2或3所述的方法，其特征在于，所述通过用户界面UI线程创建所述第一快应用卡片，包括：

所述***应用向所述卡片SDK发送第三消息，所述第三消息用于请求创建所述第一快应用卡片；

响应于所述第三消息，所述卡片SDK启动JavaScript线程，触发所述快应用引擎初始化并获取所述第一快应用卡片的RPK文件；

所述卡片SDK从所述快应用引擎获取所述第一快应用卡片的RPK文件；

所述卡片SDK通过所述JavaScript线程，根据所述第一快应用卡片的RPK文件完成所述第一快应用卡片的资源加载；

所述卡片SDK向所述***应用返回第四消息，所述第四消息用于指示所述第一快应用卡片创建完成。

5.根据权利要求1至3中任一项所述的方法，其特征在于，所述用户界面UI线程包括虚拟DOM解析类和视图父类，所述第二工作线程包括虚拟DOM异步处理类；所述虚拟DOM解析类为主线程，所述虚拟DOM异步处理类为子线程；

所述通过第二工作线程解析虚拟文档对象模型DOM，并将解析虚拟DOM的结果返回所述用户界面UI线程，包括：

所述虚拟DOM解析类调用addElement函数，以添加所述虚拟DOM树的所有元素；

所述虚拟DOM解析类指示由所述虚拟DOM异步处理类添加所述虚拟DOM树的所有元素；

所述虚拟DOM异步处理类递归处理所述虚拟DOM树的所有叶子节点，并调用createElement函数创建所有叶子节点对应的元素；

所述虚拟DOM异步处理类调用addChild函数，将所创建的元素发送给所述视图父类。

6.根据权利要求1至3中任一项所述的方法，其特征在于，所述***应用为以下任一项：负一屏应用、桌面应用、锁屏应用、全局搜索应用。

7.一种电子设备，其特征在于，包括处理器、存储器以及存储在所述存储器上的计算机程序，所述处理器用于执行所述计算机程序，以使得所述电子设备实现如权利要求1至6中任一项所述的方法。

8.一种芯片***，包括处理器、存储器以及存储在所述存储器上并可在所述处理器上运行的计算机程序，其特征在于，所述处理器用于执行所述计算机程序，以实现如权利要求1至6中任一项所述的方法。

9.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机程序，当所述计算机程序在电子设备上运行时，使得所述电子设备执行如权利要求1至6中任一项所述的方法。