Benchmark: document.createElement : direct assign vs Object.assign vs setAttribute

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

/*your preparation JavaScript code goes here
To execute async code during the script preparation, wrap it as function globalMeasureThatScriptPrepareFunction, example:*/
async function globalMeasureThatScriptPrepareFunction() {
    // This function is optional, feel free to remove it.
    // await someThing();
}

Tests:

document.createElement direct assign
var div = document.createElement('div'); div.class = 'sample-class'; div.hidden = true;
using Object.assign with document.createElement
Object.assign(document.createElement('div'), { id: 'sample-class', hidden: true });
using setAttribute with document.createElement
var div = document.createElement('div'); div.setAttribute('class', 'sample-class'); div.setAttribute('hidden', true);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
document.createElement direct assign
using Object.assign with document.createElement
using setAttribute with document.createElement

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:142.0) Gecko/20100101 Firefox/142.0

Browser/OS: Firefox 142 on Windows

View result in a separate tab

Test name	Executions per second
document.createElement direct assign	502645.6 Ops/sec
using Object.assign with document.createElement	510931.3 Ops/sec
using setAttribute with document.createElement	576429.8 Ops/sec

Related benchmarks:

document.createElement : direct assign vs Object.assign vs setAttribute (version: 2)

Comparing performance of: document.createElement direct assign vs using Object.assign with document.createElement vs using setAttribute with document.createElement

Created: 8 months ago by: Registered User

Jump to the latest result

document.createElement direct assign

using Object.assign with document.createElement

using setAttribute with document.createElement

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A