Системный Аналитик

💠 Микрофронтенды – разбираем, что это такое



Микрофронтенды – это применение принципов микросервисного подхода к разработке фронтенда, при котором монолитный фронт разбивается на независимые части.



Идея микрофронтендов заключается в том, что монолитный фронт разбивается на куски, которые разрабатывают отдельные команды. Каждый кусок отвечает за определенный функционал и представляет собой отдельное веб-приложение, которое находится в отдельном репозитории. Это позволяет выстроить полноценную вертикаль релиза от бэка до фронта разными командами и на разных технологиях. При этом внешне для конечного пользователя ничего не меняется: все части фронта интегрируется друг с другом через общий интерфейс.



✏️ Пример использования



Допустим, у вас есть монолитное веб-приложение для электронной коммерции, которое включает каталог товаров, корзину, профили пользователей и систему оплаты. Мы решаем перейти на микрофронтенд-архитектуру, чтобы повысить гибкость и ускорить разработку.



Разделяем функциональность приложения на несколько микрофронтендов:

➖ Каталог товаров: отвечает за отображение списка товаров, фильтрацию и сортировку.

➖ Корзина: обрабатывает добавление товаров в корзину и оформление заказа.

➖ Профили пользователей: Отображает персональную информацию и историю заказов.

➖ Система оплаты: обрабатывает оплату заказов.



✅ Преимущества микрофронтендов



💩Сокращение времени до релиза (time-to-market). Так как команды могут релизить свои части независимо от других, это ускоряет процесс доставки нового функционала.



💩Гибкость и скорость разработки. Команды могут выбирать технологии, которые лучше подходят для их задач, и не зависеть от ограничений монолита.



💩Разделение ответственности. Каждая команда будет отвечать за один или несколько микрофронтендов. Каждый микрофронтенд будет находиться в отдельном репозитории, что позволят вести его независимую разработку, развёртывание и тестирование. Команды не будут завязаны на релизный цикл друг друга.



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



⛔️ Недостатки микрофронтендов



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



💩Необходимость согласования и совместимости между разными технологиями и командами. Если мы захотим в мире микрофронтендов поменять брендовый цвет с оранжевого на красный, то нам нужно будет попросить все команды изменить этот цвет у себя в компонентах, а в монолите на это ушло бы минут 20.



💩Дублирование кода. В микрофронтендах сложнее переиспользовать код. Конечно, есть решения: сделать библиотеку компонентов, вынести все утилиты в одно место, написать шаблоны, Но всё равно встречаются места, которые идентичны во всех проектах (например, конфиг) и когда наступит время это править, может быть больно.



Подборка материалов по микрофронтендам доступна в базе знаний по системному анализу



#архитектура