Я создаю визуализацию данных, и производительность рендеринга имеет решающее значение.Мой вопрос будет относиться к болотному стандарту HTML, хотя я использую SVG с JavaScript.
ОК, гипотетический сценарий: скажем, у меня 10000 узлов DOM с background-color из "red"и 10000 узлов DOM с background-color из" green ".Каждый узел создается циклом JavaScript.Я мог бы либо:
- установить атрибут
style на каждом узле, указав background-color узла: <element style="background-color:red;"/> установить атрибут classна каждом узле, а затем ссылаться на этот класс во встроенном стиле или во внешней таблице стилей:
<head><style>.foo {background-color:red;}</style></head>
<body><element class="foo"/></body>
Производительность загрузка код здесь совсем не важен - меня интересует только производительность рендеринга в браузере.Я также прекрасно понимаю, что атрибуты стиля обычно не так полезны или семантичны в повседневной разработке веб-сайтов, но у меня есть конкретный пример использования.
I am , интересующийсялогичные ответы, но было бы очень полезно услышать, что кто-то действительно проверял это или читал о чужих тестах (я искал информацию, но ничего конкретно не нашел по этому вопросу).
Спасибо за вашу помощь!