На чем в проекте написаны Micro Frontends

«На чем в проекте написаны Micro Frontends» — вопрос из категории Архитектура, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

Micro Frontends можно реализовать на разных технологиях, в зависимости от потребностей проекта. Основные подходы:

  1. Фреймворки: React, Vue, Angular, Svelte. Каждый микросервис может использовать свой фреймворк.
  2. Web Components: Нативный способ, независимый от фреймворков.
  3. Module Federation (Webpack 5+): Позволяет загружать части приложения из разных сборок.
  4. Iframe: Простое, но ограниченное решение для изоляции.

Пример с Module Federation:

// webpack.config.js (host)
new ModuleFederationPlugin({
  name: 'host',
  remotes: {
    app1: 'app1@http://localhost:3001/remoteEntry.js',
  },
});

Ключевое преимущество — независимое развертывание и разработка частей приложения.