Как будет более оптимально?

Question

[Сергей Ракипов]

Есть блок с классом samlpe, у него display:block
Я хочу с помощью JS скрыть его при наведении и у меня два способа:

• добавить класс hide со значением display:none
  
• у самого блока samlpe поменять display:none
  

Как лучше?

Comments

[VoidVolker]

Лучше/оптимальнее для чего?

[Сергей Ракипов]

скорости работы

[Сергей Ракипов]

Блоков может быть множество

[Сергей delphinpro]

Сергей Ракипов, Если говорить о скорости выполнения, то, во-первых, это преждевременная оптимизация, во-вторых, экономия на спичках. Так что тут абсолютно пофигу, какой вариант будет выбран.

Кстати, помимо этих двух, если еще способ с присвоением атрибута hidden.
myBlock.hidden = true;

[VoidVolker]

Сергей Ракипов в таком случае следует сначала реализовать оба варианта и затем провести нужные вам тесты скорости работы для каждого.

[Сергей Ракипов]

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

[Сергей delphinpro]

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

[Сергей Ракипов]

Сергей delphinpro, Представляешь, да есть такие люди которые не знают, для этого сюда заходят и спрашивают. Вот это да.
Как ты живешь в это удивительном мире что кто это этого не знает. Просто пиз...

[VoidVolker]

Сергей Ракипов https://jsperf.app/
Сергей delphinpro ой да ладно, хочется человеку поиграться - пускай играется ) Получит какой-то опыт, особенно в замере скорости решений, возможно в будущем сможет применить его на чем-то действительно важном.

[Сергей delphinpro]

VoidVolker, ну тогда ему нужно самому учиться замерять тайминги https://developer.mozilla.org/en-US/docs/Web/API/P...
а не волшебные сервисы искать =)

[Сергей delphinpro]

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

Answer 1

[historydev]

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

Конечно класс добавлять, его можно переиспользовать, как и функционал добавления этого класса вынести в отдельную js функцию. - чтобы можно было скрывать любой блок при вызове функции.

Если после скрытия блока, не предполагается его показывать, удали его, а не скрывай.

Answer 2

[Виктор]

скорости работы

Изменение класса быстрее (замеры проводили, можете воспроизвести)

Answer 3

[russeljo]

С применением класса будет более гибкий вариант. Если понадобиться программно скрыть/показать элемент, то при помощи класса это будет сделать проще как для одного элемента, так и для группы. Если в будущем надо будет изменить поведение, вместо исчезновения, например, сделать прозрачным, то достаточно подправить класс и не лезть править js.

Answer 4

[Николай Санников]

Насколько я помню, лучшей практикой считается, в данном случае добавить класс "hide", и туда прописать display:none; overflow:hidden; width: 0; height:0;
А потом тоглить класс hide, поскольку основной класс ты можешь использовать где нибудь еще, и забыть про то, что он у тебя меняет display, а hide класс говорящий и специально так не назовешь