CN107092514A - 一种页面内容展示方法及装置 - Google Patents

Abstract

本申请涉及计算机技术领域，尤其涉及一种页面内容展示方法及装置，用以解决使用动态语言代码实现应用版本发布存在页面内容刷新缓慢的问题。本申请实施例提供的一种页面内容展示方法包括：接收对应多个展示单元的网络数据；采用动态语言代码调用操作系统提供的动态语言与源语言之间的交互桥梁，生成所述多个展示单元中每个展示单元的网络数据分别对应的源语言视图模型；在需要显示任一展示单元对应的页面内容时，调用运行时机制Runtime运行该展示单元的网络数据对应的源语言视图模型。

Description

一种页面内容展示方法及装置

技术领域

本申请涉及计算机技术领域，尤其涉及一种页面内容展示方法及装置。

背景技术

现有的应用新版本发布都是在用户的操作下，进行新版本应用的安装覆盖，安装完成后运行新版本应用。动态发布是指在用户无感知的情况下，由后台下载更新版本，在每次重新启动应用时，加载更新版本内容，无需进行版本的升级安装过程，可以在用户无感知的情况下实现新版本的运行效果。

使用现有IOS系统下的动态发布实现应用版本的更新，需要预先定义好前端进行页面布局的各个功能模块，比如图片显示模块、文字显示模块，基于图片显示模块可以更改图片的大小和位置等，基于文字显示模块可以更改文字的字体和颜色等。这种预先定义的方式不可能支持所有情况的更新，对于没有预先定义好的功能的更新，比如插入动画和复杂的交互方式等，则无法在后续版本中实现。

为了实现完全的动态发布，未来可以采用动态语言(如JavaScript、Lua等)代码进行应用版本的发布，动态语言可以在程序运行时改变程序的结构，采用动态语言代码进行应用版本的发布不需要对进行页面布局的功能模块进行预先定义，可以对页面进行任何复杂或简单的更新。

但是，采用动态语言代码进行应用版本的发布，在进行页面刷新时，动态语言代码需要针对每一条语句，频繁的调用操作系统提供的动态语言与源语言之间的交互桥梁(比如JavaScript与源语言之间的交互桥梁JSBridge)进行页面的渲染。该调用耗时比较大，一旦频繁调用，性能下降非常明显，尤其是在用户进行页面滚动刷新时，页面内容将会更新缓慢，影响用户体验。

因此，使用动态语言代码实现应用版本发布存在页面内容刷新缓慢的问题。

发明内容

本申请实施例提供一种页面内容展示方法及装置，用以解决使用动态语言代码实现应用版本发布存在页面内容刷新缓慢的问题。

本申请实施例提供的一种页面内容展示方法，该方法应用于采用动态语言代码实现应用功能的应用版本中，所述动态语言代码为由所述应用版本的源语言代码转换得到的，该方法包括：

接收对应多个展示单元的网络数据；

采用动态语言代码调用操作系统提供的动态语言与源语言之间的交互桥梁，生成所述多个展示单元中每个展示单元的网络数据分别对应的源语言视图模型；

在需要显示任一展示单元对应的页面内容时，调用运行时机制Runtime运行该展示单元的网络数据对应的源语言视图模型。

可选地，在生成所述每个展示单元的网络数据分别对应的源语言视图模型之后，还包括：

缓存该展示单元对应的源语言视图模型；

在需要显示任一展示单元对应的页面内容时，调用运行时机制Runtime运行该展示单元对应的源语言视图模型，包括：

在缓存好所述多个展示单元分别对应的源语言视图模型后，确定需要展示的首界面内容对应的展示单元；

从缓存中分别提取所述首界面内容对应的每个展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示所述首界面内容。

可选地，在展示首界面内容之后，还包括：

在接收到页面滑动指令后，从缓存中提取进行页面滑动后在当前界面需要刷新的展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示刷新后的页面内容。

可选地，接收对应多个展示单元的网络数据之前，还包括：

接收服务器发送的所述应用版本的动态语言代码。

可选地，接收对应多个展示单元的网络数据，包括：

向服务器发送网络数据获取请求，接收所述服务器基于所述网络数据获取请求发送的对应多个展示单元的网络数据。

