Benchmark: getAttribute vs dataset - Multiple Reads

HTML Preparation code:

<div id="foo" data-faa="faa" data-fee="fee" data-fii="fii" data-foo="foo" data-fuu="fuu" ></div>

Tests:

getAttribute
var element = document.getElementById("foo"); var i = 10000; while (i--) { var faa = element.getAttribute("data-faa"); var fee = element.getAttribute("data-fee"); var fii = element.getAttribute("data-fii"); var foo = element.getAttribute("data-foo"); var fuu = element.getAttribute("data-fuu"); }
dataset
var element = document.getElementById("foo"); var i = 10000; while (i--) { var dts = element.dataset; var faa = dts['data-faa']; var fee = dts['data-fee']; var fii = dts['data-fii']; var foo = dts['data-foo']; var fuu = dts['data-fuu']; }

Rendered benchmark preparation results:

Previous results

Test case name	Result
getAttribute
dataset

ⓘ Get performance results from real users on your website with Request Metrics.

Latest run results:

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

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

Browser/OS: Firefox 102 on Linux

Test name	Executions per second
getAttribute	45671.1 Ops/sec
dataset	60.1 Ops/sec

getAttribute vs dataset - Multiple Reads (version: 0)