Javascript-форум - Переменная в классе или датасете

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Переменная в классе или датасете (https://javascript.ru/forum/misc/73828-peremennaya-v-klasse-ili-datasete.html)

Переменная в классе или датасете

Приветствую всех. Как-то так вышло, что еще давно пришла в голову идея передавать переменные из html в js через имя или класс. Уже как давно используется dataset. Но, вот, провел эксперимент:
Создал обычный селект (эта часть кода не входит в эксперимент):
var select = document.createElement("select");
select.classList.add("a-b-c");
select.id = "s";
select.dataset.info = "{'a':'a','b':'b','c':'c'}";
document.body.appendChild(select);

А вот тут уже пошел эксперимент - извлекаю переменные при помощи резки:

var result = document.getElementById('s').className.toString(). split("-");
console.log(result);

и при помощи датасета:

var resultx = document.getElementById('s').dataset.info;
console.log(resultx);

Результат получился такой:
(3) ["a", "b", "c"]
name time = 3.6999999974796083

{'a':'a','b':'b','c':'c'}
dataset time = 15.700000003562309

Во сколько раз быстрее даже со split получается извлечь переменные из класса. Но загрузил код в бенчмарк (http://jsben.ch) и получил такую, вот, картинку (в приложении). Дык, как это работает, что быстрее, стоит ли извращаться или спокойно использовать датасеты? Интересны адекватные объяснения.
https://scontent.fiev2-1.fna.fbcdn.n...&oe=5 B9A109A

document.getElementById('s').className.~~toString()~~. split("-");

класснейм уже стринг

Лишнее настрочил, согласен. Но на скорость не повлияло все равно.
http://jsben.ch/C7q0c

Проделал несколько раз и получается такая картина, что датасет первый раз исполняется медленнее, но затем набирает скорости и исполняется быстрее. А бывает так, что датасет сразу выдает хорошие результаты. Однако у меня на локалхосте датасет все равно проигрывает.

somejs,
Раз ваш датасет быстрей и без доп заморочек используйте его.

когда гоняют бенчмарки для того чтобы увидеть конкретную разницу методов, все общие методы и вообще весть код который к ним не относится из теста выносят нафик, оставляя только то, без чего тестировать не удастся.

j0hnik,
Благодарю за правку теста. Вынес также у себя на локалхосте. Результат такой:
name time = 0.09999999747378752

dataset time = 15.900000005785841

Что-то не шуточно проигрывает датасет, когда бенчмарк говорит об обратном.

Вот, сохраните в хтмл и запустите. В идеале, методы делал на две страницы, а тут слил для удобства сбросить.

<html>

<body>
<p id="p1"></p>
<p id="p2"></p>
<script type="text/javascript">
var select = document.createElement("select"); 
select.classList.add("a-b-c"); 
select.id = "s"; 
select.dataset.info = "{'a':'a','b':'b','c':'c'}"; 
document.body.appendChild(select); 
var el = document.getElementById('s');

var time = performance.now();

// some code 
el.className.split("-");

time = performance.now() - time;
document.getElementById('p1').innerHTML="name time = "+time;


var timex = performance.now();

// some code 
el.dataset.info;

timex = performance.now() - time;
document.getElementById('p2').innerHTML="dataset time = "+timex;
</script>
</body>
</html>

Цитата:

Сообщение от somejs

Вот, сохраните в хтмл и запустите.

[HTML run][/HTML]

:-?

somejs,

[HTML run][/HTML]

-запускаемый код

переставьте ваши замеры местами и увидите другой результат.

а еще тест от теста разброс огромный

чтобы performance хоть как то адекватно показал скорость нужен цикл и много итераций, их количество зависит от "тяжести" кода.

для того и существуют бенчмарки, чтобы не заворачиваться а закинуть и посмотреть.

https://jsperf.com/ - этот я считаю самым адекватным, в вашем присутствует разброс. больше 1%, (раз замерил 83%, повторно мерию +84%)