本申请实施例提供一种页面内容展示装置，该装置应用于采用动态语言代码实现应用功能的应用版本中，所述动态语言代码为由所述应用版本的源语言代码转换得到的，包括：

接收模块，用于接收对应多个展示单元的网络数据；

视图模型生成模块，用于采用动态语言代码调用操作系统提供的动态语言与源语言之间的交互桥梁，生成所述多个展示单元中每个展示单元的网络数据分别对应的源语言视图模型；

运行模块，用于在需要显示任一展示单元对应的页面内容时，调用运行时机制Runtime运行该展示单元的网络数据对应的源语言视图模型。

可选地，所述装置还包括：

存储模块，用于在所述视图模型生成模块生成每个展示单元对应的源语言视图模型后，缓存该源语言视图模型；

所述运行模块具体用于：

在缓存好所述多个展示单元分别对应的源语言视图模型后，确定需要展示的首界面内容对应的展示单元；从缓存中分别提取所述首界面内容对应的每个展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示所述首界面内容。

可选地，所述运行模块还用于：

在接收到页面滑动指令后，从缓存中提取进行页面滑动后在当前界面需要刷新的展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示刷新后的页面内容。

可选地，所述接收模块还用于：

接收服务器发送的所述应用版本的动态语言代码。

可选地，所述接收模块具体用于：

向服务器发送网络数据获取请求，接收所述服务器基于所述网络数据获取请求发送的对应多个展示单元的网络数据。

本申请实施例在接收到服务器发送的网络数据后，只调用一次动态语言与源语言之间的交互桥梁(比如JSBridge)，针对接收的多个展示单元的网络数据分别进行处理，生成每个展示单元对应的源语言视图模型。每次进行页面内容刷新时，不需要再调用动态语言与源语言之间的交互桥梁，只需要提取源语言视图模型进行页面内容的更新展示即可。由于源语言视图模型的数据量相比网络数据非常小，这种方式既优化了页面刷新的速度和性能，又节省了内存消耗。

附图说明

图1为本申请实施例一提供的页面内容展示方法流程图；

图2为本申请实施例二提供的页面内容展示方法流程图；

图3为本申请实施例进行页面内容展示的原理图；

图4为本申请实施例提供的页面内容展示装置结构示意图。

具体实施方式

本申请应用于采用动态语言代码进行应用版本发布的场景下。在这种场景下，在进行页面刷新时，动态语言代码需要调用操作系统提供的动态语言与源语言之间的交互桥梁(比如JavaScript与源语言之间的交互桥梁JSBridge)进行从动态语言代码到源语言操作方法的转换。如果该调用过程比较频繁，将会严重影响页面内容更新速度，导致页面性能下降，尤其是在用户进行页面滚动刷新时，页面内容将会更新缓慢，影响用户体验。基于此，本申请提出了基于视图模型ViewModel的思想，详见下述实施例的描述。

本申请主要是针对IOS系统设计的，当然，本申请提出的方案也可以在Android系统中实施。下面，主要以在IOS系统中的应用为例对本申请方案作进一步详细描述。

下面结合说明书附图对本申请实施例作进一步详细描述。

实施例一

在本申请实施例中，开发人员在编写好应用的源语言(比如Objective-C)代码后，通过编程语言转换器(Convertor)，将源语言代码转换成动态语言代码(动态语言可以是JavaScript，Lua或者其它)后进行发布。移动终端接收发布服务器发送的应用的动态语言代码。之后，可以通过调用操作系统提供的动态语言与源语言之间的交互桥梁(比如JavaScript与源语言之间的交互桥梁JSBridge)，基于动态语言代码的每一条语句对返回的网络数据进行处理，生成源语言操作方法，之后再通过调用操作系统提供的运行时runtime机制运行转换后的源语言操作方法。在此过程中，为了减少JSBridge的调用次数，本申请实施例只对JSBridge进行一次调用，生成网络数据对应的多个展示单元(Cell)分别对应的源语言视图模型(一个源语言视图模型对应逻辑上为一个整体的展示单元，比如发布的一条微信朋友圈，它可以包含多条源语言操作方法语句)，后续在需要进行页面内容刷新时可以直接调取各个源语言视图模型进行页面渲染。

