CN113051874A - 一种用户行为数据渲染方法和装置 - Google Patents
一种用户行为数据渲染方法和装置 Download PDFInfo
- Publication number
- CN113051874A CN113051874A CN201911365284.3A CN201911365284A CN113051874A CN 113051874 A CN113051874 A CN 113051874A CN 201911365284 A CN201911365284 A CN 201911365284A CN 113051874 A CN113051874 A CN 113051874A
- Authority
- CN
- China
- Prior art keywords
- user behavior
- behavior data
- rendered
- dom
- rendering
- 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
- 238000009877 rendering Methods 0.000 title claims abstract description 108
- 238000000034 method Methods 0.000 title claims abstract description 64
- 230000006399 behavior Effects 0.000 claims description 291
- 230000015654 memory Effects 0.000 claims description 15
- 230000001960 triggered effect Effects 0.000 claims description 7
- 238000004590 computer program Methods 0.000 claims description 3
- 230000008569 process Effects 0.000 abstract description 12
- 230000002452 interceptive effect Effects 0.000 abstract description 6
- 230000008859 change Effects 0.000 description 4
- 238000012545 processing Methods 0.000 description 4
- 238000010586 diagram Methods 0.000 description 3
- 230000006870 function Effects 0.000 description 3
- 230000009471 action Effects 0.000 description 2
- 238000004422 calculation algorithm Methods 0.000 description 2
- 238000004364 calculation method Methods 0.000 description 2
- 238000013461 design Methods 0.000 description 2
- 238000013507 mapping Methods 0.000 description 2
- 238000012544 monitoring process Methods 0.000 description 2
- 239000002245 particle Substances 0.000 description 2
- 230000004075 alteration Effects 0.000 description 1
- 238000013459 approach Methods 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000005540 biological transmission Effects 0.000 description 1
- 230000000903 blocking effect Effects 0.000 description 1
- 238000007405 data analysis Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000008520 organization Effects 0.000 description 1
- 238000012827 research and development Methods 0.000 description 1
- 230000005477 standard model Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/12—Use of codes for handling textual entities
- G06F40/14—Tree-structured documents
Abstract
本发明公开了一种用户行为数据渲染方法和装置。所述方法包括：根据文档对象模型DOM树建立虚拟文档对象模型VDOM树，VDOM树中的VDOM节点标注有DOM树中对应的DOM节点的路径标识，DOM节点为页面中的对象；根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集；当DOM树完成渲染或更新后，根据当前渲染的DOM节点的路径标识确定用户行为数据集中对应的用户行为数据记录，使用用户行为数据记录为当前渲染的DOM节点渲染用户行为数据。能够在DOM首次渲染和刷新的过程中均实现用户行为数据的渲染，做到交互式渲染。
Description
技术领域
本发明涉及数据渲染技术领域，特别涉及一种用户行为数据渲染方法和装置。
背景技术
为了便于研发或管理人员了解浏览器中各功能(控件)的使用情况，需要使用埋点采集用户行为数据，比如用户点击某个控件的次数、观看某个视频的时长、点击某个跳转链接的次数等。其中，埋点是记录用户行为以用于后续数据分析的方法。
同时，为了使得用户行为数据得到更直观的展示，需要将用户行为数据直接渲染在显示页面的对应控件上。而现有技术中的用户行为数据渲染方法，只能在首屏渲染各控件的用户行为数据，无法监听到文档对象模型(Document Object Mode，DOM)变化，更无法在DOM变化后继续在刷新后的页面上渲染用户行为数据，故无法实现交互式渲染。例如，在用户点击某一控件后弹出的子窗口中无法再渲染子窗口上各控件的用户行为数据。
发明内容
鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的一种用户行为数据渲染方法和装置。
第一方面，本发明实施例提供一种用户行为数据渲染方法，包括：
根据文档对象模型DOM树建立虚拟文档对象模型VDOM树，所述VDOM树中的VDOM节点标注有DOM树中对应的DOM节点的路径标识，所述DOM节点为页面中的对象；
根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集；
当DOM树完成渲染或更新后，根据当前渲染的DOM节点的路径标识确认所述用户行为数据集中对应的用户行为数据记录，使用所述用户行为数据记录为所述当前渲染的DOM节点渲染用户行为数据。
在一些可选的实施例中，根据当前渲染的DOM节点的路径标识确定所述用户行为数据集中对应的用户行为数据记录，使用所述用户行为数据记录为所述当前渲染的DOM节点渲染用户行为数据，包括：
遍历所述用户行为数据集，判断当前遍历的用户行为数据记录的路径标识对应的DOM节点是否在当前页面中渲染；
若是，判断所述对应的DOM节点是否已渲染用户行为数据；
若未渲染用户行为数据，使用当前遍历的用户行为数据记录为所述对应的DOM节点渲染用户行为数据。
在一些可选的实施例中，判断所述对应的DOM节点已渲染用户行为数据时，还包括：
判断所述对应的DOM节点已渲染的用户行为数据是否与所述当前遍历的用户行为数据记录匹配；
若否，执行所述使用当前遍历的用户行为数据记录为所述对应的DOM节点渲染用户行为数据。
在一些可选的实施例中，根据当前渲染的DOM节点的路径标识确定所述用户行为数据集中对应的用户行为数据记录，使用所述用户行为数据记录为所述当前渲染的DOM节点渲染用户行为数据，包括：
判断当前页面中渲染的DOM节点是否已渲染用户行为数据；
若否，从所述用户行为数据集中查找与所述当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录，使用查找到的用户行为数据记录为所述当前页面中渲染的DOM节点渲染用户行为数据。
在一些可选的实施例中，判断当前页面中渲染的DOM节点已渲染用户行为数据时，还包括：
从所述用户行为数据集中查找与当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录；
判断查找到的用户行为数据记录是否与所述当前页面中渲染的DOM节点已渲染的用户行为数据匹配；
若否，使用所述查找到的用户行为数据记录为所述当前页面中渲染的DOM节点渲染用户行为数据。
在一些可选的实施例中，渲染用户行为数据前，还包括：
判断显示所述页面的浏览器是否空闲；
若是，执行所述渲染用户行为数据的步骤；
若否，按照预设间隔执行所述判断显示所述页面的浏览器是否空闲，直至判断为是。
在一些可选的实施例中，所述用户行为数据，通过下述方式预先采集：
当页面中的对象被指定用户行为触发时，向服务器返回所述对象对应的DOM节点的路径标识，使得服务器统计所述路径标识对应的用户行为数据记录，生成所述用户行为数据。
第二方面，本发明实施例提供一种用户行为数据渲染装置，包括：
第一建立模块，用于根据文档对象模型DOM树建立虚拟文档对象模型VDOM树，所述VDOM树中的VDOM节点标注有DOM树中对应的DOM节点的路径标识，所述DOM节点为页面中的对象；
第二建立模块，用于根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集；
渲染模块，用于当DOM树完成渲染或更新后，根据当前渲染的DOM节点的路径标识确定所述第二建立模块建立的用户行为数据集中对应的用户行为数据记录，使用所述用户行为数据记录为所述当前渲染的DOM节点渲染用户行为数据。
在一些可选的实施例中，渲染模块，当DOM树完成渲染或更新后，具体用于：
遍历所述用户行为数据集，判断当前遍历的用户行为数据记录的路径标识对应的DOM节点是否在当前页面中渲染；若是，判断所述对应的DOM节点是否已渲染用户行为数据；若未渲染用户行为数据，使用当前遍历的用户行为数据记录为所述对应的DOM节点渲染用户行为数据。
在一些可选的实施例中，渲染模块，判断对应的DOM节点已渲染用户行为数据时，还用于：
判断所述对应的DOM节点已渲染的用户行为数据是否与所述当前遍历的用户行为数据记录匹配；若否，执行所述使用当前遍历的用户行为数据记录为所述对应的DOM节点渲染用户行为数据。
在一些可选的实施例中，渲染模块，当DOM树完成渲染或更新后，具体用于：
判断当前页面中渲染的DOM节点是否已渲染用户行为数据；若否，从所述用户行为数据集中查找与所述当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录，使用查找到的用户行为数据记录为所述当前页面中渲染的DOM节点渲染用户行为数据。
在一些可选的实施例中，渲染模块，判断当前页面中渲染的DOM节点已渲染用户行为数据时，还用于：
从所述用户行为数据集中查找与当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录；判断查找到的用户行为数据记录是否与所述当前页面中渲染的DOM节点已渲染的用户行为数据匹配；若否，使用所述查找到的用户行为数据记录为所述当前页面中渲染的DOM节点渲染用户行为数据。
在一些可选的实施例中，上述装置还包括判断模块，用于：
渲染模块渲染用户行为数据前，判断显示所述页面的浏览器是否空闲；
若是，渲染模块执行所述渲染用户行为数据的步骤；
若否，判断模块按照预设间隔执行所述判断显示所述页面的浏览器是否空闲，直至判断为是。
第三方面，本发明实施例提供一种浏览器，所述浏览器设置有上述用户行为数据渲染装置。
第四方面，本发明实施例提供一种计算机设备，包括存储器，处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现上述用户行为数据渲染方法。
第五方面，本发明实施例提供一种计算机可读存储介质，其上存储有计算机指令，当该指令被处理器执行时实现上述用户行为数据渲染方法。
本发明实施例提供的上述技术方案的有益效果至少包括：
根据文档对象模型DOM树建立虚拟文档对象模型VDOM树；根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集；当DOM树完成渲染或更新后，根据当前渲染的DOM节点的路径标识确定用户行为数据集中对应的用户行为数据记录，使用用户行为数据记录为当前渲染的DOM节点渲染用户行为数据。在DOM树首次渲染或更新时，均能实现用户行为数据的渲染，做到交互式渲染。且在渲染过程中无需额外的监控DOM变化，减轻了浏览器的运行负担。
本发明的其它特征和优点将在随后的说明书中阐述，并且，部分地从说明书中变得显而易见，或者通过实施本发明而了解。本发明的目的和其他优点可通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获得。
下面通过附图和实施例，对本发明的技术方案做进一步的详细描述。
附图说明
附图用来提供对本发明的进一步理解，并且构成说明书的一部分，与本发明的实施例一起用于解释本发明，并不构成对本发明的限制。在附图中：
图1为本发明实施例一中用户行为数据渲染方法的流程图；
图2为本发明实施例一中DOM树的树形结构示意图；
图3为图1中的步骤S13的一种具体实现流程图；
图4为图1中的步骤S13的另一具体实现流程图；
图5为本发明实施例二中用户行为数据渲染方法的具体实现流程图；
图6为本发明实施例二中用户行为数据渲染方法的另一具体实现流程图；
图7为本发明实施例三中利用埋点获取用户行为数据的具体实现流程图；
图8为本发明实施例中用户行为数据渲染装置的结构示意图。
具体实施方式
下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例，然而应当理解，可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本公开，并且能够将本公开的范围完整的传达给本领域的技术人员。
为了解决现有技术中存在的无法交互式渲染埋点采集到的用户行为数据的问题，本发明实施例提供一种用户行为数据渲染方法和装置，能够在DOM首次建立和刷新的过程中均实现用户行为数据的渲染，做到交互式渲染。
实施例一
本发明实施例一提供一种用户行为数据渲染方法，其流程如图1所示，包括如下步骤：
步骤S11：根据文档对象模型DOM树建立虚拟文档对象模型VDOM树。
其中，DOM树包括了整个页面的信息，也就是浏览器呈现出来的、用户看到的页面效果。DOM树包括的DOM节点为页面中的对象，VDOM树中的VDOM节点用于表示页面中的对象，DOM节点与VDOM节点是一一对应的。同时，VDOM树中的VDOM节点标注有DOM树中对应的DOM节点的路径标识。
上述页面的对象，可以是页面中显示出来的控件，也可以是没有显示出来的后台数据，本申请的用户行为数据渲染，是对页面中显示的控件的用户行为数据渲染。控件可以用来前端表现或人机交互，属于前端的组成元素，例如文字输入框、下拉框、单选复选框、容器等。
文档对象模型(Document Object Model，DOM)树为万维网联盟组织推荐的处理可扩展标志语言的标准编程接口。在网页上，组织页面(或文档)的对象被组织在一个树形结构中，用来表示文档中对象的标准模型。虚拟文档对象模型(Virtual Document ObjectModel，VDOM)树是一种将浏览器的控件用单纯的javascript物件表达的数据结构，每个VDOM节点和其真实表达的DOM节点有着一对一的映射关系。
参照图2所示，为DOM树的树形结构示意图，构成DOM树的基本要素是节点，而文档的结构就是由层次化的节点组成。在DOM树中，整个文档(Document)就是一个节点，称为文档节点，文档节点对应的为根元素；根元素的下一级节点可以为head或body；根元素下级节点的下级节点可以还是元素节点，直至元素节点为文本或属性节点。
DOM树可以用特定方式操作这个树，改变文档的结构、样式或者内容。而相对于频繁地去操作DOM树引起的性能问题，VDOM树很好地对DOM树做了一层映射关系，将原来需要在DOM树上进行的一系列操作，映射到VDOM树进行操作。
需要说明的是，在DOM规范中，对于文档的表示方法并没有任何限制。DOM树结构构成的基本要素是节点，而文档的结构就是由层次化的节点组成。在DOM树中，如果以Document为根节点，其余节点为子节点，组织成的一个树形的数据结构就是DOM树。
具体的，可以利用react或vue等前端框架来建立VDOM树。
步骤S12：根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集。
获取的用户行为数据可以是包括DOM树中所有DOM节点的路径标识及对应的一条或多条用户行为数据记录，根据DOM树的树结构和路径标识建立的用户行为数据集为以DOM树的树结构记录的数据集。这样可以减少步骤S13中确定需要渲染用户行为数据的DOM节点和对应的用户行为数据记录的计算量，避免因为同一路径标识对应的多个用户行为数据记录不在一条记录中导致的重复确定。
步骤S13：当DOM树完成渲染或更新后，根据当前渲染的DOM节点的路径标识确定用户行为数据集中对应的用户行为数据记录，使用用户行为数据记录为当前渲染的DOM节点渲染用户行为数据。
当DOM树首次完成渲染或完成渲染后的每次更新后，使用用户行为数据集中与当前渲染的DOM节点的路径标识相对应的用户行为数据记录，为当前渲染的DOM节点渲染用户行为数据。
具体的，步骤S13可以通过下述两种方式来实现。
方式一，参照图3所示，包括下述步骤：
步骤S1211：遍历用户行为数据集，判断当前遍历的用户行为数据记录的路径标识对应的DOM节点是否在当前页面中渲染。
用路径标识来判断DOM树中DOM节点是否已经被渲染了用户行为数据，定位准确，能够防止重复渲染或漏渲染，提高了渲染准确度。
当步骤S1211判断为是时，执行步骤S1212；当步骤S1211判断为否时，继续遍历下一用户行为数据记录，直至遍历完用户行为数据集中所有的用户行为数据记录。
步骤S1212：判断DOM节点是否已渲染用户行为数据。
可以是，在每次渲染DOM节点的用户行为数据时，都将渲染的DOM节点标注为已渲染用户行为数据，则可以确定未标注已渲染用户行为数据的DOM节点未渲染用户行为数据，标注已渲染用户行为数据的DOM节点已渲染用户行为数据。
当步骤S1212判断为否时，执行步骤S1213；当步骤S1212判断为是时，执行步骤S1211，继续遍历下一用户行为数据记录，直至遍历完用户行为数据集中所有的用户行为数据记录。
步骤S1213：使用当前遍历的用户行为数据记录为对应的DOM节点渲染用户行为数据。
在一些实施例中，当步骤S1212判断为是时，还可以包括，判断对应的DOM节点已渲染的用户行为数据是否与当前遍历的用户行为数据记录匹配；若否，执行所述使用当前遍历的用户行为数据记录为所述对应的DOM节点渲染用户行为数据。
确定DOM节点渲染的数据为最新的数据，能够在实现用户数据交互式渲染的基础上，还可以实现数据的实时更新渲染。
方式二，参照图4所示，包括下述步骤：
步骤S1221：判断当前页面中渲染的DOM节点是否已渲染用户行为数据。
当步骤S1221判断为否时，执行步骤S1222；当步骤S1221判断为是时，继续判断当前页面中渲染的另一DOM节点，直至当前页面中渲染的所有DOM节点都判断完。
步骤S1222：从用户行为数据集中查找与当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录。
步骤S1223：使用查找到的用户行为数据记录为当前页面中渲染的DOM节点渲染用户行为数据。
在一些实施例中，当步骤S1221判断为是时，还可以包括，从用户行为数据集中查找与当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录；判断查找到的用户行为数据记录是否与当前页面中渲染的DOM节点已渲染的用户行为数据匹配；若否，使用查找到的用户行为数据记录为当前页面中渲染的DOM节点渲染用户行为数据。
上述实施例一提供的用户行为数据渲染方法，根据文档对象模型DOM树建立虚拟文档对象模型VDOM树；根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集；当DOM树完成渲染或更新后，根据当前渲染的DOM节点的路径标识确定用户行为数据集中对应的用户行为数据记录，使用用户行为数据记录为当前渲染的DOM节点渲染用户行为数据。在DOM树首次完成渲染或更新时，均能实现用户行为数据的渲染，做到交互式渲染。且在渲染过程中无需额外的监控DOM变化，减轻了浏览器的运行负担。
实施例二
本发明实施例二提供一种用户行为数据渲染的具体实现方法，其流程如图5所示，包括如下步骤：
步骤S51：根据文档对象模型DOM树建立虚拟文档对象模型VDOM树。
步骤S52：根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集。
具体用户行为数据的采集方法，后续实施例三中介绍。
当DOM树首次完成渲染或更新后，执行后续步骤S53～步骤S59。
步骤S53：遍历用户行为数据集，判断当前遍历的用户行为数据记录的路径标识对应的DOM节点是否在当前页面中渲染。
若是，执行步骤S54；若否，重复执行步骤S53，直至遍历完用户行为数据集中的所有记录。
步骤S54：判断对应的DOM节点是否已渲染用户行为数据。
若是，执行步骤S55；若否，执行步骤S56。
步骤S55：判断对应的DOM节点已渲染的用户行为数据是否与当前遍历的用户行为数据记录匹配。
若否，执行步骤S56。
步骤S56：判断显示页面的浏览器是否空闲。
若是，执行步骤S57；若否，按照预设间隔重复执行步骤S56，直至步骤S56判断为是。
只有当浏览器空闲的时候才执行数据渲染动作，可以防止阻塞浏览器。
步骤S57：使用当前遍历的用户行为数据记录为对应的DOM节点渲染用户行为数据。
参考图6所示，为一种用户行为数据渲染的具体实现方法的流程图，首先根据文档对象模型DOM树建立虚拟文档对象模型VDOM树，具体包括：从DOM树的根节点Root节点开始，创建Root节点对应的VDOM节点，执行当前DOM节点的render(渲染)方法，继续建立当前DOM节点下一级节点的VDOM节点，直至所有的DOM节点都有对应的VDOM节点，所有的VDOM节点构成了VDOM树。在建立每个VDOM节点的同时，标注并记录每个VDOM节点的路径标识，其中，每个VDOM节点的路径标识为对应的DOM节点的路径标识(DOM节点在DOM树中的路径信息)。
根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集，即VDOM数据集。
在完成首次DOM渲染或触发DOM变化时，均执行图6左侧的单次用户行为数据渲染的流程，具体包括：遍历数据集即上述VDOM数据集(以路径标识为key，以用户行为数据为value的一个数据map)中的每条记录，判断当前遍历的路径标识对应的DOM节点是否存在，即是否渲染在当前页面中；若是，当判断展示上述页面的断浏览器空闲时，为对应的DOM节点渲染用户行为数据并设置为数据已渲染；直至遍历完数据集中的每一条记录，完成了单次用户行为数据渲染的过程。
实施例三
本发明实施例三提供一种利用埋点获取用户行为数据的方法，包括，当页面中的对象被指定用户行为触发时，向服务器返回对象对应的DOM节点的路径标识，使得服务器统计路径标识对应的用户行为数据记录，生成用户行为数据。参照图7所示，具体包括下述步骤：
在建立虚拟文档对象模型VDOM树的过程中，执行步骤S71和步骤S72。
步骤S71：判断当前VDOM节点的路径标识是否被标注。
若否，执行步骤S72。
步骤S72：为当前VDOM节点标注路径标识。
上述路径标识包括的路径信息可以表示VDOM节点对应的DOM节点在DOM树中的位置(路径)。
由于每个DOM节点的路径是不一样的，因此路径标识可以唯一的确定一个DOM节点，从而解决了基于XPath实现无痕埋点，导致页面对象的标识容易重复的技术问题。
步骤S73：当VDOM树映射到DOM树时，将VDOM树中每个VDOM节点的路径标识存储至对应的真实DOM节点上。
上述步骤S71～步骤S73在渲染过程中完成了埋点的工作。
步骤S74：在当前显示的页面中，检测目标对象是否被指定用户行为触发。
上述指定用户行为可以为鼠标单击、双击、滚轮滑动、点击按钮等用户对控件的操作行为。
步骤S75：确定目标对象被指定用户行为触发时，向服务器返回目标对象对应的路径标识，便于服务器统计路径标识对应的用户行为数据，生成用户行为数据。
基于XPath实现无痕埋点的方法是在对象(控件)被触发后，才沿着DOM树查找对象的标识，具有一定的延时，而本申请是在DOM树生成的过程中标注节点的路径标识，因此在对象被触发时，直接可以获取到被触发的对象的路径标识，避免了时间损耗。另外，用XPath实现的标注在开发过程中难以调试，因为生成的标识信息是针对机器的，晦涩难懂，开发者很难通过其路径快速定位DOM节点；而本申请根据路径信息生成路径标识，因此便于开发者定位。最后，由于是在生成VDOM树的过程中完成节点的标注，后续需要利用这些路径标识时无需再做任何的运算即可得到，因此能够降低运行时的计算负担。
基于本发明的发明构思，本发明实施例还提供一种用户行为数据渲染装置，其结构如图8所示，包括：
第一建立模块81，用于根据文档对象模型DOM树建立虚拟文档对象模型VDOM树，所述VDOM树中的VDOM节点标注有DOM树中对应的DOM节点的路径标识，所述DOM节点为页面中的对象；
第二建立模块82，用于根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集；
渲染模块83，用于当DOM树完成渲染或更新后，根据当前渲染的DOM节点的路径标识确定所述第二建立模块82建立的用户行为数据集中对应的用户行为数据记录，使用所述用户行为数据记录为所述当前渲染的DOM节点渲染用户行为数据。。
在一些可选的实施例中，渲染模块83，当DOM树完成渲染或更新后，具体用于：
遍历所述用户行为数据集，判断当前遍历的用户行为数据记录的路径标识对应的DOM节点是否在当前页面中渲染；若是，判断所述对应的DOM节点是否已渲染用户行为数据；若未渲染用户行为数据，使用当前遍历的用户行为数据记录为所述对应的DOM节点渲染用户行为数据。
在一些可选的实施例中，渲染模块83，判断对应的DOM节点已渲染用户行为数据时，还用于：
判断所述对应的DOM节点已渲染的用户行为数据是否与所述当前遍历的用户行为数据记录匹配；若否，执行所述使用当前遍历的用户行为数据记录为所述对应的DOM节点渲染用户行为数据。
在一些可选的实施例中，渲染模块83，当DOM树完成渲染或更新后，具体用于：
判断当前页面中渲染的DOM节点是否已渲染用户行为数据；若否，从所述用户行为数据集中查找与所述当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录，使用查找到的用户行为数据记录为所述当前页面中渲染的DOM节点渲染用户行为数据。
在一些可选的实施例中，渲染模块83，判断当前页面中渲染的DOM节点已渲染用户行为数据时，还用于：
从所述用户行为数据集中查找与当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录；判断查找到的用户行为数据记录是否与所述当前页面中渲染的DOM节点已渲染的用户行为数据匹配；若否，使用所述查找到的用户行为数据记录为所述当前页面中渲染的DOM节点渲染用户行为数据。
在一些可选的实施例中，上述装置还包括判断模块84，用于：
渲染模块83渲染用户行为数据前，判断显示所述页面的浏览器是否空闲；
若是，渲染模块83执行所述渲染用户行为数据的步骤；
若否，判断模块84按照预设间隔执行所述判断显示所述页面的浏览器是否空闲，直至判断为是。
关于上述实施例中的装置，其中各个模块执行操作的具体方式已经在有关该方法的实施例中进行了详细描述，此处将不做详细阐述说明。
基于本发明的发明构思，本发明实施例还提供一种浏览器，所述浏览器设置有上述用户行为数据渲染装置。
基于本发明的发明构思，本发明实施例还提供一种计算机设备，包括存储器，处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现上述用户行为数据渲染方法。
基于本发明的发明构思，本发明实施例还提供一种计算机可读存储介质，其上存储有计算机指令，当该指令被处理器执行时实现上述用户行为数据渲染方法。
除非另外具体陈述，术语比如处理、计算、运算、确定、显示等等可以指一个或更多个处理或者计算系统、或类似设备的动作和/或过程，所述动作和/或过程将表示为处理系统的寄存器或存储器内的物理(如电子)量的数据操作和转换成为类似地表示为处理系统的存储器、寄存器或者其他此类信息存储、发射或者显示设备内的物理量的其他数据。信息和信号可以使用多种不同的技术和方法中的任何一种来表示。例如，在贯穿上面的描述中提及的数据、指令、命令、信息、信号、比特、符号和码片可以用电压、电流、电磁波、磁场或粒子、光场或粒子或者其任意组合来表示。
应该明白，公开的过程中的步骤的特定顺序或层次是示例性方法的实例。基于设计偏好，应该理解，过程中的步骤的特定顺序或层次可以在不脱离本公开的保护范围的情况下得到重新安排。所附的方法权利要求以示例性的顺序给出了各种步骤的要素，并且不是要限于所述的特定顺序或层次。
在上述的详细描述中，各种特征一起组合在单个的实施方案中，以简化本公开。不应该将这种公开方法解释为反映了这样的意图，即，所要求保护的主题的实施方案需要清楚地在每个权利要求中所陈述的特征更多的特征。相反，如所附的权利要求书所反映的那样，本发明处于比所公开的单个实施方案的全部特征少的状态。因此，所附的权利要求书特此清楚地被并入详细描述中，其中每项权利要求独自作为本发明单独的优选实施方案。
本领域技术人员还应当理解，结合本文的实施例描述的各种说明性的逻辑框、模块、电路和算法步骤均可以实现成电子硬件、计算机软件或其组合。为了清楚地说明硬件和软件之间的可交换性，上面对各种说明性的部件、框、模块、电路和步骤均围绕其功能进行了一般地描述。至于这种功能是实现成硬件还是实现成软件，取决于特定的应用和对整个系统所施加的设计约束条件。熟练的技术人员可以针对每个特定应用，以变通的方式实现所描述的功能，但是，这种实现决策不应解释为背离本公开的保护范围。
结合本文的实施例所描述的方法或者算法的步骤可直接体现为硬件、由处理器执行的软件模块或其组合。软件模块可以位于RAM存储器、闪存、ROM存储器、EPROM存储器、EEPROM存储器、寄存器、硬盘、移动磁盘、CD-ROM或者本领域熟知的任何其它形式的存储介质中。一种示例性的存储介质连接至处理器，从而使处理器能够从该存储介质读取信息，且可向该存储介质写入信息。当然，存储介质也可以是处理器的组成部分。处理器和存储介质可以位于ASIC中。该ASIC可以位于用户终端中。当然，处理器和存储介质也可以作为分立组件存在于用户终端中。
对于软件实现，本申请中描述的技术可用执行本申请所述功能的模块(例如，过程、函数等)来实现。这些软件代码可以存储在存储器单元并由处理器执行。存储器单元可以实现在处理器内，也可以实现在处理器外，在后一种情况下，它经由各种手段以通信方式耦合到处理器，这些都是本领域中所公知的。
上文的描述包括一个或多个实施例的举例。当然，为了描述上述实施例而描述部件或方法的所有可能的结合是不可能的，但是本领域普通技术人员应该认识到，各个实施例可以做进一步的组合和排列。因此，本文中描述的实施例旨在涵盖落入所附权利要求书的保护范围内的所有这样的改变、修改和变型。此外，就说明书或权利要求书中使用的术语“包含”，该词的涵盖方式类似于术语“包括”，就如同“包括，”在权利要求中用作衔接词所解释的那样。此外，使用在权利要求书的说明书中的任何一个术语“或者”是要表示“非排它性的或者”。
Claims (11)
1.一种用户行为数据渲染方法，其特征在于，包括：
根据文档对象模型DOM树建立虚拟文档对象模型VDOM树，所述VDOM树中的VDOM节点标注有DOM树中对应的DOM节点的路径标识，所述DOM节点为页面中的对象；
根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集；
当DOM树完成渲染或更新后，根据当前渲染的DOM节点的路径标识确定所述用户行为数据集中对应的用户行为数据记录，使用所述用户行为数据记录为所述当前渲染的DOM节点渲染用户行为数据。
2.如权利要求1所述的方法，其特征在于，根据当前渲染的DOM节点的路径标识确定所述用户行为数据集中对应的用户行为数据记录，使用所述用户行为数据记录为所述当前渲染的DOM节点渲染用户行为数据，包括：
遍历所述用户行为数据集，判断当前遍历的用户行为数据记录的路径标识对应的DOM节点是否在当前页面中渲染；
若是，判断所述对应的DOM节点是否已渲染用户行为数据；
若未渲染用户行为数据，使用当前遍历的用户行为数据记录为所述对应的DOM节点渲染用户行为数据。
3.如权利要求2所述的方法，其特征在于，判断所述对应的DOM节点已渲染用户行为数据时，还包括：
判断所述对应的DOM节点已渲染的用户行为数据是否与所述当前遍历的用户行为数据记录匹配；
若否，执行所述使用当前遍历的用户行为数据记录为所述对应的DOM节点渲染用户行为数据。
4.如权利要求1所述的方法，其特征在于，根据当前渲染的DOM节点的路径标识确定所述用户行为数据集中对应的用户行为数据记录，使用所述用户行为数据记录为所述当前渲染的DOM节点渲染用户行为数据，包括：
判断当前页面中渲染的DOM节点是否已渲染用户行为数据；
若否，从所述用户行为数据集中查找与所述当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录，使用查找到的用户行为数据记录为所述当前页面中渲染的DOM节点渲染用户行为数据。
5.如权利要求4所述的方法，其特征在于，判断当前页面中渲染的DOM节点已渲染用户行为数据时，还包括：
从所述用户行为数据集中查找与当前页面中渲染的DOM节点的路径标识相对应的用户行为数据记录；
判断查找到的用户行为数据记录是否与所述当前页面中渲染的DOM节点已渲染的用户行为数据匹配；
若否，使用所述查找到的用户行为数据记录为所述当前页面中渲染的DOM节点渲染用户行为数据。
6.如权利要求2～5任一所述的方法，其特征在于，渲染用户行为数据前，还包括：
判断显示所述页面的浏览器是否空闲；
若是，执行所述渲染用户行为数据的步骤；
若否，按照预设间隔执行所述判断显示所述页面的浏览器是否空闲，直至判断为是。
7.如权利要求1～5任一所述的方法，其特征在于，所述用户行为数据，通过下述方式预先采集：
当页面中的对象被指定用户行为触发时，向服务器返回所述对象对应的DOM节点的路径标识，使得服务器统计所述路径标识对应的用户行为数据记录，生成所述用户行为数据。
8.一种用户行为数据渲染装置，其特征在于，包括：
第一建立模块，用于根据文档对象模型DOM树建立虚拟文档对象模型VDOM树，所述VDOM树中的VDOM节点标注有DOM树中对应的DOM节点的路径标识，所述DOM节点为页面中的对象；
第二建立模块，用于根据获取的用户行为数据和VDOM树中的路径标识，建立包括路径标识和对应的至少一条用户行为数据记录的用户行为数据集；
渲染模块，用于当DOM树完成渲染或更新后，根据当前渲染的DOM节点的路径标识确定所述第二建立模块建立的用户行为数据集中对应的用户行为数据记录，使用所述用户行为数据记录为所述当前渲染的DOM节点渲染用户行为数据。
9.一种浏览器，其特征在于，所述浏览器设置有如权利要求8所述的用户行为数据渲染装置。
10.一种计算机设备，其特征在于，包括存储器，处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现如权利要求1～7任一所述的用户行为数据渲染方法。
11.一种计算机可读存储介质，其上存储有计算机指令，其特征在于，当该指令被处理器执行时实现权利要求1～7任一所述的用户行为数据渲染方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201911365284.3A CN113051874B (zh) | 2019-12-26 | 2019-12-26 | 一种用户行为数据渲染方法和装置 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201911365284.3A CN113051874B (zh) | 2019-12-26 | 2019-12-26 | 一种用户行为数据渲染方法和装置 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN113051874A true CN113051874A (zh) | 2021-06-29 |
| CN113051874B CN113051874B (zh) | 2023-12-26 |
Family
ID=76506000
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201911365284.3A Active CN113051874B (zh) | 2019-12-26 | 2019-12-26 | 一种用户行为数据渲染方法和装置 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113051874B (zh) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113849697A (zh) * | 2021-09-10 | 2021-12-28 | 上海得帆信息技术有限公司 | 一种轻量的基于dom的流程图渲染方法 |
Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| EP1780646A1 (en) * | 2005-11-01 | 2007-05-02 | Adobe Systems Incorporated | Virtual view tree |
| CN1987862A (zh) * | 2005-12-22 | 2007-06-27 | 国际商业机器公司 | 用于分析网页中的变化的方法和系统 |
| CN102271082A (zh) * | 2010-06-03 | 2011-12-07 | 富士通株式会社 | 用于设置虚拟局域网的交换装置和方法 |
| CN102789484A (zh) * | 2012-06-28 | 2012-11-21 | 奇智软件（北京）有限公司 | 一种网页信息处理方法和装置 |
| US20160188548A1 (en) * | 2014-12-31 | 2016-06-30 | Quantum Metric, LLC | Accurate and efficient recording of user experience, gui changes and user interaction events on a remote web document |
| CN106484383A (zh) * | 2015-08-31 | 2017-03-08 | 阿里巴巴集团控股有限公司 | 页面渲染方法、装置及设备 |
| US9953014B1 (en) * | 2013-11-08 | 2018-04-24 | Instart Logic, Inc. | Collection management in document object model virtualization |
| CN109375918A (zh) * | 2018-11-23 | 2019-02-22 | 天津字节跳动科技有限公司 | 小程序的界面渲染方法、装置、电子设备和存储介质 |
| CN110245311A (zh) * | 2019-04-17 | 2019-09-17 | 阿里巴巴集团控股有限公司 | 局部页面动态渲染方法及装置 |
-
2019
- 2019-12-26 CN CN201911365284.3A patent/CN113051874B/zh active Active
Patent Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| EP1780646A1 (en) * | 2005-11-01 | 2007-05-02 | Adobe Systems Incorporated | Virtual view tree |
| CN1987862A (zh) * | 2005-12-22 | 2007-06-27 | 国际商业机器公司 | 用于分析网页中的变化的方法和系统 |
| CN102271082A (zh) * | 2010-06-03 | 2011-12-07 | 富士通株式会社 | 用于设置虚拟局域网的交换装置和方法 |
| CN102789484A (zh) * | 2012-06-28 | 2012-11-21 | 奇智软件（北京）有限公司 | 一种网页信息处理方法和装置 |
| US9953014B1 (en) * | 2013-11-08 | 2018-04-24 | Instart Logic, Inc. | Collection management in document object model virtualization |
| US20160188548A1 (en) * | 2014-12-31 | 2016-06-30 | Quantum Metric, LLC | Accurate and efficient recording of user experience, gui changes and user interaction events on a remote web document |
| CN106484383A (zh) * | 2015-08-31 | 2017-03-08 | 阿里巴巴集团控股有限公司 | 页面渲染方法、装置及设备 |
| CN109375918A (zh) * | 2018-11-23 | 2019-02-22 | 天津字节跳动科技有限公司 | 小程序的界面渲染方法、装置、电子设备和存储介质 |
| CN110245311A (zh) * | 2019-04-17 | 2019-09-17 | 阿里巴巴集团控股有限公司 | 局部页面动态渲染方法及装置 |
Non-Patent Citations (1)
| Title |
|---|
| 戴志诚;程劲草;: "基于虚拟DOM的Web前端性能优化研究", 计算机应用与软件, no. 12 * |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113849697A (zh) * | 2021-09-10 | 2021-12-28 | 上海得帆信息技术有限公司 | 一种轻量的基于dom的流程图渲染方法 |
| CN113849697B (zh) * | 2021-09-10 | 2024-04-26 | 上海得帆信息技术有限公司 | 一种轻量的基于dom的流程图渲染方法 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN113051874B (zh) | 2023-12-26 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN102831121B (zh) | 一种网页信息抽取的方法和系统 | |
| KR101791623B1 (ko) | 트랜잭션 트레이스 그래프와 논리적 서브시스템들의 맵 사이의 관계들을 시각화하는 방법 | |
| US11100069B2 (en) | Element identification in a tree data structure | |
| CN107168705B (zh) | 图形界面语义描述系统及其建立方法和操作路径生成方法 | |
| CN109635210B (zh) | 行为数据的上报方法、装置、设备及存储介质 | |
| CN111382329A (zh) | 一种用于大数据分析的数据挖掘方法及系统 | |
| US20150193402A1 (en) | Tracking javascript actions | |
| CN111368241B (zh) | 基于XPath的网页元素识别方法 | |
| CN104516813A (zh) | 网络页面的测试节点的选取方法和装置 | |
| CN114201615B (zh) | 基于数据快照的科研数据变动回顾方法及服务器 | |
| CN113051874B (zh) | 一种用户行为数据渲染方法和装置 | |
| CN113177168B (zh) | 一种基于Web元素属性特征的定位方法 | |
| US8230319B2 (en) | Web-based visualization, refresh, and consumption of data-linked diagrams | |
| CN113987393A (zh) | 一种网页操作记录器、系统、装置及方法 | |
| EP4022481B1 (en) | Protecting user privacy in user interface data collection for native applications | |
| WO2012012905A1 (en) | Systems and methods of rapid business discovery and transformation of business processes | |
| CN116245052A (zh) | 一种图纸迁移方法、装置、设备和存储介质 | |
| CN113722191B (zh) | 页面监视方法、装置、设备和计算机可读存储介质 | |
| CN111125590A (zh) | 一种绘制热力图的方法及装置 | |
| CN117176480B (zh) | 一种攻击事件的溯源的方法与系统 | |
| US20240054174A1 (en) | Methods and systems for obtaining and storing web pages | |
| CN114327592A (zh) | 页面埋点方法、装置、电子设备及存储介质 | |
| US10642915B2 (en) | System and method for automatic advancement of navigation through a user interface | |
| US10740113B1 (en) | Determining and providing correlations between semantic constructs in a representation of functionality and semantic constructs in another representation of functionality | |
| EP4327201A1 (en) | Software testing |
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 | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |