Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Remove children
(version: 0)
Comparing performance of:
Loop vs innerHTML vs innerText
Created:
5 years ago
by:
Guest
Jump to the latest result
HTML Preparation code:
<div id='foo'></div>
Script Preparation code:
let parent = document.getElementById('foo'); for (let i = 0; i < 1000; i++) { let child = document.createElement('div'); parent.appendChild(child); }
Tests:
Loop
const parent = document.getElementById("foo") while (parent.firstChild) { parent.firstChild.remove() }
innerHTML
const parent = document.getElementById("foo") parent.innerHTML = "";
innerText
const parent = document.getElementById("foo") parent.innerText = "";
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
Loop
innerHTML
innerText
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:
removeChild vs children.remove
Removal of DOM Element's Children (removeChild vs remove vs innerHTML vs textContent)
Append children or appendChild in loop
Append children VS appendChild in loop VS replaceChildren
Comments
Confirm delete:
Do you really want to delete benchmark?