如图1所示，为本申请实施例一提供的页面内容展示方法流程图，应用于采用动态语言代码实现应用功能的应用版本中，所述动态语言代码为由所述应用版本的源语言代码转换得到的，包括以下步骤：

S101：接收对应多个展示单元的网络数据。

在具体实施过程中，服务器可以主动向客户端推送网络数据，也可以在接收到客户端的网络数据获取请求后，向客户端推送网络数据。

本申请实施例中，程序开发人员采用源语言(比如Objective-C)编写应用的底层代码，然后通过编程语言转换器(Convertor)，将源语言代码转换成动态语言代码(动态语言可以是JavaScript，Lua或者其它)。比如，将非动态语言Objective-C代码转换成JavaScript代码。服务器发布应用的动态语言代码，移动终端获取该服务器发布的应用的动态语言代码。

这里，发布应用版本的服务器与上述提供网络数据的服务器可以是同一服务器，也可以是不同的服务器。

S102：采用动态语言代码调用操作系统提供的动态语言与源语言之间的交互桥梁(比如JavaScript与源语言之间的交互桥梁JSBridge)，生成所述多个展示单元中每个展示单元的网络数据分别对应的源语言视图模型。

在具体实施过程中，客户端在接收到服务器返回的网络数据后，通过应用的动态语言代码对网络数据做处理，针对每个展示单元，都生成出一个与该展示单元的网络数据对应的源语言视图模型，也即Native的ViewModel，每个ViewModel中包含该展示单元对应的需要在页面显示的背景颜色、字体大小、字符串内容等字段，这些基本字段内存占用量非常小。

S103：在需要显示任一展示单元对应的页面内容时，调用运行时机制Runtime运行该展示单元的网络数据对应的源语言视图模型。

在具体实施过程中，在生成每个展示单元对应的源语言视图模型之后，可以首先缓存该展示单元对应的源语言视图模型。待需要显示任一展示单元对应的页面内容时，从缓存中提取该展示单元的源语言视图模型，调用运行时机制Runtime运行该展示单元对应的源语言视图模型。

这里，在生成并缓存好网络数据中的多个展示单元分别对应的源语言视图模型后，首先展示首界面，之后，再在用户的页面滑动指令的触发下，进行页面显示内容的更新。

具体地，在缓存好所述多个展示单元中的每个展示单元对应的源语言视图模型后，从缓存中分别提取接收网络数据后需要展示的首界面中的每个展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示首界面的内容。之后，在接收到页面滑动指令后，从缓存中提取进行页面滑动后在当前界面需要刷新的展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示刷新后的页面内容。

这里，在对网络数据处理完毕(生成并缓存好每个展示单元的ViewModel)之后，触发用户界面表视图控件(UITableView)执行页面刷新。UITableView触发Cell更新。针对首界面中的每个Cell，通过IOS Runtime运行对应的Native ViewModel数据，得到首界面的页面展示内容。当需要展示的Cell更新完毕之后，也就是对首界面的表视图(TableView)加载完成。之后用户触发页面滑动，也即触发Native的UITableView更新Cell的展示，此时也是通过提取新的Cell对应的ViewModel来更新页面展示内容。在这个过程中，由于ViewModel已经生成，所有的处理都是基于源语言(Native)完成，不再需要JSBridge，也不需要JavaScript重复处理渲染，页面内容更新效率非常高。同时，由于ViewModel数据只是一些字符串等字段，内存占用量非常低。

可见，本申请实施例在接收到服务器发送的网络数据后，只调用一次动态语言与源语言之间的交互桥梁(比如JSBridge)，针对接收的网络数据对应的多个展示单元分别进行处理，生成每个展示单元对应的源语言视图模型ViewModel。每次进行页面内容刷新时，不需要再调用动态语言与源语言之间的交互桥梁，只需要提取ViewModel进行页面内容的更新展示即可。由于ViewModel的数据量相比网络数据非常小，这种方式既优化了页面刷新的速度和性能，又节省了内存消耗。

