single vs multiple append (v2)

Revision 2 of this benchmark created on

Setup

const temp1 = document.createDocumentFragment()
const temp2 = document.createDocumentFragment()
const temp3 = document.createDocumentFragment()
const temp4 = document.createDocumentFragment()
const times = [...Array(5000).keys()]

Test runner

Ready to run.

Testing in
TestOps/sec
spread insertion
temp1.append(...times.map(i => {
	const div = document.createElement('div')
	div.textContent = 'Hello, World #' + i + '!'
	return div
}))
ready
loop insertion
for (i of times) {
	const div = document.createElement('div')
	div.textContent = 'Hello, World #' + i + '!'
	temp2.append(div)
}
ready
literal spread insertion
temp3.append(...times.map(i => `<div>Hello, World #${i}!</div>`))
ready
literal loop insertion
for (i of times) {
	temp3.append(`<div>Hello, World #${i}!</div>`)
}
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.