xuguopeng/rrweb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: record processMutation (#1214)

Browse Source 
* perf: record processMutation

* Create mean-tips-impress.md

* Apply formatting changes
This commit is contained in:
fukang wang
2023-05-01 10:15:58 +08:00
committed by GitHub
parent 1d169d585a
commit ebcbe8b0d7
4 changed files with 32 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/mean-tips-impress.md Normal file
View File

@@ -0,0 +1,5 @@
---
'rrweb': patch
---
perf: optimize the performance of record in processMutation phase

3
packages/rrweb/src/record/mutation.ts
View File

@@ -656,6 +656,9 @@ export default class MutationBuffer {
// this node was already recorded in other buffer, ignore it
if (this.processedNodeManager.inOtherBuffer(n, this)) return;
// if n is added to set, there is no need to travel it and its' children again
if (this.addedSet.has(n) || this.movedSet.has(n)) return;
if (this.mirror.hasNode(n)) {
if (isIgnored(n, this.mirror)) {
return;

6
packages/rrweb/test/benchmark/dom-mutation.test.ts
View File

@@ -30,6 +30,12 @@ const suites: Array<
eval: 'window.workload()',
times: 10,
},
{
title: 'create 1000 DOM nodes and append into its previous looped node',
html: 'benchmark-dom-mutation-multiple-descendant-add.html',
eval: 'window.workload()',
times: 5,
},
];
function avg(v: number[]): number {

18
packages/rrweb/test/html/benchmark-dom-mutation-multiple-descendant-add.html Normal file
View File

@@ -0,0 +1,18 @@
<html>
<body></body>
<script>
function addMultiNodes() {
const total = 1000;
let parent = document.body;
for (let i = 0; i < total; i++) {
const el = document.createElement('div');
el.textContent = `el-${i + 1}`;
parent.append(el);
parent = el;
}
}
window.workload = () => {
addMultiNodes();
};
</script>
</html>