页面数据编译的方法和装置、页面渲染的方法和装置技术领域
本发明涉及计算机技术领域，特别是涉及一种页面数据编译的方法和装置、页面
渲染的方法和装置。
背景技术
随着计算机技术的发展，用户可以在终端上安装各种应用程序，在应用程序内部
展示页面或通过浏览器展示页面，从而浏览页面获取感兴趣的内容。
传统的可通过前端模版或后端模块进行页面的展示，前端模版或后端模块中往往
包括了扩展标记语法编写的页面数据，如果通过前端模版实现，则页面展示时需要加载扩
展标记语言页面数据和脚本语言解析数据，脚本语言解析数据用于对扩展标记语言页面数
据进行解析，从而展示页面，每次载入页面时都需要加载脚本语言解析数据并对扩展标记
语言页面数据进行解析，导致页面载入效率低，如果通过后端模版实现，则在后台直接将扩
展标记语法编写的页面数据全部解析为最终的视图标准数据，导致展示的页面固定不变，
不能随着前端动态数据而更新。
发明内容
基于此，有必要针对上述技术问题，提供一种页面数据编译的方法和装置、页面渲
染的方法和装置，使得编译生成的页面数据在提高页面展示效率的同时保留动态性。
一种页面数据编译的方法，所述方法包括：
获取由扩展标记语言生成的初始页面结构数据，解析所述初始页面结构数据进行
代码渲染生成对应的脚本语言页面数据，所述脚本语言页面数据包括页面生成方法，所述
页面生成方法的输入为数据变量集合，所述页面生成方法的输出为与输入匹配的节点树；
所述脚本语言页面数据用于发送至终端，以使所述终端根据所述脚本语言页面数
据显示对应的页面。
一种页面数据编译的装置，所述装置包括：
获取模块，用于获取由扩展标记语言生成的初始页面结构数据；
编译模块，用于解析所述初始页面结构数据进行代码渲染生成对应的脚本语言页
面数据，所述脚本语言页面数据包括页面生成方法，所述页面生成方法的输入为数据变量
集合，所述页面生成方法的输出为与输入匹配的节点树，所述脚本语言页面数据用于发送
至终端，以使所述终端根据所述脚本语言页面数据显示对应的页面。
上述页面数据编译的方法和装置，通过获取由扩展标记语言生成的初始页面结构
数据，解析初始页面结构数据进行代码渲染生成对应的脚本语言页面数据，脚本语言页面
数据包括页面生成方法，页面生成方法的输入为数据变量集合，页面生成方法的输出为与
输入匹配的节点树，脚本语言页面数据用于发送至终端，以使终端根据脚本语言页面数据
显示对应的页面，其中对初始页面结构数据进行解析的任务放在服务器完成，不需要终端
每次页面加载后再对扩展标记语言页面数据进行解析，提高了页面展示的效率，同时脚本
语言页面数据包括了页面生成方法，页面生成方法输出的节点树与输入的数据变量集合匹
配，可根据输入的不同得到不同的节点树，达到页面的动态更新。
一种页面渲染的方法，所述方法包括：
获取脚本语言页面数据，所述脚本语言页面数据包括页面生成方法，所述页面生
成方法的输入为数据变量集合，所述页面生成方法的输出为节点树；
获取页面数据，根据所述页面数据确定所述数据变量集合得到当前数据集合，所
述页面生成方法根据所述当前数据集合输出对应的目标节点树，将所述目标节点树变换生
成描述视图的标准结构数据；
根据所述标准结构数据渲染显示对应的页面。
一种页面渲染的装置，所述装置包括：
获取模块，用于获取脚本语言页面数据，所述脚本语言页面数据包括页面生成方
法，所述页面生成方法的输入为数据变量集合，所述页面生成方法的输出为节点树；
节点树输出模块，用于获取页面数据，根据所述页面数据确定所述数据变量集合
得到当前数据集合，所述页面生成方法根据所述当前数据集合输出对应的目标节点树，将
所述目标节点树变换生成描述视图的标准结构数据；
渲染模块，用于根据所述标准结构数据渲染显示对应的页面。
上述页面渲染的方法和装置，通过获取脚本语言页面数据，脚本语言页面数据包
括页面生成方法，页面生成方法的输入为数据变量集合，页面生成方法的输出为节点树，获
取页面数据，根据页面数据确定数据变量集合得到当前数据集合，页面生成方法根据当前
数据集合输出对应的目标节点树，将目标节点树变换生成描述视图的标准结构数据，根据
标准结构数据渲染显示对应的页面，客户端获取的是编译后的脚本语言页面数据，不需要
终端每次页面加载后再对扩展标记语言页面数据进行解析，提高了页面展示的效率，同时
脚本语言页面数据包括了页面生成方法，页面生成方法输出的节点树与输入的数据变量集
合匹配，获取不同的页面数据确定的数据变量集合对应的当前值也不同，从而得到不同的
节点树，达到页面的动态更新。
附图说明
图1为一个实施例中页面数据编译的方法、页面渲染的方法运行的应用环境图；
图2为一个实施例中图1中服务器的内部结构图；
图3为一个实施例中图1中终端的内部结构图；
图4为一个实施例中页面数据编译的方法的流程图；
图5为一个实施例中生成页面生成方法的流程图；
图6为一个具体的实施例中页面生成方法的过程示意图；
图7为一个实施例中生成表达式片段的流程图；
图8为一个具体的实施例中生成表达式片段的过程示意图；
图9为一个实施例中页面渲染的方法的流程图；
图10为一个实施例中生成的节点树的示意图；
图11为一个实施例中图10中节点树对应的页面示意图；
图12为一个实施例中更新显示页面的流程图；
图13为一个实施例中更新后生成的节点树示意图；
图14为一个实施例中更新后显示的页面示意图；
图15为一个实施例中页面数据编译的装置的结构框图；
图16为一个实施例中编译模块的结构框图；
图17为另一个实施例中页面数据编译的装置的结构框图；
图18为再一个实施例中页面数据编译的装置的结构框图；
图19为一个实施例中页面渲染的装置的结构框图；
图20为另一个实施例中页面渲染的装置的结构框图。
具体实施方式
图1为一个实施例中页面数据编译的方法运行的应用环境图。如图1所示，该应用
环境包括终端110和服务器120，其中终端110、服务器120通过网络进行通信。
终端110，可为智能手机、平板电脑、笔记本电脑、台式计算机等，但并不局限于此。
服务器120将扩展标记语言生成的初始页面结构数据进行编译生成脚本语言页面数据，脚
本语言页面数据用于发送至终端110，以使终端110根据1脚本语言页面数据显示对应的页
面，其中编译的部分放在服务器120完成，不需要终端每次页面加载后再对扩展标记语言页
面数据进行解析，提高了页面展示的效率，同时脚本语言页面数据包括了页面生成方法，页
面生成方法输出的节点树与输入的数据变量集合匹配，可根据输入的不同得到不同的节点
树，达到页面的动态更新。
在一个实施例中，图1中服务器120的内部结构如图2所示，该服务器120包括通过
系统总线连接的处理器、存储介质、内存和网络接口。其中，该服务器120的存储介质存储有
操作系统、数据库和一种页面数据编译的装置，数据库用于存储数据，如初始页面结构数
据、脚本语言页面数据等，该装置用于实现一种适用于服务器120的页面数据编译的方法。
该服务器120的处理器用于提供计算和控制能力，支撑整个服务器120的运行。该服务器120
的内存为存储介质中的页面数据编译的装置的运行提供环境。该服务器120的网络接口用
于与终端110通过网络连接通信，比如向终端110发送脚本语言页面数据等。图2中示出的结
构，仅仅是与本申请方案相关的部分结构的框图，并不构成对本申请方案所应用于其上的
服务器的限定，具体的服务器可以包括比图中所示更多或更少的部件，或者组合某些部件，
或者具有不同的部件布置。
在一个实施例中，如图所示，图1中的终端110的内部结构如图3所示，该终端110包
括通过系统总线连接的处理器、图形处理单元、存储介质、内存、网络接口、显示屏幕和输入
设备。其中，终端110的存储介质存储有操作系统，还包括页面渲染的装置，该装置用于实现
一种适用于终端的页面渲染的方法。该处理器用于提供计算和控制能力，支撑整个终端110
的运行。终端110中的图形处理单元用于至少提供显示界面的绘制能力，如渲染页面等，内
存为存储介质中的页面渲染的装置的运行提供环境，网络接口用于与服务器120进行网络
通信，如向服务器120发送下载请求、接收脚本语言页面数据等。显示屏幕用于显示应用界
面等，输入设备用于接收用户输入的命令或数据等。对于带触摸屏的终端110，显示屏幕和
输入设备可为触摸屏。图3中示出的结构，仅仅是与本申请方案相关的部分结构的框图，并
不构成对本申请方案所应用于其上的终端的限定，具体的终端可以包括比图中所示更多或
更少的部件，或者组合某些部件，或者具有不同的部件布置。
在一个实施例中，如图4所示，提供了一种页面数据编译的方法，应用于上述应用
环境中的服务器来举例说明，包括以下步骤：
步骤S210，获取由扩展标记语言生成的初始页面结构数据。
具体的，标记语言是一种将文本以及文本相关的其他信息结合起来，展现出关于
文档结构和数据处理细节的文字编码，扩展标记语言是指基于XML(Extensible Markup
Language，可扩展标记语言)扩展的自定义标记语言。在一个实施例中，定义了扩展标记语
言的语法形成一套模版语言，模版语言的功能包括条件控制、定长循环、自定义可复用片
段，提供完整的右值表达式支持，支持立即字符串如‘somestring’以及立即数组如[1,2,3]
等数据类型。页面结构数据是指用于描述页面结构的数据，包括基本视图元素数据、条件控
制数据、表达式数据、遍历数组数据等，通过不同类型数据的组合完成对需要展示的页面的
不同配置，从而能展示不同的页面。通过扩展标记语言生成的初始页面结构数据可通过自
定义的语法结构灵活方便的描述页面结构。本实施例中的扩展标记语言是一种与渲染无关
的标记语言，渲染层可能是WEBVIEW，也可能是CANVAS画布。
步骤S220，解析初始页面结构数据进行代码渲染生成对应的脚本语言页面数据，
脚本语言页面数据包括页面生成方法，页面生成方法的输入为数据变量集合，页面生成方
法的输出为与输入匹配的节点树。
具体的，初始页面结构数据中往往包括了不同的标签，每个标签都存在标签的属
性、标签的内容等数据，标签的属性可能为控制属性，标签的内容中可包括表达式、文本内
容等。其中标签的属性用于对标签进行修饰，如定义标签本身的样式、需要的数据等。需要
对组成初始页面结构数据的各个元素进行分析，获取其中的数据处理逻辑从而将各个标签
携带的逻辑、数据转换为以数据变量集合为输入，以结点树为输出的页面生成方法，得到对
应的脚本语言页面数据。脚本语言是一种解释性的编程语言，如JavaScript脚本语言或者
VBScript，对脚本语言的具体类型不作限定。数据变量集合是页面展示过程中需要传递至
页面生成方法的所有变量的集合，通过提取初始页面结构数据中的变量组成数据变量集
合。在页面展示过程中，可通过对页面的操作获取动态数据为变量赋值，从而更新页面，如
通过对页面上的按钮的点击，获取按钮绑定的当前数据，将页面展示的数据更新为当前数
据。节点树是以初始页面结构数据中的元素为节点，存在自上而下的父节点与子节点关系
的树形数据结构。由于通过对初始页面结构数据进行分析并进行代码渲染后，形成了以节
点树为输出的页面生成方法，在前端可根据输入自动输出匹配的节点树，由于节点树是已
经解析完成的存在节点关系的数据结构，从而不需要在终端再进行解析，在前端得到节点
树时可直接转换为前端能解析的携带节点关系的标准数据结构，从而快速的进行页面的渲
染。
扩展标记语言由于携带了自定义的语法，存在运行环境的限制，所以采用在服务
器将其编译为以脚本语言，如JavaScript脚本语言作为目标机器语言生成代码以去除对客
户端运行时环境的门槛，且提前对其进行解析生成脚本语言页面数据同时避免了页面每加
载一次就需要在前端对自定义语法进行解析的问题，提高了页面展示的效率。
步骤S230，脚本语言页面数据用于发送至终端，以使终端根据脚本语言页面数据
显示对应的页面。
具体的，脚本语言页面数据可与不同的页面标识、应用标识、上传用户标识等进行
匹配，建立关联关系，从而根据终端发送的页面数据获取请求中的标识信息获取对应的目
标脚本语言页面数据发送至终端。服务器也可在生成新的脚本语言页面数据后主动发送至
终端，或自定义发送规则，如定时发送至终端。终端接收到脚本语言页面数据后，由于脚本
页面数据中包括了页面生成方法，从而能根据页面生成方法生成对应的节点树，再将节点
树转换为最终描述视图的数据结构，快速渲染显示对应的页面。显示的页面可以是运行于
操作系统的应用内部的页面，也可以是基于浏览器运行的页面。
本实施例中，通过获取由扩展标记语言生成的初始页面结构数据，解析初始页面
结构数据进行代码渲染生成对应的脚本语言页面数据，脚本语言页面数据包括页面生成方
法，页面生成方法的输入为数据变量集合，页面生成方法的输出为与输入匹配的节点树，脚
本语言页面数据用于发送至终端，以使终端根据脚本语言页面数据显示对应的页面，其中
对初始页面结构数据进行解析的任务放在服务器完成，不需要终端每次页面加载后再对扩
展标记语言页面数据进行解析，提高了页面展示的效率，同时脚本语言页面数据包括了页
面生成方法，页面生成方法输出的节点树与输入的数据变量集合匹配，可根据输入的不同
得到不同的节点树，达到页面的动态更新。
在一个实施例中，如图5所示，步骤S220包括：
步骤S221，对初始页面结构数据进行分词得到分词元素组成的数组。
具体的，根据自定义的语法结构特征和最小元素单元对初始页面结构数据进行分
词得到分词元素，各个分词元素组成一个数组。如图6所示为初始页面结构数据对应的源代
码310，进行分词后得到的数组320。
步骤S222，根据数组生成以分词元素为节点的语法树。
具体的，可根据自定义的语法结构特征对分词元素进行解析，得到以分词元素为
节点的语法树，其中只有特定的元素能作为节点，如标签节点、文本节点，根据分词元素的
具体内容确定各个分词是否可作为节点，或是否为节点的属性信息，如控制属性，以及分词
元素出现的位置确定分词元素间的节点关系。如一个完整的标签包括开始标签和结束标
签，则先查找分词元素构成一个完整标签的元素，一个完整标签作为一个标签节点，再在完
整标签对应的开始标签和结束标签之间查找属性信息，作为当前标签节点对应的属生信
息。再在开始标签和结束标签之间查找是否存在字符串及字符串表达式，作为当前标签节
点对应的文本子节点，最终形成语法树。如图6所示，数组320对应的语法树330示意图。其中
在根节点331下包括2个子节点331a和331b，节点331a包括一个子节点331a1，节点331b1包
括一个子节点331b1。
步骤S223，提取语法树中的变量确定数据变量集合结构，解析语法树进行代码渲
染生成数据变量集合在不同逻辑条件下对应的页面生成方法片段，根据页面生成方法片段
生成页面生成方法。
具体的，将语法树中存在的不同名称的所有变量组合生成变量集合结构，其中各
个变量的顺序可根据需要自定义。变量集合结构中变量会根据逻辑代码和前端传入的数据
或指令进行更新。当变量集合中的数据满足不同的逻辑条件时，如对于控制属性对应的节
点或数组遍历节点，会对应不同的子节点，从而对应不同的页面生成方法片段，如图6所示
的语法树330在控制逻辑条件下，当变量为真，即name为真时对应的第一页面生成方法片段
341，和变量为假即name为假时对应的第二页面生成方法片段342，其中第二页面生成方法
片段的具体内容在图中省略。对于包含条件控制属性的节点，每个节点分配唯一的标号，如
图中cond＝1表示为1的标号，不同的标号都有对应的页面生成方法片段。
本实施例中，先解析生成语法树，语法树清晰有层次的描述出各个元素间的关系，
再根据语法树可快速生成在不同逻辑条件下对应的页面生成方法片段，从而最终生成页面
生成方法。
在一个实施例中，如图7所示，步骤S223包括：
步骤S223a，对语法树进行后序遍历，获取字符串表达式。
具体的，后序遍历是指首先遍历左子树，然后遍历右子树，最后访问根结点，在遍
历左、右子树时，仍然先遍历左子树，然后遍历右子树，最后遍历根结点，遍历的过程中获取
文本节点对应的字符串表达式，在一个具体的实施例中获取得到字符串表达式410，如图8
所示。
步骤S223b，对字符串表达式进行字符表达式分词获取其中的表达式。
具体的，根据语法结构特征识别字符串和表达式，将字符串表达式中的字符串与
表达式进行区分得到一个或多个字符串及一个或多个表达式组成数组，如图8中数组420为
字符串表达式410分词后生成的数组，再对每个表达式进行代码渲染，如图8所示对表达式
430进行代码渲染。
步骤S223c，对表达式进行解析并代码渲染生成页面生成方法片段中的表达式片
段。
具体的，可根据自定义的语法结构特征对表达式进行分词得到表达式对应的基础
元素组成表达式数组，对表达式数组进行结构分析得到表达式语法数据结构，根据表达式
语法数据结构生成方法片段中的表达式片段，表达式片段是对标记语言中的表达式进行解
析后生成的对应的脚本语言代码。如图8所示，对表达式430进行表达式分词得到表达式数
组440，并进行解析得到表达式语法数据结构450，最终生成对应的表达式片段460。
在一个实施例中，脚本语言页面数据用于在前端接收动态数据，根据动态数据确
定数据变量集合得到当前数据集合，输入当前数据集合至页面生成方法生成目标节点树。
具体的，动态数据是显示页面前或显示页面后在展示端，即终端输入的数据或获
取对页面的操作通过逻辑改变的数据。页面的输入框或操作按钮与变量对应，从而将从输
入框输入的数据或操作按钮响应后得到的数据赋值给数据变量集合中的变量得到当前数
据集合，数据变量集合中的变量可为一个或多个，传递至脚本语言页面数据中的页面生成
方法，从而输出匹配的节点树，根据节点树渲染页面，动态的更新页面。由于在前端进行渲
染时，输出的节点树已经是从初始页面结构数据编译后的数据，不需要再进行解析就可直
接转换为描述视图的标准结构数据，快速生成对应的页面，提高了页面生成的速度。且可根
据动态数据实时更新页面，保留了页面的动态性。
在一个实施例中，节点树用于在前端变换生成描述视图的标准结构数据，以使得
前端根据标准结构数据显示节点树对应的页面。
具体的，根据节点树可快速获取父节点和各个父节点对应的子节点，根据节点间
的层次关系快速将节点树转换为描述视图的标准结构数据，如HTML(HyperText Markup
Language，超文本标记语言)语言数据，以使得前端根据标准结构数据显示节点树对应的页
面。
在一个实施例中，初始页面结构数据为子应用初始页面结构数据，用于描述运行
于操作系统上的母应用中的子应用页面结构。
具体的，子应用是依附于母应用运行的应用程序，可通过母应用下载、启动、运行、
关闭子应用。母应用可以是社交应用、专门支持子应用的专用应用、文件管理应用、邮件应
用或者游戏应用等。社交应用包括即时通信应用、SNS(Social Network Service，社交网
站)应用或者直播应用等。子应用则是可在母应用提供的环境中实现的应用，子应用具体可
以是社交应用、文件管理应用、邮件应用或者游戏应用等。每个子应用中的页面都有对应的
初始页面结构数据，用于描述子应用页面结构。由于每个子应用对应的初始页面结构数据
都会在服务器编译为脚本语言页面数据，初始页面结构数据即源码不会暴露在客户端，避
免子应用页面被仿造和篡改，提高了应用的安全性。
在一个实施例中，初始页面结构数据与子应用页面标识对应，方法还包括：建立初
始页面结构数据对应的脚本语言页面数据与子应用页面标识的关联关系，接收终端发送的
当前子应用页面标识，根据关联关系获取与当前子应用页面标识对应的目标脚本语言页面
数据，将目标脚本语言页面数据发送至终端。
具体的，由于每个子应用都可能存在多个页面，开发者在上传初始页面结构数据
时携带匹配的子应用页面标识，且生成初始页面结构数据对应的脚本语言页面数据后，建
立脚本语言页面数据与子应用页面标识的关联关系，从而便于子应用页面的展示终端通过
子应用页面标识下载对应的目标脚本语言页面数据，从而展示对应的页面。可以理解的是，
除了子应用页面标识，当服务器存储了多个子应用的初始页面结构数据时，初始页面结构
数据还包括匹配的子应用标识。
在一个实施例中，方法还包括：获取母应用对应的应用程序代码数据，将子应用初
始页面结构数据对应的脚本语言页面数据打包入应用程序代码数据中。
具体的，将子应用初始页面结构数据对应的脚本语言页面数据打包入母应用的应
用程序代码数据，用户在下载母应用时就可获取各个子应用的页面数据，从而展示对应的
子应用页面，可在母应用中直接打开子应用页面不需要跳转至浏览器，提高了页面展示的
便利性。且在展示子应用的各个页面时，页面数据已经存储在终端，不需要再从服务器通过
网络传输获取页面数据，提高了页面展示的效率。
在一个实施例中，如图9所示，提供了一种页面渲染的方法，应用于上述应用环境
中的终端来举例说明，包括以下步骤：
步骤S510，获取脚本语言页面数据，脚本语言页面数据包括页面生成方法，页面生
成方法的输入为数据变量集合，页面生成方法的输出为节点树。
具体的，脚本语言是一种解释性的编程语言，如JavaScript脚本语言或者
VBScript，对脚本语言的具体类型不作限定。脚本语言页面数据是脚本语言编写的用于描
述页面结构的数据，脚本语言页面数据由于是脚本语言，不存在扩展的自定义语法，客户端
可直接对其进行解析，如通过浏览器或webview等对其进行解析。
页面生成方法中包括了数据变量集合在不同逻辑条件下对应的页面生成方法片
段，从而能根据不同的数据变量集合满足的逻辑条件获取对应的目标页面生成方法片段，
根据目标页面生成方法片段输出对应的节点树。数据变量集合是页面展示过程中需要传递
至页面生成方法的所有变量的集合，在页面展示过程中，可通过对页面的操作获取动态数
据为数据变量集合中的变量赋值，从而更新页面，如通过对页面上的按钮的点击，获取按钮
绑定的当前数据，将页面展示的数据更新为当前数据。节点树是以标记语言或扩展标记语
言元素为节点，存在自上而下的父节点与子节点关系的树形数据结构。在前端可根据输入
自动输出匹配的节点树，由于节点树是已经解析完成的存在节点关系的数据结构，从而不
需要在终端再进行解析，在前端得到节点树时可直接转换为前端能解析的携带节点关系的
标准数据结构，从而快速的进行页面的渲染。页面数据采取脚本语言避免了页面每加载一
次就需要在前端对标记语言的自定义语法进行解析的问题，提高了页面展示的效率。
步骤S520，获取页面数据，根据页面数据确定数据变量集合得到当前数据集合，页
面生成方法根据当前数据集合输出对应的目标节点树，将目标节点树变换生成描述视图的
标准结构数据。
具体的，页面数据可以是默认数据，也可以是从当前运行的应用或浏览器中提取
的数据，如当前登录的用户名等，可包括一个或多个数据，也可以是事件响应后得到的响应
数据，并将页面数据分别与数据变量集合中的变量一一对应形成当前数据集合，将当前数
据集合传递至页面生成方法，根据当前数据集合满足的当前逻辑条件，获取对应的目标页
面生成方法片段，从而输出当前数据集合对应的目标节点树。再将目标节点树变换生成描
述视图的标准结构数据，如变换生成HTML数据。在一个具体的实施例中，在展示当前页面之
前，默认数据name为空，从而根据name输出的节点树为图10所示的节点树。
步骤S530，根据标准结构数据渲染显示对应的页面。
具体的，可直接解析标准结构数据显示对应的页面。如图11所示为显示的页面示
意图。
本实施例中，通过获取脚本语言页面数据，脚本语言页面数据包括页面生成方法，
页面生成方法的输入为数据变量集合，页面生成方法的输出为节点树，获取页面数据，根据
页面数据确定数据变量集合得到当前数据集合，页面生成方法根据当前数据集合输出对应
的目标节点树，将目标节点树变换生成描述视图的标准结构数据，根据标准结构数据渲染
显示对应的页面，客户端获取的是编译后的脚本语言页面数据，不需要终端每次页面加载
后再对扩展标记语言页面数据进行解析，提高了页面展示的效率，同时脚本语言页面数据
包括了页面生成方法，页面生成方法输出的节点树与输入的数据变量集合匹配，获取不同
的页面数据确定的数据变量集合对应的当前值也不同，从而得到不同的节点树，达到页面
的动态更新。
在一个实施例中，脚本语言页面数据为子应用脚本语言页面数据，用于描述运行
于操作系统上的母应用中的子应用页面结构。
具体的，子应用是依附于母应用运行的应用程序，可通过母应用下载、启动、运行、
关闭子应用。母应用可以是社交应用、专门支持子应用的专用应用、文件管理应用、邮件应
用或者游戏应用等。社交应用包括即时通信应用、SNS(Social Network Service，社交网
站)应用或者直播应用等。子应用则是可在母应用提供的环境中实现的应用，子应用具体可
以是社交应用、文件管理应用、邮件应用或者游戏应用等。每个子应用中的页面都有对应的
脚本语言页面数据，用于描述子应用页面结构。由于每个子应用对应的脚本语言页面数据
可为初始页面结构数据在服务器编译后生成的脚本语言数据，从而初始页面结构数据即源
码不会暴露在客户端，避免子应用页面被仿造和篡改，提高了应用的安全性。其中初始页面
结构数据是由扩展标记语言编写生成的，通过扩展标记语言生成的初始页面结构数据可通
过自定义的语法结构灵活方便的描述页面结构。
在一个实施例中，步骤S410包括：向服务器发送母应用下载请求，接收服务器返回
的母应用对应的应用程序代码数据，从应用程序代码数据中提取子应用脚本语言页面数
据。
具体的，脚本语言页面数据打包入母应用的应用程序代码数据，用户在下载母应
用时就可获取各个子应用的页面数据，从而展示对应的子应用页面，可在母应用中直接打
开子应用页面不需要跳转至浏览器，提高了页面展示的便利性。且在展示子应用的各个页
面时，页面数据已经存储在终端，不需要再从服务器通过网络传输获取页面数据，提高了页
面展示的效率。
在一个实施例中，步骤S410包括：向服务器发送页面数据获取请求，页面数据获取
请求携带当前子应用页面标识，以使服务器获取当前子应用页面标识对应的目标脚本语言
页面数据，接收服务器返回的脚本语言页面数据。
具体的，由于每个子应用都可能存在多个页面，服务器中可能存储了多个页面对
应的脚本语言页面数据，子应用页面的展示终端需要通过子应用页面标识下载对应的目标
脚本语言页面数据，从而展示对应的页面。可以理解的是，除了子应用页面标识，当服务器
存储了多个子应用的初始页面结构数据时，发送页面数据获取请求时还包括子应用标识，
以区分不同的子应用。通过页面数据获取请求中携带标识信息，可只下载需要展示的页面，
达到页面下载的灵活方便。
在一个实施例中，如图12所示，步骤S430之后，还包括：
步骤S610，获取对页面的触发事件，根据触发事件获取对应的事件响应数据。
具体的，每个触发事件都对应了匹配的事件响应，可先确定触发事件的事件类型，
进而采用页面逻辑代码中与该事件类型相匹配的逻辑代码处理该事件，得到相应的事件响
应数据。
步骤S620，根据事件响应数据将当前数据集合更新为第一数据集合，页面生成方
法根据第一数据集合输出对应的第一节点树。
具体的，可将事件响应数据与数据变量集合中的变量进行绑定，从而事件响应数
据与之前赋值数据不同时，绑定的变量会重新赋值为事件响应数据，从而当前数据集合更
新为第一数据集合，由于数据集合的变化导致页面生成方法输出更新的第一节点树。在一
个具体的实施例中，页面初次显示“hi，guest”，变量name为空，接收用户对按钮的点击事件
后，获取点击事件对应的事件响应，此事件响应为更新数据响应，将name从空变更为
“world”，其中变量name前存在字符串hello，从而输出的节点树中文本节点对应的是
“hello world”，如图13所示为更新后的第一节点树的示意图。
步骤S630，根据第一节点树更新显示页面。
具体的，节点树更新后得新进行渲染生成第一节点树对应的新的页面，完成页面
的动态更新。如图14所示，为一个具体的实施例中更新后的页面示意图。
本实施例中，事件对应的事件响应可根据需要自定义，从而通过事件的触发通过
预设逻辑更新数据变量的值，生成更新后的节点树，从而渲染新的页面，方便的更新页面。
在一个实施例中，如图15所示，提供了一种页面数据编译的装置，包括：
获取模块710，用于获取由扩展标记语言生成的初始页面结构数据。
编译模块720，用于解析初始页面结构数据进行代码渲染生成对应的脚本语言页
面数据，脚本语言页面数据包括页面生成方法，页面生成方法的输入为数据变量集合，页面
生成方法的输出为与输入匹配的节点树，脚本语言页面数据用于发送至终端，以使终端根
据所述脚本语言页面数据显示对应的页面。
在一个实施例中，如图16所示，编译模块720包括：
分词单元721，用于对初始页面结构数据进行分词得到分词元素组成的数组。
语法树生成单元722，用于根据所述数组生成以分词元素为节点的语法树。
页面生成方法生成单元723，用于提取所述语法树中的变量确定数据变量集合结
构，解析所述语法树进行代码渲染生成数据变量集合在不同逻辑条件下对应的页面生成方
法片段，根据所述页面生成方法片段生成所述页面生成方法。
在一个实施例中，页面生成方法生成单元723还用于对语法树进行后序遍历，获取
字符串表达式，对字符串表达式进行字符表达式分词获取其中的表达式，对表达式进行解
析并代码渲染生成所述页面生成方法片段中的表达式片段。
在一个实施例中，脚本语言页面数据用于在前端接收动态数据，根据动态数据确
定所述数据变量集合得到当前数据集合，输入当前数据集合至所述页面生成方法生成目标
节点树。
在一个实施例中，节点树用于在前端变换生成描述视图的标准结构数据，以使得
前端根据所述标准结构数据显示所述节点树对应的页面。
在一个实施例中，初始页面结构数据为子应用初始页面结构数据，用于描述运行
于操作系统上的母应用中的子应用页面结构。
在一个实施例中，如图17所示，装置还包括：
打包模块730，用于获取母应用对应的应用程序代码数据，将子应用初始页面结构
数据对应的脚本语言页面数据打包入应用程序代码数据中。
在一个实施例中，初始页面结构数据与子应用页面标识对应，如图18所示，装置还
包括：
关联关系建立模块740，用于建立初始页面结构数据对应的脚本语言页面数据与
所述子应用页面标识的关联关系。
发送模块750，用于接收终端发送的当前子应用页面标识，根据关联关系获取与当
前子应用页面标识对应的目标脚本语言页面数据，将目标脚本语言页面数据发送至终端。
在一个实施例中，如图19所示，提供了一种页面渲染的装置，包括：
获取模块810，用于获取脚本语言页面数据，脚本语言页面数据包括页面生成方
法，页面生成方法的输入为数据变量集合，页面生成方法的输出为节点树。
节点树输出模块820，用于获取页面数据，根据页面数据确定数据变量集合得到当
前数据集合，页面生成方法根据当前数据集合输出对应的目标节点树，将目标节点树变换
生成描述视图的标准结构数据。
渲染模块830，用于根据标准结构数据渲染显示对应的页面。
在一个实施例中，初始页面结构数据为子应用初始页面结构数据，用于描述运行
于操作系统上的母应用中的子应用页面结构。
在一个实施例中，获取模块810还用于向服务器发送母应用下载请求，接收服务器
返回的母应用对应的应用程序代码数据，从应用程序代码数据中提取子应用脚本语言页面
数据。
在一个实施例中，获取模块810还用于向服务器发送页面数据获取请求，页面数据
获取请求携带当前子应用页面标识，以使服务器获取所述当前子应用页面标识对应的目标
脚本语言页面数据，接收服务器返回的脚本语言页面数据。
在一个实施例中，如图20所示，装置还包括：
更新显示模块840，用于获取对页面的触发事件，根据触发事件获取对应的事件响
应数据，根据事件响应数据将当前数据集合更新为第一数据集合，页面生成方法根据第一
数据集合输出对应的第一节点树，根据第一节点树更新显示所述页面。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以
通过计算机程序来指令相关的硬件来完成，所述程序可存储于一计算机可读取存储介质
中，如本发明实施例中，该程序可存储于计算机系统的存储介质中，并被该计算机系统中的
至少一个处理器执行，以实现包括如上述各方法的实施例的流程。其中，所述存储介质可为
磁碟、光盘、只读存储记忆体(Read-Only Memory，ROM)或随机存储记忆体(Random Access
Memory，RAM)等。
以上所述实施例的各技术特征可以进行任意的组合，为使描述简洁，未对上述实
施例中的各个技术特征所有可能的组合都进行描述，然而，只要这些技术特征的组合不存
在矛盾，都应当认为是本说明书记载的范围。
以上所述实施例仅表达了本发明的几种实施方式，其描述较为具体和详细，但并
不能因此而理解为对发明专利范围的限制。应当指出的是，对于本领域的普通技术人员来
说，在不脱离本发明构思的前提下，还可以做出若干变形和改进，这些都属于本发明的保护
范围。因此，本发明专利的保护范围应以所附权利要求为准。