Какую проблему решает BEM?

Question

[xlusv]

1. Приведите, пожалуйста, реальный пример ситуации когда использование правил именования BEM оправдывает свое назначение (насколько я понимаю - изоляция компонентов).
2. В чем проблема традиционного именования?
3. Есть ли лучшие альтернативы решения этой задачи (сейчас или в обозримом будущем)?

Comments

[Алексей Ярошевич]

1. Любой интерфейс. 2. При чем тут БЭМ? 3. Сырые веб компоненты.

Answer 1

[Briss]

https://ru.bem.info/method/solved-problems/ вот здесь в принципе есть и примеры, о объяснения.

Если коротко - то БЭМ увеличивает реиспользуюемость кода, то есть вы можете различные блоки из вашего кода применять в других проектах.

Comments

[xlusv]

Пробежался по тексту и все же не до конца понял, чем же хуже каскад.
Например:

.nav__item
.snippets__item

или

.nav .item
.snippets .item

Как в данном случае bem увеличивает переиспользуемость?

[Денис Малиночкин]

xlusv: в любой момент может появиться третий селектор, который также включает в себя стили для класса item. В этом случае вам придется использовать либо селектор прямого потомка (почитайте о RSCSS), либо БЭМ. Разумеется, если вы решите использовать блок внутри другого блока.

[xlusv]

Денис Малиночкин: Вас не затруднит привести пример на jsfiddle?