下面，以动态语言为JavaScript，源语言为Objective-C，JavaScript与Objective-C之间的交互桥梁JSBridge为例，对本申请方案作进一步介绍。

如图2所示，为本申请实施例二提供的页面内容展示方法流程图，图3为与之对应的原理图，该方法包括：

S201：向服务器发送网络数据获取请求。

这里，在应用启动后，通过应用向服务器发送网络数据获取请求。

S202：接收服务器发送的对应多个展示单元的网络数据。

S203：通过调用JSBridge，基于JavaScript对多个展示单元的网络数据进行处理，生成所述多个展示单元中每个展示单元对应的基于Objective-C的Native ViewModel。

S204：缓存生成的Native ViewModel。

S205：在缓存好多个展示单元中分别对应的Native ViewModel后，触发UITableView执行页面刷新：从缓存中分别提取接收所述网络数据后需要展示的首界面中的每个展示单元的Native ViewModel，并调用IOS Runtime运行提取的Native ViewModel。

这里，当首界面的展示单元对应的页面内容更新完毕之后，即完成了TableView的加载。

在接收到页面滑动指令后，从缓存中提取进行页面滑动后在当前界面需要刷新的展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型。

S206：在接收到页面滑动指令后，从缓存中提取进行页面滑动后在当前界面需要刷新的展示单元的Native ViewModel，并调用IOS Runtime运行提取的Native ViewModel。

这里，用户触发页面滑动，UITableView更新Cell的展示，通过Runtime绑定需要更新的Cell的ViewModel来更新页面展示内容。在这个过程中，由于ViewModel已经生成，所有的处理都是基于源语言完成，不再需要JSBridge，也不需要JavaScript重复处理渲染，页面内容更新效率非常高。同时，由于ViewModel数据只是一些字符串等字段，内存占用量非常低。

可见，采用上述方法，在接收到服务器发送的网络数据后，只调用一次JSBridge，针对接收的网络数据对应的多个展示单元分别进行处理，生成每个展示单元对应的ViewModel。每次进行页面内容刷新时，不需要再调用JSBridge，只需要提取ViewModel进行页面内容的更新展示即可。由于ViewModel的数据量相比网络数据非常小，这种方式既优化了页面刷新的速度和性能，又节省了内存消耗。

基于同一发明构思，本申请实施例中还提供了一种与页面内容展示方法对应的页面内容展示装置，由于该装置解决问题的原理与本申请的页面内容展示方法相似，因此该装置的实施可以参见方法的实施，重复之处不再赘述。

如图4所示，为本申请实施例提供的页面内容展示装置结构示意图，该装置应用于采用动态语言代码实现应用功能的应用版本中，所述动态语言代码为由所述应用版本的源语言代码转换得到的，包括：

接收模块41，用于接收对应多个展示单元的网络数据；

视图模型生成模块42，用于采用动态语言代码调用操作系统提供的动态语言与源语言之间的交互桥梁，生成所述多个展示单元中每个展示单元的网络数据分别对应的源语言视图模型；

运行模块43，用于在需要显示任一展示单元对应的页面内容时，调用运行时机制Runtime运行该展示单元的网络数据对应的源语言视图模型。

可选地，所述装置还包括：

存储模块44，用于在所述视图模型生成模块生成每个展示单元对应的源语言视图模型后，缓存该源语言视图模型；

所述运行模块43具体用于：

在缓存好所述多个展示单元分别对应的源语言视图模型后，确定需要展示的首界面内容对应的展示单元；从缓存中分别提取所述首界面内容对应的每个展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示所述首界面内容。

可选地，所述运行模块43还用于：

在接收到页面滑动指令后，从缓存中提取进行页面滑动后在当前界面需要刷新的展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示刷新后的页面内容。

可选地，接收模块41还用于：

接收服务器发送的所述应用版本的动态语言代码。

可选地，所述接收模块41具体用于：

向服务器发送网络数据获取请求，接收所述服务器基于所述网络数据获取请求发送的对应多个展示单元的网络数据。

