Run results for: DOM structure: bottom up vs top down

Run details:

User agent: Mozilla/5.0 (X11; Linux x86_64; rv:132.0) Gecko/20100101 Firefox/132.0

Browser: Firefox 132

Operating system: Linux

Device Platform: Desktop

Date tested: one year ago

Benchmark engine: Benchmark.js

Top down

142K/s

Bottom up

133K/s

View exact numbers

Test name	Executions per second
✓ Top down	141,915 Ops/sec
Bottom up	132,957 Ops/sec

Tests:

Bottom up
const ul = document.createElement('ul'); for (const d of '123456') { const li = document.createElement('li'); li.textContent = d; ul.appendChild(li); } const container = document.createElement('div'); container.appendChild(ul);
Top down
const ul = document.createElement('div') .appendChild(document.createElement('ul')); for (const d of '123456') { const li = document.createElement('li'); li.textContent = d; ul.appendChild(li); }