Run results for: document.createElement : direct assign vs Object.assign vs setAttribute

Run details:

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

Browser: Firefox 142

Operating system: Windows

Device Platform: Desktop

Date tested: 8 months ago

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

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);

Run results for: document.createElement : direct assign vs Object.assign vs setAttribute

document.createElement direct assign

using Object.assign with document.createElement

using setAttribute with document.createElement