Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Element.append vs Node.appendChild
(version: 1)
Comparing performance of:
Element.append vs Node.appendChild
Created:
3 months ago
by:
Guest
Go to the latest result
HTML Preparation code:
<div id="testDiv"></div>
Script Preparation code:
// async function globalMeasureThatScriptPrepareFunction() {}
Tests:
Element.append
"use strict"; for (let i=0; i<100; i++) { const p = document.createElement("p"); p.textContent = i; testDiv.append(p); } testDiv.innerHTML="";
Node.appendChild
"use strict"; for (let i=0; i<100; i++) { const p = document.createElement("p"); p.textContent = i; testDiv.appendChild(p); } testDiv.innerHTML="";
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Element.append
Node.appendChild
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
3 months ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/26.4 Safari/605.1.15
Browser/OS:
Safari 26 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Node.appendChild
15K/s
Element.append
14K/s
View exact numbers
Test name
Executions per second
✓
Node.appendChild
14,673 Ops/sec
Element.append
13,793 Ops/sec
Related benchmarks
textContent vs innerText
createElement vs createDocumentFragment
createElement vs createDocumentFragment 1
appendChild vs append 2
textcontent vs nodevalue vs content:after
textContent vs innerHTML vs innerText vs
Comments
Confirm delete:
Do you really want to delete benchmark?