基于上述装置，移动终端在接收到服务器发送的网络数据后，只调用一次动态语言与源语言之间的交互桥梁，针对接收的网络数据对应的多个展示单元分别进行处理，生成每个展示单元对应的源语言视图模型。每次进行页面内容刷新时，不需要再调用动态语言与源语言之间的交互桥梁，只需要提取源语言视图模型进行页面内容的更新展示即可。由于源语言视图模型的数据量相比网络数据非常小，这种方式既优化了页面刷新的速度和性能，又节省了内存消耗。

本领域内的技术人员应明白，本申请的实施例可提供为方法、系统、或计算机程序产品。因此，本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。

本申请是参照根据本申请实施例的方法、装置(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

尽管已描述了本申请的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例作出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本申请范围的所有变更和修改。

显然，本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申请的精神和范围。这样，倘若本申请的这些修改和变型属于本申请权利要求及其等同技术的范围之内，则本申请也意图包含这些改动和变型在内。

Claims (10)

1.一种页面内容展示方法，其特征在于，该方法应用于采用动态语言代码实现应用功能的应用版本中，所述动态语言代码为由所述应用版本的源语言代码转换得到的，包括：

接收对应多个展示单元的网络数据；

采用动态语言代码调用操作系统提供的动态语言与源语言之间的交互桥梁，生成所述多个展示单元中每个展示单元的网络数据分别对应的源语言视图模型；

在需要显示任一展示单元对应的页面内容时，调用运行时机制Runtime运行该展示单元的网络数据对应的源语言视图模型。

2.如权利要求1所述的方法，其特征在于，在生成所述每个展示单元的网络数据分别对应的源语言视图模型之后，还包括：

缓存该展示单元对应的源语言视图模型；

在需要显示任一展示单元对应的页面内容时，调用运行时机制Runtime运行该展示单元对应的源语言视图模型，包括：

在缓存好所述多个展示单元分别对应的源语言视图模型后，确定需要展示的首界面内容对应的展示单元；

从缓存中分别提取所述首界面内容对应的每个展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示所述首界面内容。

3.如权利要求2所述的方法，其特征在于，在展示首界面内容之后，还包括：

在接收到页面滑动指令后，从缓存中提取进行页面滑动后在当前界面需要刷新的展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示刷新后的页面内容。

4.如权利要求1所述的方法，其特征在于，接收对应多个展示单元的网络数据之前，还包括：

接收服务器发送的所述应用版本的动态语言代码。

5.如权利要求1所述的方法，其特征在于，接收对应多个展示单元的网络数据，包括：

向服务器发送网络数据获取请求，接收所述服务器基于所述网络数据获取请求发送的对应多个展示单元的网络数据。

6.一种页面内容展示装置，其特征在于，该装置应用于采用动态语言代码实现应用功能的应用版本中，所述动态语言代码为由所述应用版本的源语言代码转换得到的，包括：

接收模块，用于接收对应多个展示单元的网络数据；

视图模型生成模块，用于采用动态语言代码调用操作系统提供的动态语言与源语言之间的交互桥梁，生成所述多个展示单元中每个展示单元的网络数据分别对应的源语言视图模型；

运行模块，用于在需要显示任一展示单元对应的页面内容时，调用运行时机制Runtime运行该展示单元的网络数据对应的源语言视图模型。

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

存储模块，用于在所述视图模型生成模块生成每个展示单元对应的源语言视图模型后，缓存该源语言视图模型；

所述运行模块具体用于：

在缓存好所述多个展示单元分别对应的源语言视图模型后，确定需要展示的首界面内容对应的展示单元；从缓存中分别提取所述首界面内容对应的每个展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示所述首界面内容。

8.如权利要求7所述的装置，其特征在于，所述运行模块还用于：

在接收到页面滑动指令后，从缓存中提取进行页面滑动后在当前界面需要刷新的展示单元的源语言视图模型，并调用Runtime运行提取的源语言视图模型，以展示刷新后的页面内容。

9.如权利要求6所述的装置，其特征在于，所述接收模块还用于：

接收服务器发送的所述应用版本的动态语言代码。

10.如权利要求6所述的装置，其特征在于，所述接收模块具体用于：

向服务器发送网络数据获取请求，接收所述服务器基于所述网络数据获取请求发送的对应多个展示单元的网络数据。