Ок. У нас сегодня последняя большая тема, в выходные будет формат полегче. Перед тем как к ней переходить несколько тезисов из прошлых дней:
- Я считаю что модель верстки компонентами для любого крупного проекта подходит лучше, чем любай другая.
- Компонент включает HTML, CSS, JS, тесты, локализации, мануал и т. д. Эти файлы проще всего хранить и использовать вместе.
- Браузер это ассемблер которому мы кормим оптимизированный машинный код в разных форматах.
- CSS, JS и HTML должны знать структуру друг друга, это позволяет гораздо эффективнее их сокращать, пожимать и оптимизировать.
Использование в последние годы штук вроде Webpack, React и CSS Modules меня лично убедило что при таком подходе к коду жить проще и приятнее.
Это все хорошо пока ты делаешь SPA, но есть проекты которым противопаказано быть SPA, а пользы от компонентов и оптимизаций было бы много.
Это сайты магазинов (Amazon), новостные сайты (NY Times), справочники организаций и многие другие.
Сегодня я хочу поговорить о том как быть создателям таких сайтов и что нужно сделать, чтобы вся эта радость появилась и у них тоже.
Мне кажется что сейчас у активного переноса таких подходов на сервер есть два препятствия:
- В серверной верстке шаблоны до сих пор пишутся, обрабатываются и рендерятся отдельно от CSS и JS, хотя сборка ассетов и переехала в ноду.
- Завязанность большинства современных компонентных решения на SPA и VirtualDOM.
Вторую тему я пытался поднять вчера и возможно мы к ней еще вернемся. Но сегодня я хотел про первую поговорить.
Итак, главный мой сегодняшний тезис: Я считаю что в ближайшие годы, в крупных проектах шаблонизаторы вслед за ассетами тоже переедут в ноду.
Тут сразу появляется вопрос – как? Собрать ассеты можно один раз и больше не трогать, а вот шаблон нужно рендерить при каждом запросе.
Как – возможны варианты. :) Про те что я знаю, я расскажу примерно через час и тогда же обсудим ваши предложения и вариты тоже.
@harisov ну БЭМ же! ;)
Да-да, БЭМ я помню. И меня очень печалит что для описанного мной юзкейса больше ничего и нет.
Поэтому я вот и пытаюсь привлечь внимание к проблеме 4-й день уже! :)
А вот если серьезно, БЭМ – это технология авторы которой лучше всего понимают те задачи и проблемы которые надо решать для крупных проектов.
И ЧСХ они их даже решают как-то, но вот способы которыми они в итоге их решают как правило заставляют шевелиться волосы у меня на голове.
Мне кажется можно как-то проще всегда.
Но тем не менее шаблонизатор БЭМ'а работает как раз на Ноде и как раз его пользователи смогут нам накидать больше всего примеров интерграции.
Вот как раз Ваня Воищев во вторник прсылал такую ссылку: https://t.co/GPMpI3RpuR Тут описаны основные варианты интерграции.
Я в своей практике пробовал только варианты 1 и 2 оттуда правда.
Вариант 1 – когда вы поднимаете Экспресс, делаете свой роутер, котроллеры и проч., а бэкенд только как API для используете.
Он хорош когда вы на одних данных хотите сделать несколько представлений: сайт, iOS, Android, в остальных случаях старайтесь избегать его.
Избегать – потому что вам придется потворять самим кучу того что Rails, Django, Laravel и проч. умеют делать из коробки и лучше.
Вариант 2 – когда Rails, Django, Laravel делают свю работу, но на выходе из условного контроллера вместо шаблона отправляют JSON в Ноду.
Нода возвращает им HTML и дальше как обычно.
Мы делали вариацию второго подхода году в 2013-м, когда в JetStyle разрабатывали для Яндекса проект на Django, BEM и LEGO.
В Django Templates мы генерировали BEMJSON для страницы, отправляли его в ноду и получали назад уже HTML. Было довольно удобно.
Про третий пусть расскажут те кто пробовал. Ну и вобоще поделитесь опытом если кто делал себе что-то такое? :)
Вот пример интеграции Django и React по похожей модели: https://t.co/Msqz61vxjw на вход – имя шаблона и JSON, на – выход HTML.