Benchmark: createElementNS vs cloneNode

Tests:

createElementNS
const list = [] let n = 1e5 while (--n) { const c = document.createElementNS('http://www.w3.org/2000/svg', 'circle') c.setAttribute('cx', 39) c.setAttribute('cy', 0) c.setAttribute('r', 20) list.push(c) }
cloneNode (shallow)
const list = [] let n = 1e5 - 1 const c = document.createElementNS('http://www.w3.org/2000/svg', 'circle') c.setAttribute('cx', 39) c.setAttribute('cy', 0) c.setAttribute('r', 20) list.push(c) while (--n) { list.push(c.cloneNode(false)) }
cloneNode (deep)
const list = [] let n = 1e5 - 1 const c = document.createElementNS('http://www.w3.org/2000/svg', 'circle') c.setAttribute('cx', 39) c.setAttribute('cy', 0) c.setAttribute('r', 20) list.push(c) while (--n) { list.push(c.cloneNode(true)) }

Rendered benchmark preparation results:

Previous results

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:147.0) Gecko/20100101 Firefox/147.0

Browser/OS: Firefox 147 on Mac OS X 10.15

cloneNode (deep)

28/s

cloneNode (shallow)

28/s

createElementNS

16/s

View exact numbers

createElementNS vs cloneNode (version: 1)