Benchmark: Test content attribute vs html element

HTML Preparation code:

<div class="js-tooltip" data-tooltip-content="test"></div>
<div class="c-tooltip">test</div>

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:

content attribute
var tooltip = document.getElementsByClassName("js-tooltip")[0]; console.log(tooltip.nextElementSibling.innerHTML);
html element
var tooltip = document.getElementsByClassName("js-tooltip")[0]; console.log(tooltip.dataset.tooltipContent);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
content attribute
html element

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36

Browser/OS: Chrome 134 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
content attribute	647325.9 Ops/sec
html element	650371.7 Ops/sec

Related benchmarks:

Test content attribute vs html element (version: 1)

Comparing performance of: content attribute vs html element

Created: one year ago by: Guest

Jump to the latest result

content attribute

html element

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A