[发明专利]一种卡片渲染方法及电子设备

说明书

一种卡片渲染方法及电子设备，涉及终端技术领域。该方法包括：电子设备向服务器发送目标卡片的相关信息获取请求；并接收服务器发送的目标卡片的相关信息。电子设备根据第一布局快照，对目标卡片进行初步渲染，并在显示屏上显示目标卡片；并对目标卡片的第一文件包集合进行解析，得到第二渲染指令集；筛选出第二渲染指令集中除第一渲染指令集以外的渲染指令；根据筛选出的渲染指令，对目标卡片进行再次渲染，更新在显示屏上显示的目标卡片。这种技术方案有助于使得电子设备能够快速向用户呈现卡片，提高用户体验。

技术领域

本申请涉及终端技术领域，特别涉及一种卡片渲染方法及电子设备。

背景技术

卡片是一种新的服务形态，可以直接向用户呈现用户关心或感兴趣的信息，更好的满足用户的需求。例如，对于天气类卡片，可以向用户呈现用户所在位置的天气信息。再例如，对于股票类卡片，可以向用户呈现用户已购买的股票、或者感兴趣的股票的信息。

其中，电子设备对卡片渲染完成后才能够向用户呈现卡片上的信息。而现有技术中，电子设备基于JS-Native架构至少需要依次经历对卡片的文件包集(JSBundle)解析、文档对象模型(document object model，DOM)模板构建、以及布局计算三个步骤，才能实现对卡片渲染，呈现给用户，渲染效率较低。因此，针对如何渲染卡片，使得电子设备能够快速向用户呈现卡片上的信息的研究，对于提高用户体验有重要意义。

发明内容

本申请实施例提供一种卡片渲染方法及电子设备，使得电子设备能够快速呈现卡片，有助于提高用户体验。

第一方面，为本申请实施例的一种卡片渲染的方法，该方法包括：

电子设备向服务器发送目标卡片的相关信息获取请求；并接收所述服务器发送的所述目标卡片的相关信息，所述目标卡片的相关信息包括所述目标卡片的第一文件包集合、第一渲染指令集和第一布局快照；然后，电子设备根据所述第一布局快照，对所述目标卡片进行初步渲染，并在显示屏上显示初步渲染后的所述目标卡片；并对所述目标卡片的第一文件包集合进行解析，得到第二渲染指令集；筛选出所述第二渲染指令集中除所述第一渲染指令集以外的渲染指令；最后，根据所述筛选出的渲染指令，对所述目标卡片进行再次渲染，更新在所述显示屏上显示的所述目标卡片。

本申请实施例中，服务器由于可以将第一渲染指令集和第一布局快照发送给电子设备，使得电子设备可以先根据第一渲染指令集和第一布局快照先对卡片渲染，使得电子设备在显示屏上呈现卡片，减少了解析文件包集合、以及布局计算的步骤，因而提高了卡片渲染的效率，从而有助于使得电子设备能够快速向用户呈现卡片，提高用户体验。

在一种可能的设计中，所述电子设备根据所述第一渲染指令集，构建第一文档对象模型DOM模板；并根据所述第一DOM模板和所述第一布局快照，对所述目标卡片进行初步渲染。有助于简化实现方式。

在一种可能的设计中，所述目标卡片的相关信息还包括第一DOM模板；所述电子设备根据所述第一DOM模板和第一布局快照，对所述目标卡片进行初步渲染。有助于进一步提高电子设备向用户呈现卡片的速度。

在一种可能的设计中，所述电子设备接收到加载目标卡片的请求时，向服务器发送目标卡片的相关信息获取请求。有助于简化实现方式。

在一种可能的设计中，所述电子设备接收到搜索目标卡片的请求时，向服务器发送目标卡片的相关信息获取请求。有助于简化实现方式。

在一种可能的设计中，所述第一渲染指令集包括所述第二渲染指令集中构建DOM模版的起始指令和构建DOM模版的结束指令之间的渲染指令，且包括所述构建DOM模版的起始指令和构建DOM模版的结束指令。有助于降低实现的复杂性。

在一种可能的设计中，所述电子设备保存所述第二渲染指令集、和所述第一布局快照。