add benchmark for addList worst case performance

rrweb-io · Sep 11, 2023 · e6e87d2 · e6e87d2
1 parent 58c9104
commit e6e87d2
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 0 deletions.
diff --git a/packages/rrweb/test/benchmark/dom-mutation.test.ts b/packages/rrweb/test/benchmark/dom-mutation.test.ts
@@ -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 {

diff --git a/packages/rrweb/test/html/benchmark-dom-mutation-add-reorder.html b/packages/rrweb/test/html/benchmark-dom-mutation-add-reorder.html
@@ -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>