Что вы думаете о заворачивании bemjson в immutables?

[qfox]

Суть: получить виртуальное BEM-дерево в виде Immutable BEMJSON, из которого получать реальный (а может виртуальный) DOM тогда, когда меняется BEMJSON.

Например, с помощью этого: https://github.com/facebook/immutable-js

Цель: Получить виртуальный слой в памяти с деревянной структурой ради оптимизации отрисовки и в привычном окружении (аля реакт, но в бэм терминах).

Pros/cons?

upd: Реализация может быть такой:

• На морду вместе с HTML выгружаем каким-то образом BEMJSON вместе с HTML (например, в data-bemjson как есть или более разумно подготавливая атрибуты для каждой дом ноды c сущностью — трехпроходная шаблонизация?);
• На морде при инициализации восстанавливаем BEMJSON дерево, используя этот атрибут;
• Восстановленое дерево засовываем в Immutable.Map(restoredBemjson);
• Все изменения состояний и контента делаем через i-bem и через этот объект;
• Отрисовываем Пушим изменения в DOM, если объект поменялся (если a.set('key', 'newvalue') !== a — https://github.com/facebook/immutable-js#the-case-for-immutability);
• ...
• PROFIT!!!11

Что-то упустил?

[Guria]

:fire: очень хочу такое

[qfox]

Добавил примерный способ реализации

[tadatuta]

cc @veged

[veged]

а как строится первоначальный BEMJSON и как потом в нём происходят изменения?

[qfox]

@veged Вот что-то, а такого вопроса от тебя не ожидал. Либо руками пишется, либо priv.js, либо bemtree, etc.

Потом — через i-bem.js, например.

[veged]

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

[qfox]

@veged Ты сейчас смотришь на BEMJSON как нечто на сервере один раз собранное и использованное для формирования HTML. Я смотрю на него, как на структуру приложения уже на фронте. Может быть в этом дело?

Т.е. я предлагаю не терять эту информацию на клиенте и работать там с теми же блоками, и хранить не в HTML (или не только в HTML), но и в неком BEMJSON. i-bem.js сейчас реализует это все через HTML и API браузера, но если поднятся над реализацией — то он ищет в BEMJSON нужные экземпляры описанных блоков.

Процесс генерации же для меня — это сугубо серверная часть. На клиенте — либо загрузка уже сгенерированного и отданного с сервера дерева, либо восстановление BEMJSON из HTML (с расставленными метками-биндингами-как угодно).

А далее — i-bem.js уже работает с HTML в терминах блоков и элементов, не вижу никаких проблем работать не напрямую с HTML, а с прослойкой в виде иммутабл BEMJSON.

[veged]

я пока так ничего конкретного и не понял :-( можешь набросать прототип? я не понимаю, как i-bem.js будет работать с BEMJSON (ещё и immutable, для меня это означает, что его весьма сложно модифицировать)

[qfox]

@veged Смысл не в том, что сложно модифицировать. Смысл в copy-on-write.

Ок, проще набросать ;)

[awinogradov]

Почему бы напрямую не выбросить объект в js c bemjson? Еще как вариант пробрасывать свои атрибуты на блок и элемент и по ним восстанавливать.

[qfox]

@verybigman Есть ряд проблем:

• i-bem.js не умеет работать с бэм-сущностями (парадокс), только с HTML, возможно что-то изменится в v3, хотя врядли;
• .apply у BH и BEMHTML возвращает строку с HTML (с которой дальше работает i-bem.js);

У BH есть processBemjson, которая возвращает полный BEMJSON, который можно завернуть в Immutable Map и дальше строить HTML при изменениях. В этом случае появляется тот самый Virtual BEM. Но надо еще BEMHTML научить возвращать полный BEMJSON, и c i-bem куча вопросов.

[pavelpower]

@zxqfox класс, а ведь есть еще и PostHTML

Ну и круг замкнется BEMJSON -> DOM -> HTML -> BEMJSON -> DOM для всяких там тестов классно. И immutableMap строить на BEMJSON как собственно ты говоришь.

Только медленно...

[qfox]

@pavelpower Что именно медленно?) Развернешь свою мысль?

[voischev]

@zxqfox что для нас быстро для @pavelpower обычно медленно ;)

[DimitryDushkin]

Идея отличная. Получилось что-нибудь?

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

[qfox]

@DimitryDushkin можем голосом обсудить)