В последние несколько лет я помогал многим клиентам и компаниям перейти на Микрофронтендс. Мы всегда начинаем с известного вопроса: Какой фреймворк использовать?.
Что ж, я проходил через этот процесс много раз и до сих пор останавливаюсь на этом вопросе. Проблема в том, что каждые несколько недель мы получаем новые фреймворки. В прошлом единственным доступным подходом был выбор серверной композиции. С NPM у нас появились Композиции времени сборки. Недавно, с развитием Webpack, у нас появились Композиции времени выполнения на клиенте. Самыми известными фреймворками для этого являются Single-SPA и Module Federation. (Список всех доступных фреймворков в этой статье)
Если вы новичок в Microfrontends, предлагаю вам прочитать следующую статью:
В Zulily мы использовали сочетание серверной композиции и композиции времени сборки. Недавно мы добавили в смесь композицию времени выполнения, чтобы иметь возможность разбивать приложения SPA на компоненты Microfrontends для большей автономии и владения доменом. Для композиции Client-Run-Time у нас есть два предпочтительных фреймворка: Single-SPA и Module Federation. Об обоих фреймворках я подробно рассказывал в предыдущих статьях. Они очень близки, но Module Federation предоставит вам больше свободы и преобразует Microfrontend в компоненты в том же SPA. Конечно, есть проблемы и с тем, и с другим. Самая большая проблема для обеих платформ - совместимость с приложением create-react-app (CRA). Следующие статьи покажут некоторые способы обойти извлечение CRA:
www.linkedin.com »
В то время как оба разделяют проблемы совместимости CRA, у Module Federation есть большая проблема. Плагин Module Federation работает только с Webpack 5. У CRA есть проблема совместимости с Webpack 5, и он все еще находится в альфа-фазе с множеством сбоев и взломов, чтобы заставить его работать (см. Https://github.com/facebook/ создать-реагировать-приложение / вопросы / 9994 ). Хотя использование Module Federation очень заманчиво, на данном этапе это также рискованно для CRA. Если мы думаем о будущем, мы можем пойти на риск, поскольку со временем все будет решено. Однако большинство компаний не пойдут на этот риск для новых проектов, созданных с помощью CRA. Столько хаков и исправлений ошибок, чтобы все заработало.
Поэтому, поскольку дата этой статьи - август 2021 года, Single-SPA является предпочтительным выбором, если ваша команда зависит от CRA. Однако, если вы являетесь экспертом в Webpack и можете настраивать сайты независимо от CRA, Module Federation будет лучшим выбором. К сожалению, большинство разработчиков зависят от CRA. Если вы полагаетесь на CRA, Single-SPA по-прежнему опасен, но более стабилен с меньшим количеством ошибок.
Вот несколько статей, которые могут помочь вам избавиться от CRA
Как насчет новых проектов?
Для новых проектов я предлагаю избегать CRA. Хотя он сохраняет много настроек, он ограничивает вас. Изучите Webpack и создайте свою собственную конфигурацию. Оно того стоит. В этом случае Module Federation будет лучшим выбором для Microfrontend. Для устаревших сайтов используйте композицию на стороне сервера или во время сборки, чтобы включить их в ваш недавно созданный Microfrontend. Подробнее читайте в следующих статьях:
====================
Когда начать?
Если вы решили избежать CRA и изучить Webpack, следующая статья будет вам хорошим подспорьем:
