Skip to content

Commit

Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
add benchmark and optimize addList worst case performance
Browse files Browse the repository at this point in the history
mdellanoce committed Sep 7, 2023
1 parent 58c9104 commit 464df83
Showing 3 changed files with 50 additions and 0 deletions.
11 changes: 11 additions & 0 deletions packages/rrweb/src/record/mutation.ts
Original file line number Diff line number Diff line change
@@ -128,6 +128,16 @@ class DoubleLinkedList {
}
this.length--;
}

public defragment() {
let current = this.head;
while (current) {
let next = current.next;
this.removeNode(current.value);
this.addNode(current.value);
current = next;
}
}
}

const moveKey = (id: number, parentId: number) => `${id}@${parentId}`;
@@ -368,6 +378,7 @@ export default class MutationBuffer {
}

let candidate: DoubleLinkedListNode | null = null;
addList.defragment()
while (addList.length) {
let node: DoubleLinkedListNode | null = null;
if (candidate) {
6 changes: 6 additions & 0 deletions packages/rrweb/test/benchmark/dom-mutation.test.ts
Original file line number Diff line number Diff line change
@@ -42,6 +42,12 @@ const suites: Array<
eval: 'window.workload()',
times: 5,
},
{
title: 'add and reorder 10000 DOM nodes',
html: 'benchmark-dom-mutation-add-reorder.html',
eval: 'window.workload()',
times: 5,
},
];

function avg(v: number[]): number {
33 changes: 33 additions & 0 deletions packages/rrweb/test/html/benchmark-dom-mutation-add-reorder.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
<html>
<body>
<select id="select"></select>
</body>
<script>
window.workload = () => {
const optionCount = 10000;
const options = [];
for (let i = 0; i < optionCount; ++i) {
const value = `${i}`;
options.push({ value, label: value });
}
const frag = document.createDocumentFragment();
const select = document.getElementById('select');
const parent = select.parentNode;
parent.removeChild(select);
for (let o of options) {
const option = document.createElement('option');
option.value = o.value;
option.textContent = o.label;
o.optionElement = option;
frag.appendChild(option);
}
select.appendChild(frag);
parent.appendChild(select);
// re-shuffle the options
options.sort(() => Math.random() - 0.5);
for (var o of options) {
o.optionElement.parentNode.appendChild(o.optionElement);
}
};
</script>
</html>

0 comments on commit 464df83

Please sign in to comment.