createElement vs. DOMParser (v2)

Revision 2 of this benchmark created on


Setup

function escapeHTML(s) {
	return s.replaceAll('&', '&amp;').replaceAll('<', '&lt;').replaceAll('>', '&gt;').replaceAll('"', '&quot;');
}

Test runner

Ready to run.

Testing in
TestOps/sec
createElement
const ul = document.createElement("ul");
for (let i = 0; i < 10000; i++) {
	const li = document.createElement("li");
	li.textContent = `${i}`;
	ul.append(li);
}
ready
DOMParser
const html = `<ul>${[...Array(10000).keys()].map((i) => `<li>${escapeHTML(`${i}`)}</li>`).join("")}</ul>`;
const ul = new DOMParser().parseFromString(html, "text/html").body.firstChild;
ready

Revisions

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