CN113139145A - 页面生成方法、装置、电子设备及可读存储介质 - Google Patents
页面生成方法、装置、电子设备及可读存储介质 Download PDFInfo
- Publication number
- CN113139145A CN113139145A CN202110514007.5A CN202110514007A CN113139145A CN 113139145 A CN113139145 A CN 113139145A CN 202110514007 A CN202110514007 A CN 202110514007A CN 113139145 A CN113139145 A CN 113139145A
- Authority
- CN
- China
- Prior art keywords
- chart
- data
- initial
- syntax tree
- data set
- 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.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 50
- 239000011159 matrix material Substances 0.000 claims description 22
- 238000004590 computer program Methods 0.000 claims description 15
- 239000000284 extract Substances 0.000 claims description 7
- 238000004364 calculation method Methods 0.000 claims description 5
- 238000001914 filtration Methods 0.000 claims 1
- 238000010586 diagram Methods 0.000 abstract description 30
- 238000013461 design Methods 0.000 abstract description 10
- 238000000605 extraction Methods 0.000 abstract 1
- 230000006870 function Effects 0.000 description 15
- 230000008569 process Effects 0.000 description 13
- 238000004891 communication Methods 0.000 description 8
- 238000009877 rendering Methods 0.000 description 8
- 230000005540 biological transmission Effects 0.000 description 7
- 238000004422 calculation algorithm Methods 0.000 description 7
- 238000007726 management method Methods 0.000 description 5
- 238000012545 processing Methods 0.000 description 5
- 238000004458 analytical method Methods 0.000 description 4
- 238000003491 array Methods 0.000 description 4
- 230000000694 effects Effects 0.000 description 4
- 238000011161 development Methods 0.000 description 3
- 230000006978 adaptation Effects 0.000 description 2
- 230000003044 adaptive effect Effects 0.000 description 2
- 230000008878 coupling Effects 0.000 description 2
- 238000010168 coupling process Methods 0.000 description 2
- 238000005859 coupling reaction Methods 0.000 description 2
- 238000013079 data visualisation Methods 0.000 description 2
- 239000004973 liquid crystal related substance Substances 0.000 description 2
- 230000003287 optical effect Effects 0.000 description 2
- 238000013500 data storage Methods 0.000 description 1
- 238000001514 detection method Methods 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
- 230000007246 mechanism Effects 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 230000002093 peripheral effect Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/951—Indexing; Web crawling techniques
-
- 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/455—Emulation; Interpretation; Software simulation, e.g. virtualisation or emulation of application or operating system execution engines
- G06F9/45504—Abstract machines for programme code execution, e.g. Java virtual machine [JVM], interpreters, emulators
- G06F9/45529—Embedded in an application, e.g. JavaScript in a Web browser
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- Databases & Information Systems (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- Document Processing Apparatus (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明涉及UI设计领域,揭露一种页面生成方法,包括:根据网页生成请求信息获取网页数据并解析,得到对应的文档对象模型;将文档对象模型转换为抽象语法树,并对抽象语法树进行数据解耦,得到初始抽象语法树;根据初始抽象语法树进行图表数据索引抽取,得到缓存图表数据;根据初始图表数据集与缓存图表数据集进行差异数据替换,得到图表补丁数据;将图表补丁数据与缓存图表数据集结合,并根据结合后的数据、初始抽象语法树及网页生成请求信息生成网页;并将网页发送至终端设备。本发明还涉及一种区块链技术,所述缓存图表数据可以存储在区块链节点中。本发明还提出一种页面生成装置、电子设备以及存储介质。本发明可以提高页面生成的速度。
Description
技术领域
本发明涉及UI设计领域,尤其涉及一种页面生成方法、装置、电子设备及可读存储介质。
背景技术
随着互联网的发展,人们使用浏览器的时间越来越长,因此网页的加载速度,页面的流畅度,成为影响人们浏览体验的重要因素,也越来越受到人们的重视。
但是,目前的HTML网页数据中存留着大量的内联Css和内联Javascript,导致需要通过内联Css和内联Javascript对DOM(文档对象模型)元素进行操作会极大的消耗页面性能,同时现有的网页在进行加载时,如果需要加载图表则需要获取对应的图表数据进行渲染,因此页面生成的速度较慢。
发明内容
本发明提供一种页面生成方法、装置、电子设备及计算机可读存储介质,其主要目的在于提高页面生成的速度。
为实现上述目的,本发明提供的一种页面生成方法,包括:
接收到终端设备发送的网页生成请求信息时,根据所述网页生成请求信息获取网页数据,对所述网页数据进行解析,得到对应的文档对象模型;
将所述文档对象模型转换为抽象语法树,并对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树;
从所述初始抽象语法树中抽取出初始图表语法树,根据所述初始图表语法树进行图表数据索引,得到缓存图表数据;
获取所述初始图表语法树对应的图表数据,得到初始图表数据集,计算所述初始图表数据集与所述缓存图表数据集之间的最长公共子序列;
根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据;
将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集;
根据所述初始抽象语法树、所述网页生成请求信息及所述待渲染图表数据集生成网页;
将所述生成的网页发送至所述终端设备。
可选地,所述对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树,包括:
遍历所述抽象语法树中的所有节点,标记所述抽象语法树中包含style字段或javascript字段的节点作为目标节点;
从所述目标节点中将所述style字段对应的值及所述javascript字段对应的值剥离,得到目标值;
根据所有所述目标值利用预设规则对所述抽象语法树进行更新构建,得到所述初始抽象语法树。
可选地,所述根据所有所述目标值利用预设规则对所述抽象语法树进行更新构建,得到所述初始抽象语法树,包括:
将所述style字段对应的值与所述预设样式表进行组合,得到目标样式表;
将所述所述javascript字段对应的值与所述预设脚本进行组合,得到目标脚本;
将所述目标样式表及所述目标脚本填入对应的目标节点,得到所述初始抽象语法树。
可选地,所述获取所述初始图表语法树对应的图表数据,得到初始图表数据集,包括:
提取所述初始图表语法树的图表数据网址;
访问所述图表数据网址中的图表数据,得到所述初始图表数据集。
可选地,所述计算所述初始图表数据集与所述缓存图表数据集对应的最长公共子序列,包括:
分别计算所述初始图表数据集及所述缓存图表数据集中每行数据的字符长度,得到初始图表长度及缓存图表长度;
根据所述初始图表长度及所述缓存图表长度,生成图表字符矩阵;
对所述图表字符矩阵进行索引编号标记,得到固定字符矩阵;
计算所述固定字符矩阵除第一维度外其他维度的数据大小,得到所述最长公共子序列。
可选地,所述根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据,包括:
根据所述初始图表数据集与所述缓存图表数据集中各图表字符在所述最长公共子序列中出现的序列位置,确定数据差异,其中所述数据差异包括重合字符及非重合字符;
根据所述重合字符、所述非重合字符及预设的替换字符,替换所述最长公共子序列,得到所述图表补丁数据。
可选地,所述根据所述初始图表语法树进行图表数据索引,得到缓存图表数据,包括:
提取所述初始图表语法树中图表数据对应的HTTP协议;
解析所述HTTP协议的请求头部字段;
根据所述请求头部字段及预设缓存路径构建索引路径,根据所述索引路径在预设的存储设备中进行数据检索,得到所述缓存图表数据。
为了解决上述问题,本发明还提供一种页面生成装置,所述装置包括:
数据解耦模块,用于接收到终端设备发送的网页生成请求信息时,根据所述网页生成请求信息获取网页数据,对所述网页数据进行解析,得到对应的文档对象模型;将所述文档对象模型转换为抽象语法树,并对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树;
差异数据计算模块,从所述初始抽象语法树中抽取出初始图表语法树,根据所述初始图表语法树进行图表数据索引,得到缓存图表数据;获取所述初始图表语法树对应的图表数据,得到初始图表数据集,计算所述初始图表数据集与所述缓存图表数据集之间的最长公共子序列;根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据;
页面生成模块,用于将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集;根据所述初始抽象语法树、所述网页生成请求信息及所述待渲染图表数据集生成网页。
为了解决上述问题,本发明还提供一种电子设备,所述电子设备包括:
存储器,存储至少一个计算机程序;及
处理器,执行所述存储器中存储的计算机程序以实现上述所述的页面生成方法。
为了解决上述问题,本发明还提供一种计算机可读存储介质,所述计算机可读存储介质中存储有至少一个计算机程序,所述至少一个计算机程序被电子设备中的处理器执行以实现上述所述的页面生成方法。
本发明实施例通过根据所述网页生成请求信息获取网页数据,对所述网页数据进行解析,得到对应的文档对象模型;将所述文档对象模型转换为抽象语法树,并对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树,通过对内联Css及内联Javascript进行解耦降低了页面性能消耗,提升了页面生成速度;从所述初始抽象语法树中抽取出初始图表语法树,根据所述初始图表语法树进行图表数据索引,得到缓存图表数据;计算所述初始图表数据集与所述缓存图表数据集之间的最长公共子序列;根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据;将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集;根据所述初始抽象语法树、所述网页生成请求信息及所述待渲染图表数据集生成网页,通过计算所述初始图表数据集与所述缓存图表数据集的差异数据,提高了图表数据的获取速度,进而加快了页面生成速度;将所述生成的网页发送至所述终端设备。因此本发明实施例提出的页面生成方法、装置、电子设备及可读存储介质提高了页面生成的速度。
附图说明
图1为本发明一实施例提供的页面生成方法的流程示意图;
图2为本发明一实施例提供的页面生成装置的模块示意图;
图3为本发明一实施例提供的实现页面生成方法的电子设备的内部结构示意图;
本发明目的的实现、功能特点及优点将结合实施例,参照附图做进一步说明。
具体实施方式
应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。
本发明实施例提供一种页面生成方法。所述页面生成方法的执行主体包括但不限于服务端、终端等能够被配置为执行本申请实施例提供的该方法的电子设备中的至少一种。换言之,所述页面生成方法可以由安装在终端设备或服务端设备的软件或硬件来执行,所述软件可以是区块链平台。所述服务端包括但不限于:单台服务器、服务器集群、云端服务器或云端服务器集群等。
参照图1所示的本发明一实施例提供的页面生成方法的流程示意图,在本发明实施例中,所述页面生成方法包括:
S1、接收到终端设备发送的网页生成请求信息时,根据所述网页生成请求信息获取网页数据,对所述网页数据进行解析,得到对应的文档对象模型;
本发明实施例中,所述网页生成请求信息是指终端设备发出的需要加载的网页的请求,包括客户端信息、待生成的网页的标签及网址信息。其中,所述标签为待生成网页的类型标签,如:电脑网页或者手机网页等,所述终端设备包括:手机、电脑、平板等智能终端设备。
进一步地,本发明实施例提取所述网页生成请求信息中的网址信息,根据所述网址信息爬取所述网址信息对应的网页中的HTML数据,得到所述网页数据。
进一步地,为了让网页数据更加清晰的呈现,本发明实施例利用预设的解析器对所述网页数据进行HTML解析,得到对应的文档对象模型。可选地,所述解析器可以为JDom解析器。具体的:所述网页数据中的HTML数据是由很多标签组成的,例如,所述标签可以包括<html>、<head>、<body>、<div>、<span>等。这些标签是嵌套的,一层套一层,例如<html>套<body>、<body>套<div>、<div>套<span>等。本发明实施例在执行HTML解析的时候,可以一层一层进行解析,把每个标签抽象成代码对象,得到对应的文档对象模型(Document ObjectModel,简称DOM)。其中,所述文档对象模型包括所述网页数据的标签和多层节点,例如,HTML数据中标签<html>为文档对象模型的根节点,HTML数据中的标签<body>为<html>的子节点等。
S2、将所述文档对象模型转换为抽象语法树,并对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树。
本发明实施例中对所述网页数据进行解析,得到对应的文档对象模型之后,可以将文档对象模型转换为抽象语法树(Abstract Syntax Tree,简称AST)。所述文档对象模型转换为抽象语法树,可以理解为,把文档对象模型多层节点进行逐层拆分,按节点属性拆分为一个个模块,并把各个模块用js对象表述出来。其中,所述抽象语法树包括HTML数据的对象和多层节点。
具体地,所述将所述文档对象模型转换为抽象语法树,包括:
步骤A、遍历所述文档对象模型中每层节点的子元素,得到每层节点对应的标签数组。
其中,所述标签数组可以包括每层节点的子元素、每层节点的子元素的标签及每层节点的子元素的属性;
步骤B、对每层节点的标签数组进行语义分析;
其中,所述语义分析包括:对每层节点的标签数组进行正则匹配得到每层节点的对象数组。所述对象数组为json格式,可以包括标签名(tagName)、标签id、标签样式类(class)、标签行内样式(style)、标签属性(attr),等。例如,{‘tagName’:‘xxx’,‘id’:‘xxx’,‘className’:‘xxx’,‘style’:‘xxx’,‘attr’:‘xxx’…}。
步骤C、根据每层节点对应的对象数组确定多层节点的对应的对象数组,从而将所述文档对象模型转换成为抽象语法树。
可选地,本发明实施例为了让标签被更多的浏览器兼容实现,还可以对预设种类的标签做标签兼容处理。例如,对于标签<input>,由于该标签自带的属性,每个浏览器对该标签的实现方式是不一样的,可以对该标签加一个兼容前缀,使得该标签可以兼容各个浏览器。
进一步地,为了降低所述抽象语法树中的耦合度,本发明实施例对所述抽象语法树中的内联Css及内联Javascript进行解耦。详细地,在对所述抽象语法树中的内联Css及内联Javascript进行解耦时,本发明实施例遍历所述抽象语法树中的所有节点,标记所述抽象语法树中包含style字段或javascript字段的节点作为目标节点,其中,所述目标节点是包含内联Css及内联Javascript的节点。可选地,本发明实施例中所述style字段对应内联Css属性;所述javascript字段对应内联Javascript属性。
进一步地,为了对所述抽象语法树中的内联Css及内联Javascript解耦,本发明实施例从所述目标节点中将所述style字段对应的值及所述javascript字段对应的值剥离,得到目标值;利用预设规则对所述抽象语法树进行更新构建,得到初始抽象语法树。
进一步地,本发明实施例中,根据所述目标值利用预设规则对所述抽象语法树进行更新构建,得到初始抽象语法树,包括:将所述style字段对应的值与所述预设样式表进行组合,得到目标样式表;将所述所述javascript字段对应的值与所述预设脚本进行组合,得到目标脚本;将所述目标样式表及所述目标脚本填入对应的目标节点,得到所述初始抽象语法树。可选地,本发明实施例中所述预设样式表为<style></style>样式表,所述预设脚本为<script></script>脚本,例如:所述style字段对应的值为color:#000,那么所述目标样式表为<style>.uuid{color:#000}</style>;所述javascript字段对应的值为alert(‘123’),那么目标脚本为<script>document.getElementsByClassName('uuid').onClick=function(){alert(‘123’)}</script>。
S4、从所述初始抽象语法树中抽取出初始图表语法树,根据所述初始图表语法树进行图表数据索引,得到缓存图表数据;
由于执行页面生成过程中,除上述标签、多层节点外,常需要调用庞大的数据生成图表,而在利用图表进行数据可视化展示的过程中,图表所绑定的数据规模也不容小觑,并且对于一些绑定大量数据的复杂图表,在每次图表更新的过程中,均需提供数据,并通过网络传输再次进行图表渲染绘制。
但对于其中的一部分图表来说,更新后的数据相比原始数据只改变了某个字段下的几个数值,即便如此也需要重新执行整个数据传输,因此这种大规模数据的频繁传输势必会引起资源下载时间过长,从而导致图表加载非常缓慢,甚至出现卡顿。
故本发明较佳实施例中,在执行所述S4之前,还包括:
判断所述初始抽象语法树中是否包括图表语法树;
进一步地,当所述初始抽象语法树中不包括图表语法树时,可直接利用所述初始抽象语法树与所述网页生成请求信息进行页面设置生成目标网页。
当所述初始抽象语法树中包括图表语法树时,进一步地抽取出图表语法树,得到所述初始图表语法树。
进一步地,所述根据所述初始图表语法树进行图表数据索引,得到缓存图表数据,包括:
提取所述初始图表语法树中图表数据对应的HTTP协议;
从所述HTTP协议中索引出预先加载至浏览器中的所述缓存图表数据。
详细地,所述从所述HTTP协议中索引出预先加载至浏览器中的所述缓存图表数据,包括:
解析所述HTTP协议的请求头部字段;
根据所述请求头部字段及预设缓存路径构建索引路径,根据所述索引路径在预设的存储设备中进行数据检索,得到所述缓存图表数据。
例如:所述HTTP协议的请求头部字段为INetCache,所述缓存路径为C:\Users\AppData\Local\Microsoft\Windows,那么索引路径为C:\Users\AppData\Local\Microsoft\Windows\INetCache。可选地,所述预设的存储设备可以为所述终端设备的硬盘。
本发明另一实施例中,利用区块链高吞吐的特性,将所述缓存图表数据加入区块链节点中,提高数据的存取效率。
S5、获取所述初始图表语法树对应的图表数据,得到初始图表数据集,计算所述初始图表数据集与所述缓存图表数据集对应的最长公共子序列;
本发明较佳实施例中,为了判断初始图表语法树对应的图表数据与上述浏览器中的缓存图表数据的差异性,需先获取出初始图表语法树对应的图表数据。
详细地,所述获取所述初始图表语法树对应的图表数据,得到初始图表数据集,包括:
提取所述初始图表语法树的图表数据网址;
访问所述图表数据网址中的图表数据,得到所述初始图表数据集。
需注意的是,本发明实施例中,仅通过图表数据网址访问所述初始图表数据集,并不执行下载、图表渲染等操作,访问所述初始图表数据集的目的,仅在于计算与所述缓存图表数据集对应的最长公共子序列。
详细地,所述计算所述初始图表数据集与所述缓存图表数据集对应的最长公共子序列,包括:
分别计算所述初始图表数据集及所述缓存图表数据集中每行数据的字符长度,得到初始图表长度及缓存图表长度;
根据所述初始图表长度及所述缓存图表长度,生成图表字符矩阵;
对所述图表字符矩阵进行索引编号标记,得到固定字符矩阵;
计算所述固定字符矩阵除第一维度外其他维度的数据大小,得到所述最长公共子序列。
本发明实施例中,如所述初始图表数据集及所述缓存图表数据集中每行数据的字符长度分别为m和n,进一步地,按照(m+1)*(n+1)的形式,构建得到所述图表字符矩阵。
另外,为了防止后续获取方便,将所述图表字符矩阵中第一维度(即第一行和第一列)均设置为索引编号,如1、2、3、…、m+1及1、2、3、…、n+1。
进一步地,根据如下公式,计算所述固定字符矩阵其他维度的数据大小:
其中,xi表示所述初始图表数据集第i个图表字符,yi表示所述缓存图表数据集第i个图表字符,C[i][j]表示所述最长公共子序列中第i行第j列的图表字符。
S6、根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据;
本发明实施例中,通过所述最长公共子序列,可对比出所述初始图表数据集与所述缓存图表数据集的字符差异,其中字符差异即组成所述补丁数据。
详细地,所述根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据,包括:
根据所述初始图表数据集与所述缓存图表数据集中各图表字符在所述最长公共子序列中出现的序列位置,确定数据差异,其中所述数据差异包括重合字符及非重合字符;
根据所述重合字符、所述非重合字符及预设的替换字符,替换所述最长公共子序列,得到所述图表补丁数据。
本发明实例中,所述非重合字符还包括新增字符和删除字符,如所述最长公共子序列如下所示:
若C[i][j]中的图表字符在所述初始图表数据集与所述缓存图表数据集中均出现,则C[i][j]为重合字符,若C[i][j]中的图表字符在所述初始图表数据集中出现,但未在所述缓存图表数据集中出现,则C[i][j]为新增字符,若C[i][j]中的图表字符在所述初始图表数据集中未出现,但在所述缓存图表数据集中出现,则C[i][j]为删除字符。
进一步地,本发明实施例中,预设的替换字符可用+1、-1、0表示,如可用+1表示所述新增字符,-1表示所述删除字符,0表示所述重合字符,并执行替换操作,得到所述图表补丁数据,如图表补丁数据可能如下所示:
S7、将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集;
详细地,所述将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集包括:利用预设算法将所述图表补丁数据与所述缓存图表数据集进行归并,得到所述待渲染图表数据集。可选地,所述预设算法为归并排序算法。
S8、根据所述初始抽象语法树、所述网页生成请求信息及所述待渲染图表数据集进行网页生成,得到目标网页。
本发明实施例中得到所述初始抽象语法树之后,为了可以准确的显示在所述网页生成请求信息对应的终端设备上,可以根据初始抽象语法树与所述网页生成请求信息进行页面属性设置生成目标抽象语法树。可选地,本发明实施例中可以先设置初始抽象语法树的根节点的字体尺寸属性,再根据多层节点对应的对象数组和初始抽象语法树的根节点的字体尺寸属性生成目标抽象语法树。
本发明实施例可以提取所述网页生成请求信息中的终端显示信息,所述终端显示信息包括:终端设备的屏幕宽度和最佳网页显示的设计稿宽度,例如,终端设备的屏幕宽度为320px,最佳网页显示的设计稿宽度为640px。
本发明实施例根据所述网页生成请求信息设置初始抽象语法树中的根节点的字体尺寸属性,具体的:
可以提取所述网页生成请求信息中的最佳网页显示的设计稿宽度值与预设属性值之间的比值作为相对宽度,提取所述网页生成请求信息中的终端设备屏幕宽度值与相对宽度之间的比值作为初始抽象语法树的元素内容中的根节点的字体尺寸属性。其中,元素内容可以为所述网页数据中的的HTML数据,根节点可以为HTML数据中根元素<html>,字体尺寸属性可以为根元素<html>的font-size属性。
例如,最佳网页显示的设计稿宽度为640px,预设属性值为100px,终端设备的屏幕宽度为320px,则相对宽度为640px/100px=6.4rem,将初始抽象语法树元素内容中的根节点的字体尺寸属性设置为320px/6.4rem=50px。
可选的,在HTML5开发过程中,为了让网页能适配不同尺寸的移动终端设备,让设计稿在不同尺寸的移动设备上展示效果一致,一般使用rem自适应布局,rem是CSS3的一个相对单位,就是相对于根元素<html>的font-size来做计算,例如根元素<html>设置的font-size=12px,非根元素设置width=2rem,则2rem换算成px单位就是24px。利用rem的特性,在移动端HTML5的开发过程中,用javascript按照一定的规则容易动态设置<html>的font-size,从而可以看出,能够以rem为单位实现适配效果。
本发明实施例根据所述网页生成请求信息设置初始抽象语法树中的根节点的字体尺寸属性之后,可以根据多层节点对应的对象数组和初始抽象语法树的根节点的字体尺寸属性生成目标抽象语法树。
详细地,本发明实施例为了将所述抽象语法树转换成可以正常观看和使用的网页,需要对所述目标抽象语法树进行渲染处理。
具体的,可以采用前序深度遍历的方式遍历目标抽象语法树,提取目标抽象语法树中的基本节点,若在基本节点出现连续短文本的链接节点或文本节点,则将短文本的链接节点横向排列,中间以空格隔开,<table>标签对应的节点有其固定的格式,可以不对<table>标签对应的节点进行切割,直接将<table>标签对应的节点作为一个基本节点,利用预设的渲染函数对所有的基本节点进行渲染,生成网页。可选地,本发明实施例中所述渲染函数为render函数。
进一步地,当所述初始抽象语法树包括所述初始图表语法树时,表示在执行目标页面生成时,还需要访问图表所绑定的数据,因此,为了加快图表在所述目标页面的渲染生成过程,不需直接访问图表所绑定的数据,直接利用所述待渲染图表数据集即可快速渲染出图表,并加载至所述生成的网页中。
S9、将所述目标网页发送至所述终端设备。
详细地,本发明实施例根据所述网页生成请求信息中的终端设备标识信息,可选地,所述终端设备标识信息为终端设备的ip地址,进一步地,本发明实施例根据所述网页生成请求信息中的终端设备标识信息将所述目标网页发送至对应的终端设备。
如图2所示,是本发明页面生成装置的功能模块图。
本发明所述页面生成装置100可以安装于电子设备中。根据实现的功能,所述页面生成装置可以包括数据解耦模块101、差异数据计算模块102、页面生成模块103,本发所述模块也可以称之为单元,是指一种能够被电子设备处理器所执行,并且能够完成固定功能的一系列计算机程序段,其存储在电子设备的存储器中。
在本实施例中,关于各模块/单元的功能如下:
所述数据解耦模块101用于接收到终端设备发送的网页生成请求信息时,根据所述网页生成请求信息获取网页数据,对所述网页数据进行解析,得到对应的文档对象模型;将所述文档对象模型转换为抽象语法树,并对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树;
本发明实施例中,所述网页生成请求信息是指终端设备发出的需要加载的网页的请求,包括客户端信息、待生成的网页的标签及网址信息。其中,所述标签为待生成网页的类型标签,如:电脑网页或者手机网页等,所述终端设备包括:手机、电脑、平板等智能终端设备。
进一步地,本发明实施例所述数据解耦模块101提取所述网页生成请求信息中的网址信息,根据所述网址信息爬取所述网址信息对应的网页中的HTML数据,得到所述网页数据。
进一步地,为了让网页数据更加清晰的呈现,本发明实施例所述数据解耦模块101利用预设的解析器对所述网页数据进行HTML解析,得到对应的文档对象模型。可选地,所述解析器可以为JDom解析器。具体的:所述网页数据中的HTML数据是由很多标签组成的,例如,所述标签可以包括<html>、<head>、<body>、<div>、<span>等。这些标签是嵌套的,一层套一层,例如<html>套<body>、<body>套<div>、<div>套<span>等。本发明实施例在执行HTML解析的时候,可以一层一层进行解析,把每个标签抽象成代码对象,得到对应的文档对象模型(Document Object Model,简称DOM)。其中,所述文档对象模型包括所述网页数据的标签和多层节点,例如,HTML数据中标签<html>为文档对象模型的根节点,HTML数据中的标签<body>为<html>的子节点等。
本发明实施例中所述数据解耦模块101对所述网页数据进行解析,得到对应的文档对象模型之后,可以将文档对象模型转换为抽象语法树(Abstract Syntax Tree,简称AST)。所述文档对象模型转换为抽象语法树,可以理解为,把文档对象模型多层节点进行逐层拆分,按节点属性拆分为一个个模块,并把各个模块用js对象表述出来。其中,所述抽象语法树包括HTML数据的对象和多层节点。
具体地,所述数据解耦模块101将所述文档对象模型转换为抽象语法树,包括:
步骤A、遍历所述文档对象模型中每层节点的子元素,得到每层节点对应的标签数组。
其中,所述标签数组可以包括每层节点的子元素、每层节点的子元素的标签及每层节点的子元素的属性;
步骤B、对每层节点的标签数组进行语义分析;
其中,所述语义分析包括:对每层节点的标签数组进行正则匹配得到每层节点的对象数组。所述对象数组为json格式,可以包括标签名(tagName)、标签id、标签样式类(class)、标签行内样式(style)、标签属性(attr),等。例如,{‘tagName’:‘xxx’,‘id’:‘xxx’,‘className’:‘xxx’,‘style’:‘xxx’,‘attr’:‘xxx’…}。
步骤C、根据每层节点对应的对象数组确定多层节点的对应的对象数组,从而将所述文档对象模型转换成为抽象语法树。
可选地,本发明实施例所述数据解耦模块101为了让标签被更多的浏览器兼容实现,还可以对预设种类的标签做标签兼容处理。例如,对于标签<input>,由于该标签自带的属性,每个浏览器对该标签的实现方式是不一样的,可以对该标签加一个兼容前缀,使得该标签可以兼容各个浏览器。
进一步地,为了降低所述抽象语法树中的耦合度,本发明实施例中所述数据解耦模块101对所述抽象语法树中的内联Css及内联Javascript进行解耦。详细地,在对所述抽象语法树中的内联Css及内联Javascript进行解耦时,本发明实施例所述数据解耦模块101遍历所述抽象语法树中的所有节点,标记所述抽象语法树中包含style字段或javascript字段的节点作为目标节点,其中,所述目标节点是包含内联Css及内联Javascript的节点。可选地,本发明实施例中所述style字段对应内联Css属性;所述javascript字段对应内联Javascript属性。
进一步地,为了对所述抽象语法树中的内联Css及内联Javascript解耦,本发明实施例所述数据解耦模块101从所述目标节点中将所述style字段对应的值及所述javascript字段对应的值剥离,得到目标值;利用预设规则对所述抽象语法树进行更新构建,得到初始抽象语法树。
进一步地,本发明实施例中,所述数据解耦模块101根据所述目标值利用预设规则对所述抽象语法树进行更新构建,得到初始抽象语法树,包括:将所述style字段对应的值与所述预设样式表进行组合,得到目标样式表;将所述所述javascript字段对应的值与所述预设脚本进行组合,得到目标脚本;将所述目标样式表及所述目标脚本填入对应的目标节点,得到所述初始抽象语法树。可选地,本发明实施例中所述预设样式表为<style></style>样式表,所述预设脚本为<script></script>脚本,例如:所述style字段对应的值为color:#000,那么所述目标样式表为<style>.uuid{color:#000}</style>;所述javascript字段对应的值为alert(‘123’),那么目标脚本为<script>document.getElementsByClassName('uuid').onClick=function(){alert(‘123’)}</script>。
所述差异数据计算模块102从所述初始抽象语法树中抽取出初始图表语法树,根据所述初始图表语法树进行图表数据索引,得到缓存图表数据;获取所述初始图表语法树对应的图表数据,得到初始图表数据集,计算所述初始图表数据集与所述缓存图表数据集之间的最长公共子序列;根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据;
由于执行页面生成过程中,除上述标签、多层节点外,常需要调用庞大的数据生成图表,而在利用图表进行数据可视化展示的过程中,图表所绑定的数据规模也不容小觑,并且对于一些绑定大量数据的复杂图表,在每次图表更新的过程中,均需提供数据,并通过网络传输再次进行图表渲染绘制。
但对于其中的一部分图表来说,更新后的数据相比原始数据只改变了某个字段下的几个数值,即便如此也需要重新执行整个数据传输,因此这种大规模数据的频繁传输势必会引起资源下载时间过长,从而导致图表加载非常缓慢,甚至出现卡顿。
故本发明较佳实施例中,在执行所述S4之前,还包括:
判断所述初始抽象语法树中是否包括图表语法树;
进一步地,当所述初始抽象语法树中不包括图表语法树时,可直接利用所述初始抽象语法树与所述网页生成请求信息进行页面设置生成目标网页。
当所述初始抽象语法树中包括图表语法树时,进一步地抽取出图表语法树,得到所述初始图表语法树。
进一步地,所述根据所述初始图表语法树进行图表数据索引,得到缓存图表数据,包括:
提取所述初始图表语法树中图表数据对应的HTTP协议;
从所述HTTP协议中索引出预先加载至浏览器中的所述缓存图表数据。
详细地,所述从所述HTTP协议中索引出预先加载至浏览器中的所述缓存图表数据,包括:
解析所述HTTP协议的请求头部字段;
根据所述请求头部字段及预设缓存路径构建索引路径,根据所述索引路径在预设的存储设备中进行数据检索,得到所述缓存图表数据。
例如:所述HTTP协议的请求头部字段为INetCache,所述缓存路径为C:\Users\AppData\Local\Microsoft\Windows,那么索引路径为C:\Users\AppData\Local\Microsoft\Windows\INetCache。可选地,所述预设的存储设备可以为所述终端设备的硬盘。
本发明另一实施例中,利用区块链高吞吐的特性,将所述缓存图表数据加入区块链节点中,提高数据的存取效率。
本发明较佳实施例中,为了判断初始图表语法树对应的图表数据与上述浏览器中的缓存图表数据的差异性,需先获取出初始图表语法树对应的图表数据。
详细地,所述获取所述初始图表语法树对应的图表数据,得到初始图表数据集,包括:
提取所述初始图表语法树的图表数据网址;
访问所述图表数据网址中的图表数据,得到所述初始图表数据集。
需注意的是,本发明实施例中,仅通过图表数据网址访问所述初始图表数据集,并不执行下载、图表渲染等操作,访问所述初始图表数据集的目的,仅在于计算与所述缓存图表数据集对应的最长公共子序列。
详细地,所述计算所述初始图表数据集与所述缓存图表数据集对应的最长公共子序列,包括:
分别计算所述初始图表数据集及所述缓存图表数据集中每行数据的字符长度,得到初始图表长度及缓存图表长度;
根据所述初始图表长度及所述缓存图表长度,生成图表字符矩阵;
对所述图表字符矩阵进行索引编号标记,得到固定字符矩阵;
计算所述固定字符矩阵除第一维度外其他维度的数据大小,得到所述最长公共子序列。
本发明实施例中,如所述初始图表数据集及所述缓存图表数据集中每行数据的字符长度分别为m和n,进一步地,按照(m+1)*(n+1)的形式,构建得到所述图表字符矩阵。
另外,为了防止后续获取方便,将所述图表字符矩阵中第一维度(即第一行和第一列)均设置为索引编号,如1、2、3、…、m+1及1、2、3、…、n+1。
进一步地,根据如下公式,计算所述固定字符矩阵其他维度的数据大小:
其中,xi表示所述初始图表数据集第i个图表字符,yi表示所述缓存图表数据集第i个图表字符,C[i][j]表示所述最长公共子序列中第i行第j列的图表字符。
本发明实施例中,通过所述最长公共子序列,可对比出所述初始图表数据集与所述缓存图表数据集的字符差异,其中字符差异即组成所述补丁数据。
详细地,所述根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据,包括:
根据所述初始图表数据集与所述缓存图表数据集中各图表字符在所述最长公共子序列中出现的序列位置,确定数据差异,其中所述数据差异包括重合字符及非重合字符;
根据所述重合字符、所述非重合字符及预设的替换字符,替换所述最长公共子序列,得到所述图表补丁数据。
本发明实例中,所述非重合字符还包括新增字符和删除字符,如所述最长公共子序列如下所示:
若C[i][j]中的图表字符在所述初始图表数据集与所述缓存图表数据集中均出现,则C[i][j]为重合字符,若C[i][j]中的图表字符在所述初始图表数据集中出现,但未在所述缓存图表数据集中出现,则C[i][j]为新增字符,若C[i][j]中的图表字符在所述初始图表数据集中未出现,但在所述缓存图表数据集中出现,则C[i][j]为删除字符。
进一步地,本发明实施例中,预设的替换字符可用+1、-1、0表示,如可用+1表示所述新增字符,-1表示所述删除字符,0表示所述重合字符,并执行替换操作,得到所述图表补丁数据,如图表补丁数据可能如下所示:
所述页面生成模块103用于将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集;根据所述初始抽象语法树、所述网页生成请求信息及所述待渲染图表数据集生成网页。
详细地,所述页面生成模块103将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集包括:利用预设算法将所述图表补丁数据与所述缓存图表数据集进行归并,得到所述待渲染图表数据集。可选地,所述预设算法为归并排序算法。
本发明实施例中得到所述初始抽象语法树之后,为了可以准确的显示在所述网页生成请求信息对应的终端设备上,所述页面生成模块103可以根据初始抽象语法树与所述网页生成请求信息进行页面属性设置生成目标抽象语法树。可选地,本发明实施例中可以先设置初始抽象语法树的根节点的字体尺寸属性,再根据多层节点对应的对象数组和初始抽象语法树的根节点的字体尺寸属性生成目标抽象语法树。
本发明实施例所述页面生成模块103可以提取所述网页生成请求信息中的终端显示信息,所述终端显示信息包括:终端设备的屏幕宽度和最佳网页显示的设计稿宽度,例如,终端设备的屏幕宽度为320px,最佳网页显示的设计稿宽度为640px。
本发明实施例所述页面生成模块103根据所述网页生成请求信息设置初始抽象语法树中的根节点的字体尺寸属性,具体的:
可以提取所述网页生成请求信息中的最佳网页显示的设计稿宽度值与预设属性值之间的比值作为相对宽度,提取所述网页生成请求信息中的终端设备屏幕宽度值与相对宽度之间的比值作为初始抽象语法树的元素内容中的根节点的字体尺寸属性。其中,元素内容可以为所述网页数据中的的HTML数据,根节点可以为HTML数据中根元素<html>,字体尺寸属性可以为根元素<html>的font-size属性。
例如,最佳网页显示的设计稿宽度为640px,预设属性值为100px,终端设备的屏幕宽度为320px,则相对宽度为640px/100px=6.4rem,将初始抽象语法树元素内容中的根节点的字体尺寸属性设置为320px/6.4rem=50px。
可选的,在HTML5开发过程中,为了让网页能适配不同尺寸的移动终端设备,让设计稿在不同尺寸的移动设备上展示效果一致,一般使用rem自适应布局,rem是CSS3的一个相对单位,就是相对于根元素<html>的font-size来做计算,例如根元素<html>设置的font-size=12px,非根元素设置width=2rem,则2rem换算成px单位就是24px。利用rem的特性,在移动端HTML5的开发过程中,用javascript按照一定的规则容易动态设置<html>的font-size,从而可以看出,能够以rem为单位实现适配效果。
本发明实施例所述页面生成模块103根据所述网页生成请求信息设置初始抽象语法树中的根节点的字体尺寸属性之后,可以根据多层节点对应的对象数组和初始抽象语法树的根节点的字体尺寸属性生成目标抽象语法树。
详细地,本发明实施例为了将所述抽象语法树转换成可以正常观看和使用的网页,需要对所述目标抽象语法树进行渲染处理。
具体的,可以采用前序深度遍历的方式遍历目标抽象语法树,提取目标抽象语法树中的基本节点,若在基本节点出现连续短文本的链接节点或文本节点,则将短文本的链接节点横向排列,中间以空格隔开,<table>标签对应的节点有其固定的格式,可以不对<table>标签对应的节点进行切割,直接将<table>标签对应的节点作为一个基本节点,利用预设的渲染函数对所有的基本节点进行渲染,生成网页。可选地,本发明实施例中所述渲染函数为render函数。
进一步地,当所述初始抽象语法树包括所述初始图表语法树时,表示在执行目标页面生成时,还需要访问图表所绑定的数据,因此,为了加快图表在页面的渲染生成过程,不需直接访问图表所绑定的数据,所述页面生成模块103直接利用所述待渲染图表数据集即可快速渲染出图表,并加载至所述生成的页面中。
详细地,本发明实施例所述页面生成模块103根据所述网页生成请求信息中的终端设备标识信息,可选地,所述终端设备标识信息为终端设备的ip地址,进一步地,本发明实施例根据所述网页生成请求信息中的终端设备标识信息将所述目标网页发送至对应的终端设备。
如图3所示,是本发明实现页面生成方法的电子设备的结构示意图。
所述电子设备可以包括处理器10、存储器11、通信总线12和通信接口13,还可以包括存储在所述存储器11中并可在所述处理器10上运行的计算机程序,如页面生成程序。
其中,所述存储器11至少包括一种类型的可读存储介质,所述可读存储介质包括闪存、移动硬盘、多媒体卡、卡型存储器(例如:SD或DX存储器等)、磁性存储器、磁盘、光盘等。所述存储器11在一些实施例中可以是电子设备的内部存储单元,例如该电子设备的移动硬盘。所述存储器11在另一些实施例中也可以是电子设备的外部存储设备,例如电子设备上配备的插接式移动硬盘、智能存储卡(Smart Media Card,SMC)、安全数字(SecureDigital,SD)卡、闪存卡(Flash Card)等。进一步地,所述存储器11还可以既包括电子设备的内部存储单元也包括外部存储设备。所述存储器11不仅可以用于存储安装于电子设备的应用软件及各类数据,例如页面生成程序的代码等,还可以用于暂时地存储已经输出或者将要输出的数据。
所述处理器10在一些实施例中可以由集成电路组成,例如可以由单个封装的集成电路所组成,也可以是由多个相同功能或不同功能封装的集成电路所组成,包括一个或者多个中央处理器(Central Processing unit,CPU)、微处理器、数字处理芯片、图形处理器及各种控制芯片的组合等。所述处理器10是所述电子设备的控制核心(Control Unit),利用各种接口和线路连接整个电子设备的各个部件,通过运行或执行存储在所述存储器11内的程序或者模块(例如页面生成程序等),以及调用存储在所述存储器11内的数据,以执行电子设备的各种功能和处理数据。
所述通信总线12可以是外设部件互连标准(perIPheral componentinterconnect,简称PCI)总线或扩展工业标准结构(extended industry standardarchitecture,简称EISA)总线等。该总线可以分为地址总线、数据总线、控制总线等。所述通信总线12总线被设置为实现所述存储器11以及至少一个处理器10等之间的连接通信。为便于表示,图中仅用一条粗线表示,但并不表示仅有一根总线或一种类型的总线。
图3仅示出了具有部件的电子设备,本领域技术人员可以理解的是,图3示出的结构并不构成对所述电子设备的限定,可以包括比图示更少或者更多的部件,或者组合某些部件,或者不同的部件布置。
例如,尽管未示出,所述电子设备还可以包括给各个部件供电的电源(比如电池),优选地,电源可以通过电源管理装置与所述至少一个处理器10逻辑相连,从而通过电源管理装置实现充电管理、放电管理、以及功耗管理等功能。电源还可以包括一个或一个以上的直流或交流电源、再充电装置、电源故障检测电路、电源转换器或者逆变器、电源状态指示器等任意组件。所述电子设备还可以包括多种传感器、蓝牙模块、Wi-Fi模块等,在此不再赘述。
可选地,所述通信接口13可以包括有线接口和/或无线接口(如WI-FI接口、蓝牙接口等),通常用于在该电子设备与其他电子设备之间建立通信连接。
可选地,所述通信接口13还可以包括用户接口,用户接口可以是显示器(Display)、输入单元(比如键盘(Keyboard)),可选地,用户接口还可以是标准的有线接口、无线接口。可选地,在一些实施例中,显示器可以是LED显示器、液晶显示器、触控式液晶显示器以及OLED(Organic Light-Emitting Diode,有机发光二极管)触摸器等。其中,显示器也可以适当的称为显示屏或显示单元,用于显示在电子设备中处理的信息以及用于显示可视化的用户界面。
应该了解,所述实施例仅为说明之用,在专利申请范围上并不受此结构的限制。
所述电子设备中的所述存储器11存储的页面生成程序是多个计算机程序的组合,在所述处理器10中运行时,可以实现:
接收到终端设备发送的网页生成请求信息时,根据所述网页生成请求信息获取网页数据,对所述网页数据进行解析,得到对应的文档对象模型;
将所述文档对象模型转换为抽象语法树,并对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树;
从所述初始抽象语法树中抽取出初始图表语法树,根据所述初始图表语法树进行图表数据索引,得到缓存图表数据;
获取所述初始图表语法树对应的图表数据,得到初始图表数据集,计算所述初始图表数据集与所述缓存图表数据集之间的最长公共子序列;
根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据;
将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集;
根据所述初始抽象语法树、所述网页生成请求信息及所述待渲染图表数据集生成网页;
将所述生成的网页发送至所述终端设备。
具体地,所述处理器10对上述计算机程序的具体实现方法可参考图1对应实施例中相关步骤的描述,在此不赘述。
进一步地,所述电子设备集成的模块/单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储介质中。所述计算机可读介质可以是非易失性的,也可以是易失性的。所述计算机可读介质可以包括:能够携带所述计算机程序代码的任何实体或装置、记录介质、U盘、移动硬盘、磁碟、光盘、计算机存储器、只读存储器(ROM,Read-Only Memory)。
本发明实施例还可以提供一种计算机可读存储介质,所述可读存储介质存储有计算机程序,所述计算机程序在被电子设备的处理器所执行时,可以实现:
接收到终端设备发送的网页生成请求信息时,根据所述网页生成请求信息获取网页数据,对所述网页数据进行解析,得到对应的文档对象模型;
将所述文档对象模型转换为抽象语法树,并对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树;
从所述初始抽象语法树中抽取出初始图表语法树,根据所述初始图表语法树进行图表数据索引,得到缓存图表数据;
获取所述初始图表语法树对应的图表数据,得到初始图表数据集,计算所述初始图表数据集与所述缓存图表数据集之间的最长公共子序列;
根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据;
将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集;
根据所述初始抽象语法树、所述网页生成请求信息及所述待渲染图表数据集生成网页;
将所述生成的网页发送至所述终端设备。
进一步地,所述计算机可用存储介质可主要包括存储程序区和存储数据区,其中,存储程序区可存储操作系统、至少一个功能所需的应用程序等;存储数据区可存储根据区块链节点的使用所创建的数据等。
在本发明所提供的几个实施例中,应该理解到,所揭露的设备,装置和方法,可以通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如,所述模块的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式。
所述作为分离部件说明的模块可以是或者也可以不是物理上分开的,作为模块显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。
另外,在本发明各个实施例中的各功能模块可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用硬件加软件功能模块的形式实现。
对于本领域技术人员而言,显然本发明不限于上述示范性实施例的细节,而且在不背离本发明的精神或基本特征的情况下,能够以其他的具体形式实现本发明。
因此,无论从哪一点来看,均应将实施例看作是示范性的,而且是非限制性的,本发明的范围由所附权利要求而不是上述说明限定,因此旨在将落在权利要求的等同要件的含义和范围内的所有变化涵括在本发明内。不应将权利要求中的任何附关联图标记视为限制所涉及的权利要求。
本发明所指区块链是分布式数据存储、点对点传输、共识机制、加密算法等计算机技术的新型应用模式。区块链(Blockchain),本质上是一个去中心化的数据库,是一串使用密码学方法相关联产生的数据块,每一个数据块中包含了一批次网络交易的信息,用于验证其信息的有效性(防伪)和生成下一个区块。区块链可以包括区块链底层平台、平台产品服务层以及应用服务层等。
此外,显然“包括”一词不排除其他单元或步骤,单数不排除复数。系统权利要求中陈述的多个单元或装置也可以由一个单元或装置通过软件或者硬件来实现。第二等词语用来表示名称,而并不表示任何特定的顺序。
最后应说明的是,以上实施例仅用以说明本发明的技术方案而非限制,尽管参照较佳实施例对本发明进行了详细说明,本领域的普通技术人员应当理解,可以对本发明的技术方案进行修改或等同替换,而不脱离本发明技术方案的精神和范围。
Claims (10)
1.一种页面生成方法,其特征在于,所述方法包括:
接收到终端设备发送的网页生成请求信息时,根据所述网页生成请求信息获取网页数据,对所述网页数据进行解析,得到对应的文档对象模型;
将所述文档对象模型转换为抽象语法树,并对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树;
从所述初始抽象语法树中抽取出初始图表语法树,根据所述初始图表语法树进行图表数据索引,得到缓存图表数据;
获取所述初始图表语法树对应的图表数据,得到初始图表数据集,计算所述初始图表数据集与所述缓存图表数据集之间的最长公共子序列;
根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据;
将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集;
根据所述初始抽象语法树、所述网页生成请求信息及所述待渲染图表数据集生成网页;
将所述生成的网页发送至所述终端设备。
2.如权利要求1所述的页面生成方法,其特征在于,所述对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树,包括:
遍历所述抽象语法树中的所有节点,标记所述抽象语法树中包含style字段或javascript字段的节点作为目标节点;
从所述目标节点中将所述style字段对应的值及所述javascript字段对应的值剥离,得到目标值;
根据所有所述目标值利用预设规则对所述抽象语法树进行更新构建,得到所述初始抽象语法树。
3.如权利要求2所述的页面生成方法,其特征在于,所述根据所有所述目标值利用预设规则对所述抽象语法树进行更新构建,得到所述初始抽象语法树,包括:
将所述style字段对应的值与预设样式表进行组合,得到目标样式表;
将所述所述javascript字段对应的值与预设脚本进行组合,得到目标脚本;
将所述目标样式表及所述目标脚本填入对应的目标节点,得到所述初始抽象语法树。
4.如权利要求1所述的页面生成方法,其特征在于,所述获取所述初始图表语法树对应的图表数据,得到初始图表数据集,包括:
提取所述初始图表语法树的图表数据网址;
访问所述图表数据网址中的图表数据,得到所述初始图表数据集。
5.如权利要求1所述的页面生成方法,其特征在于,所述计算所述初始图表数据集与所述缓存图表数据集之间的最长公共子序列,包括:
分别计算所述初始图表数据集及所述缓存图表数据集中每行数据的字符长度,得到初始图表长度及缓存图表长度;
根据所述初始图表长度及所述缓存图表长度,生成图表字符矩阵;
对所述图表字符矩阵进行索引编号标记,得到固定字符矩阵;
计算所述固定字符矩阵除第一维度外其他维度的数据大小,得到所述最长公共子序列。
6.如权利要求1所述的页面生成方法,其特征在于,所述根据所述最长公共子序列,对所述初始图表数据集与所述缓存图表数据集进行数据差异筛选,得到图表补丁数据,包括:
根据所述初始图表数据集与所述缓存图表数据集中各图表字符在所述最长公共子序列中出现的序列位置,确定数据差异,其中所述数据差异包括重合字符及非重合字符;
根据所述重合字符、所述非重合字符及预设的替换字符,替换所述最长公共子序列,得到所述图表补丁数据。
7.如权利要求1至6中任意一项所述的页面生成方法,其特征在于,所述根据所述初始图表语法树进行图表数据索引,得到缓存图表数据,包括:
提取所述初始图表语法树中图表数据对应的HTTP协议;
解析所述HTTP协议的请求头部字段;
根据所述请求头部字段及预设缓存路径构建索引路径,根据所述索引路径在预设的存储设备中进行数据检索,得到所述缓存图表数据。
8.一种页面生成方法,其特征在于,包括:
数据解耦模块,用于接收到终端设备发送的网页生成请求信息时,根据所述网页生成请求信息获取网页数据,对所述网页数据进行解析,得到对应的文档对象模型;将所述文档对象模型转换为抽象语法树,并对所述抽象语法树进行内联Css及内联Javascript的解耦更新,得到初始抽象语法树;
差异数据计算模块,从所述初始抽象语法树中抽取出初始图表语法树,根据所述初始图表语法树进行图表数据索引,得到缓存图表数据;获取所述初始图表语法树对应的图表数据,得到初始图表数据集,计算所述初始图表数据集与所述缓存图表数据集之间的最长公共子序列;根据所述初始图表数据集及所述缓存图表数据集对所述最长公共子序列进行差异数据替换,得到图表补丁数据;
页面生成模块,用于将所述图表补丁数据与所述缓存图表数据集结合,得到待渲染图表数据集;根据所述初始抽象语法树、所述网页生成请求信息及所述待渲染图表数据集生成网页。
9.一种电子设备,其特征在于,所述电子设备包括:
至少一个处理器;以及,
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有可被所述至少一个处理器执行的计算机程序,所述计算机程序被所述至少一个处理器执行,以使所述至少一个处理器能够执行如权利要求1至7中任一项所述的页面生成方法。
10.一种计算机可读存储介质,存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现如权利要求1至7中任一项所述的页面生成方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110514007.5A CN113139145B (zh) | 2021-05-12 | 2021-05-12 | 页面生成方法、装置、电子设备及可读存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110514007.5A CN113139145B (zh) | 2021-05-12 | 2021-05-12 | 页面生成方法、装置、电子设备及可读存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN113139145A true CN113139145A (zh) | 2021-07-20 |
CN113139145B CN113139145B (zh) | 2023-03-21 |
Family
ID=76816900
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202110514007.5A Active CN113139145B (zh) | 2021-05-12 | 2021-05-12 | 页面生成方法、装置、电子设备及可读存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN113139145B (zh) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN113687827A (zh) * | 2021-08-24 | 2021-11-23 | 平安国际智慧城市科技股份有限公司 | 基于微件的数据列表生成方法、装置、设备及存储介质 |
Citations (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20110191383A1 (en) * | 2010-02-01 | 2011-08-04 | Oracle International Corporation | Orchestration of business processes using templates |
US8745027B1 (en) * | 2011-04-11 | 2014-06-03 | Google Inc. | Jslayout cascading style sheets optimization |
US20140282444A1 (en) * | 2013-03-15 | 2014-09-18 | ArtinSoft Corporation | Programming language transformations with abstract syntax tree extensions |
US9021348B1 (en) * | 2011-01-11 | 2015-04-28 | Google Inc. | Composition of templates using transclusion that guarantee a valid HTML document |
CN104714982A (zh) * | 2013-12-17 | 2015-06-17 | 阿里巴巴集团控股有限公司 | 一种网页的加载方法和系统 |
US20170315982A1 (en) * | 2014-10-31 | 2017-11-02 | Guangzhou Ucweb Computer Technology Co., Ltd. | Method, device and mobile terminal for webpage text parsing |
CN108170427A (zh) * | 2017-12-19 | 2018-06-15 | 中山大学 | 一种基于测试的网页构件抽取与复用方法 |
CN110795099A (zh) * | 2019-09-03 | 2020-02-14 | 五八有限公司 | 一种页面样式转换方法、装置、终端设备及存储介质 |
CN112069432A (zh) * | 2020-07-15 | 2020-12-11 | 北京邮电大学 | 基于web的数据可视化图表渲染优化方法及系统 |
CN112463152A (zh) * | 2020-12-09 | 2021-03-09 | 深圳赛安特技术服务有限公司 | 一种基于ast的网页适配方法及装置 |
-
2021
- 2021-05-12 CN CN202110514007.5A patent/CN113139145B/zh active Active
Patent Citations (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20110191383A1 (en) * | 2010-02-01 | 2011-08-04 | Oracle International Corporation | Orchestration of business processes using templates |
US9021348B1 (en) * | 2011-01-11 | 2015-04-28 | Google Inc. | Composition of templates using transclusion that guarantee a valid HTML document |
US8745027B1 (en) * | 2011-04-11 | 2014-06-03 | Google Inc. | Jslayout cascading style sheets optimization |
US20140282444A1 (en) * | 2013-03-15 | 2014-09-18 | ArtinSoft Corporation | Programming language transformations with abstract syntax tree extensions |
CN104714982A (zh) * | 2013-12-17 | 2015-06-17 | 阿里巴巴集团控股有限公司 | 一种网页的加载方法和系统 |
US20170315982A1 (en) * | 2014-10-31 | 2017-11-02 | Guangzhou Ucweb Computer Technology Co., Ltd. | Method, device and mobile terminal for webpage text parsing |
CN108170427A (zh) * | 2017-12-19 | 2018-06-15 | 中山大学 | 一种基于测试的网页构件抽取与复用方法 |
CN110795099A (zh) * | 2019-09-03 | 2020-02-14 | 五八有限公司 | 一种页面样式转换方法、装置、终端设备及存储介质 |
CN112069432A (zh) * | 2020-07-15 | 2020-12-11 | 北京邮电大学 | 基于web的数据可视化图表渲染优化方法及系统 |
CN112463152A (zh) * | 2020-12-09 | 2021-03-09 | 深圳赛安特技术服务有限公司 | 一种基于ast的网页适配方法及装置 |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN113687827A (zh) * | 2021-08-24 | 2021-11-23 | 平安国际智慧城市科技股份有限公司 | 基于微件的数据列表生成方法、装置、设备及存储介质 |
CN113687827B (zh) * | 2021-08-24 | 2024-03-12 | 平安国际智慧城市科技股份有限公司 | 基于微件的数据列表生成方法、装置、设备及存储介质 |
Also Published As
Publication number | Publication date |
---|---|
CN113139145B (zh) | 2023-03-21 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN111813963B (zh) | 知识图谱构建方法、装置、电子设备及存储介质 | |
US10289649B2 (en) | Webpage advertisement interception method, device and browser | |
CN113609820B (zh) | 基于可扩展标记语言文件生成word文件的方法、装置及设备 | |
CN104185845A (zh) | 用于提供网页的二进制表示的系统和方法 | |
US20090006471A1 (en) | Exposing Specific Metadata in Digital Images | |
CN107590288B (zh) | 用于抽取网页图文块的方法和装置 | |
CN110309457B (zh) | 网页数据处理方法、装置、计算机设备和存储介质 | |
CN110851136A (zh) | 数据获取方法、装置、电子设备及存储介质 | |
CN105740355B (zh) | 基于聚集文本密度的网页正文提取方法及装置 | |
CN113139145B (zh) | 页面生成方法、装置、电子设备及可读存储介质 | |
US8862976B1 (en) | Methods and systems for diagnosing document formatting errors | |
US8656371B2 (en) | System and method of report representation | |
CN112667208A (zh) | 翻译错误识别方法、装置、计算机设备及可读存储介质 | |
Jou | Schema extraction for deep web query interfaces using heuristics rules | |
CN106897287B (zh) | 网页发布时间抽取方法和用于网页发布时间抽取的装置 | |
CN113687827B (zh) | 基于微件的数据列表生成方法、装置、设备及存储介质 | |
CN114064033A (zh) | 前端组件化开发方法、装置、电子设备及可读存储介质 | |
CN113971044A (zh) | 组件文档生成方法、装置、设备及可读存储介质 | |
JP2012141974A (ja) | リンクされたテキストボックスを有する電子文書のレンダリング | |
CN115242638B (zh) | 可行触达的筛选方法、装置、电子设备及存储介质 | |
CN116009863B (zh) | 前端页面渲染方法、设备及存储介质 | |
CN111597108B (zh) | 表单属性测试方法、装置及计算机可读存储介质 | |
CN112559919B (zh) | 线上文档上传的检查方法、装置、电子设备及存储介质 | |
CN115310015A (zh) | 一种图片预览方法、装置、设备及存储介质 | |
CN115687095A (zh) | 页面测试方法、装置、设备及计算机可读存储介质 |
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 | ||
TA01 | Transfer of patent application right |
Effective date of registration: 20211019 Address after: 518000 Room 201, building A, No. 1, Qian Wan Road, Qianhai Shenzhen Hong Kong cooperation zone, Shenzhen, Guangdong (Shenzhen Qianhai business secretary Co., Ltd.) Applicant after: Shenzhen saiante Technology Service Co.,Ltd. Address before: 1-34 / F, Qianhai free trade building, 3048 Xinghai Avenue, Mawan, Qianhai Shenzhen Hong Kong cooperation zone, Shenzhen, Guangdong 518000 Applicant before: Ping An International Smart City Technology Co.,Ltd. |
|
TA01 | Transfer of patent application right | ||
GR01 | Patent grant | ||
GR01 | Patent grant |