Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
JS: insertBefore vs appendChild vs prepend vs insertAdjacentElement vs after
(version: 0)
Comparing performance of:
insertBefore vs appendChild vs prepend vs insertAdjacentElement vs after
Created:
3 years ago
by:
Guest
Jump to the latest result
HTML Preparation code:
<div id="container"></div>
Script Preparation code:
var container = document.getElementById("container"); var paragraph = document.createElement("p");
Tests:
insertBefore
container.insertBefore(paragraph, null);
appendChild
container.appendChild(paragraph);
prepend
container.prepend(paragraph);
insertAdjacentElement
container.insertAdjacentElement('afterbegin', paragraph);
after
container.after(paragraph);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (5)
Previous results
Fork
Test case name
Result
insertBefore
appendChild
prepend
insertAdjacentElement
after
Fastest:
N/A
Slowest:
N/A
Latest run results:
No previous run results
This benchmark does not have any results yet. Be the first one
to run it!
Related benchmarks:
_.isEmpty() vs Object.keys().length populated objects
JavaScript spread operator vs Object.assign performance - Kien Nguyen
queryselector vs getelementbyid with classes and ids
While loop parentElement vs closest (vanilla javascript)
array.from.map vs array.from with map
Comments
Confirm delete:
Do you really want to delete benchmark?