Усовершенствование BEM или «ненужно»?

Question

[kiberlain]

Уже больше года верстаю по БЭМу. Как бы о достоинствах этой методологии (я вообще считаю, что она должна быть всеми принята как стандарт в вёрстке:) нет смысла говорить. Хочу обратить внимание на одну досадную особенность - многословность. Особенно это относится к модификаторам.
Вот например кусок обычной разметки - есть компонент ряд с колонками ("_c-row"), есть дочерние элементы ("__col"), и модификаторые меняющие их размер в зависимости от размера экрана ("--md-2-2")

<div class="_c-row">
  <div class="_c-row__col--1-2 _c-row__col--md-2-2">1</div>

мне кажется избыточным упоминание компонента _c-row__col в каждом классе (тупо просто потому что нафиг его вспоминать в каждом дочернем классе)
так почему бы не отделить модификаторы --1-2 и --md-2-2 от имени компонента?
Я озадачился такими вопросами и полез в нашу любимую социальную сеть вкон... github. Пересмотрел там кучу сеток и наткнулся на концепцию BEMV. Мне понравилась идея отделения модификаторов от компонент. Ну почему бы действительно не использовать отдельный класс .--tablet-size-50 чтобы блок можно было сделать на 50% меньше? ЧТобы не писать каждый раз

<div class="_c-row">
  <div class="_c-row__col _c-row__col--mobile-1-2 _c-row__col--tablet-2-2">1</div>

предлагаю писать

<div class="_c-row">
  <div class="_c-row__col --mobile-1-2 --tablet-2-2">1</div>

почему бы really не отделить модификаторы от имён компонент? Или вообще (к примеру) все "сеточные" блоки объявлять в своей области видимости в каком-нить - например [data-layout="_c-row"]. Что в этом плохого?

Answer 1

[Денис Инешин]

Суть БЭМ не только в таком именовании, но и в том, что вы можете в любой момент взять любой блок, в любом сочетании и перенести в другое место и все будет работать. Никаких конфликтов, никаких коллизий имен, никаких зависимостей от областей видимости. В этом его сила.

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

То что вы предлагаете, конечно тоже имеет право на существование. Используйте в своих проектах, если вам это подходит.

Answer 2

[i]

Такой подход называется: "модификаторы через extend."

Если не писать HTML руками, этот вопрос теряет смысл.

Есть риск скатиться в императивное описание названий модификаторов.

Повышает необходимую квалификацию специалиста, в практике этого подхода особенно критичным становится необходимость понимания: "что я делаю и какие могут быть последствия".

Есть практики этого похода https://twitter.com/ihorzenich/status/776395453533...

На БЭМ форуме этот вопрос периодически обсуждается, надо поискать.

Думаю, не может быть однозначного ответа на этот вопрос.

Answer 3

[Ivan Bogachev]

так почему бы не отделить модификаторы --1-2 и --md-2-2 от имени компонента?

Поздравляю! Вы изобрели кусок rscss. Осталось попробовать остальные его части, и, быть может, в выражении

я вообще считаю, что она должна быть всеми принята как стандарт в вёрстке

слово БЭМ постепенно отъедет на второй план :)

P.S.: с двух дефисов имя класса начинаться не может.

Answer 4

[Vasyl Kovbassa]

может, я что-то не так понял, потому что от твоих дефисов, глаза разбегаются ... Семантика есть еще такое понятие, между прочим. Но, чем твое предложение отличается от концепции bem примиси?
И кто это в 2017 году руками пишет? Пойди лучше загугли о pug да sass и как эту всю историю собрать с gulp или webpack.

Answer 5

[GreatRash]

Уже года два так делаю. Проблем никаких.

Comments

[Денис Инешин]

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