Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Run results for:
replace content
Howto clear Element Content
Go to the benchmark
Embed
Embed Benchmark Result
Run details:
User agent:
Mozilla/5.0 (X11; Linux x86_64; rv:148.0) Gecko/20100101 Firefox/148.0
Browser:
Firefox 148
Operating system:
Linux
Device Platform:
Desktop
Date tested:
5 months ago
remove and insert
1444.7M/s
remove and replace
4.4M/s
replaceChildren
4.3M/s
View exact numbers
Test name
Executions per second
✓
remove and insert
1,444,650,496 Ops/sec
remove and replace
4,377,684 Ops/sec
replaceChildren
4,285,206 Ops/sec
HTML Preparation code:
<div id="container1"></div> <div id="container2"></div>
Script Preparation code:
const container1 = document.querySelector('#container1'); const container2 = document.querySelector('#container2'); for (let i=0; i<300; i++) { container1.appendChild(document.createElement('p')); container2.appendChild(document.createElement('p')); }
Tests:
replaceChildren
container1.replaceChildren(...container2.children);
remove and insert
while (container1.firstChild) container1.removeChild(container1.firstChild); while (container2.firstChild) container1.appendChild(container2.firstChild);
remove and replace
while (container1.firstChild) container1.removeChild(container1.firstChild); container1.replaceChildren(...container2.children);