Benchmark: template vs documentFragment

Script Preparation code:

const html = "<span class='eChat-Custom-group-member Right'>5 members</span>"

Tests:

createElement
const template = document.createElement("template"); template.innerHTML = html.toString().trim(); document.body.appendChild(template.content.firstChild);
createDocumentFragment
var frag = document.createDocumentFragment(); frag.innerHtml = html.toString().trim(); document.body.appendChild(frag);

Rendered benchmark preparation results:

Previous results

Test case name	Result
createElement
createDocumentFragment

Latest run results:

Run details: (Test run date: 8 months ago)

User agent: Mozilla/5.0 (X11; Linux x86_64; rv:145.0) Gecko/20100101 Firefox/145.0

Browser/OS: Firefox 145 on Linux

createDocumentFragment

1.0M/s

createElement

339K/s

View exact numbers

Test name	Executions per second
✓ createDocumentFragment	1,035,544 Ops/sec
createElement	338,952 Ops/sec

template vs documentFragment (version: 1)