HTML5 data attribute - dataset vs getAttribute (v3)

Revision 3 of this benchmark created on


Preparation HTML

<div id="A" data-say1="ay" data-say2="ay" data-say3="ay" data-say4="ay" data-say5="ay" data-say6="ay" data-say7="ay" data-say8="ay" data-say9="ay"></div>

Setup

var element = document.getElementById('A'),

Test runner

Ready to run.

Testing in
TestOps/sec
getAttribute
var dataset = {},
                        dataRegEx = /^data-([a-z_\-\d]*)$/i,
                        attr = element.attributes,
                        i = attr.length,
                        match,
                        camelize = function (str) {
                                var strRegEx = /\-([a-z])/ig;
                                return str.replace(strRegEx, function (match, chr) {
                                        return chr ? chr.toUpperCase() : '';
                                });
                        };
                                while (i) {
                                        i -= 1;
                                        match = attr[i].name.match(dataRegEx);
                                        if (match && match[1]) {
                                                dataset[camelize(match[1])] = attr[i].value;
                                        }
                                }
ready
get dataset
var dataset = element.dataset;
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.