Альтернативы
Статья находится в процессе написания
Чтобы ускорить ее появление, можно:
- 📢 Поделиться обратной связью в тикете (комментарии/эмодзи-реакция)
- 💬 Собрать в тикет накопленный по теме материал из чата
- ⚒️ Посодействовать любым другим способом
🍰 Stay tuned!
История архитектурных подходов
Big Ball of Mud
Статья находится в процессе написания
Чтобы ускорить ее появление, можно:
- 📢 Поделиться обратной связью в тикете (комментарии/эмодзи-реакция)
- 💬 Собрать в тикет накопленный по теме материал из чата
- ⚒️ Посодействовать любым другим способом
🍰 Stay tuned!
Что это; Почему так распространено; Когда это начинает приносить проблемы; Как быть; И как помогает в этом FSD
- (Статья) Oleg Isonen - Last words on UI architecture before an AI takes over
- (Доклад) Юлия Николаева, iSpring - Big Ball of Mud и другие проблемы монолита, с которыми мы справились
- (Статья) DDD - Big Ball of mud
Smart & Dumb components
Статья находится в процессе написания
Чтобы ускорить ее появление, можно:
- 📢 Поделиться обратной связью в тикете (комментарии/эмодзи-реакция)
- 💬 Собрать в тикет накопленный по теме материал из чата
- ⚒️ Посодействовать любым другим способом
🍰 Stay tuned!
О подходе; О применимости в фронтенде; позиция FSD
Про устарелость, про новый взгляд со стороны методологии
Почему компонентно/контейнерный подход - зло
Design Principles
Статья находится в процессе написания
Чтобы ускорить ее появление, можно:
- 📢 Поделиться обратной связью в тикете (комментарии/эмодзи-реакция)
- 💬 Собрать в тикет накопленный по теме материал из чата
- ⚒️ Посодействовать любым другим способом
🍰 Stay tuned!
Про что речь; позиция FSD
SOLID, GRASP, KISS, YAGNI, ... - и почему они плохо работают вместе на практике
И как она агрегирует эти практики
DDD
Статья находится в процессе написания
Чтобы ускорить ее появление, можно:
- 📢 Поделиться обратной связью в тикете (комментарии/эмодзи-реакция)
- 💬 Собрать в тикет накопленный по теме материал из чата
- ⚒️ Посодействовать любым другим способом
🍰 Stay tuned!
О подходе; Почему плохо работает на практике
В чем отличие, чем улучшает применимость, где перенимает практики
См. также
- (Статья) DDD, Hexagonal, Onion, Clean, CQRS, … How I put it all together
- (Доклад) Илья Азин - Feature-Sliced Design (фрагмент про Clean Architecture, DDD)
Clean Architecture
Статья находится в процессе написания
Чтобы ускорить ее появление, можно:
- 📢 Поделиться обратной связью в тикете (комментарии/эмодзи-реакция)
- 💬 Собрать в тикет накопленный по теме материал из чата
- ⚒️ Посодействовать любым другим способом
🍰 Stay tuned!
О подходе; О применимости в фронтенде; позиция FSD
В чем схожи (многим), чем отличаются
- (Тред) Про use-case/interactor в методологии
- (Тред) Про DI в методологии
- (Статья) Александр Беспоясов - Чистая архитектура на фронтенде
- (Статья) DDD, Hexagonal, Onion, Clean, CQRS, … How I put it all together
- (Доклад) Илья Азин - Feature-Sliced Design (фрагмент про Clean Architecture, DDD)
- (Статья) Заблуждения Clean Architecture
Frameworks
Статья находится в процессе написания
Чтобы ускорить ее появление, можно:
- 📢 Поделиться обратной связью в тикете (комментарии/эмодзи-реакция)
- 💬 Собрать в тикет накопленный по теме материал из чата
- ⚒️ Посодействовать любым другим способом
🍰 Stay tuned!
О применимости в фронтенде; Почему они не решают проблему; Почему это не единственный подход; позиция FSD
Framework-agnostic, conventional-подход
- (Статья) Про причины создания методологии (фрагмент про фреймворки)
- (Тред) Про применимость методологии для разных фреймворков
Atomic Design
Что это?
В Atomic Design сфера ответственности разделена на стандартизированные слои.
Atomic Design разбивается на 5 слоев (сверху вниз):
pages
- Назначение аналогично слоюpages
в FSD.templates
- Компоненты задающие структуру страницы, без привязки к контенту.organisms
- Модули состоящие из молекул, обладающие бизнес логикой.moleculs
- Более сложные компоненты, в которых, как правило, нет бизнес логики.atoms
- UI компоненты без бизнес логики.
Модули на одном слое взаимодействуют только с модулями, находящимися на слоях ниже, как в FSD. То есть, молекулы строятся из атомов, организмы из молекул, шаблоны из организмов, страницы из шаблонов. Также Atomic Design подразумевает использование Public API внутри модулей для изоляции.
Применимость во фронтенде
Atomic Design относительно часто встречается в проектах. Atomic Design популярнее среди веб-дизайнеров, нежели в разработке. Веб-дизайнеры часто используют Atomic Design для создания масштабируемых и легко поддерживаемых дизайнов. В разработке Atomic Design часто смешивается с другими архитектурными методологиями.
Однако, так как Atomic Design концентрирует внимание на UI компонентах и их композицию, возникает проблема реализации бизнес логики в рамках архитектуры.
Проблема заключается в том, что Atomic Design не предусматривает четкого уровня ответственности для бизнес-логики, что приводит к распределению по различным компонентам и уровням, усложняя поддержку и тестирование. Бизнес-логика становится размыта, что затрудняет четкое разделение ответственности и делает код менее модульным и переиспользуемым.
Как оно сочетается с FSD?
В контексте FSD некоторые элементы Atomic Design могут быть применены для
создания гибких и масштабируемых UI компонентов. Слои atoms
и molecules
можно реализовать в
shared/ui
в FSD, что упрощает переиспользование и поддержку базовых UI элементов.
├── shared
│ ├── ui
│ │ ├── atoms
│ │ ├── molecules
│ ...
Сравнение FSD и Atomic Design показывает, что обе методологии стремятся к модульности и переиспользованию, но акцентируют внимание на разных аспектах. Atomic Design ориентирован на визуальные компоненты и их композицию. FSD фокусируется на разбиении функциональности приложения на независимые модули и их взаимосвязи.
- Методология Atomic Design
- (Тред) Про применимость в shared/ui
- (Видео) Кратко о Atomic Design
- (Доклад) Илья Азин - Feature-Sliced Design (фрагмент про Atomic Design)
Feature Driven
Статья находится в процессе написания
Чтобы ускорить ее появление, можно:
- 📢 Поделиться обратной связью в тикете (комментарии/эмодзи-реакция)
- 💬 Собрать в тикет накопленный по теме материал из чата
- ⚒️ Посодействовать любым другим способом
🍰 Stay tuned!
О подходе; О применимости в фронтенде; позиция FSD
Про совместимость, историческое развитие и сравнение