转载

微前端：DDD和微服务对客户端开发的好处 - thenewstack

首席架构师Luca Mezzalira在寻求将微服务的概念引入前端开发之后，看到它为快速发展的体育视频流媒体网站 DAZN （发音为“Da-Zone”）带来的好处。

微服务宗教还没有在前端网络和移动开发人员中看到很多转换 - 那些使用Vue，React，Angular或任何其他JavaScript框架提供流畅和动态用户体验的人，通常使用单页应用（SPA）原则。

可伸缩性仍然是前端社区的一个问题，不仅是代码库和依赖关系的增长，甚至是管理开发团队的方式。

当Mezzalira在公司快速发展时签约DAZN时，他需要一种方式来支持新的开发人员（该公司现在拥有数百家），同时仍然在越来越多的平台（最后计数为30）之上创新和构建新服务。

今天，DAZN网站作为一组SPA运行，每个SPA由不同的开发团队拥有。SPA可以通过服务器以浏览器方式呈现，在服务器端，JavaScript在持续集成阶段进行编译，并加载到Amazon S3存储桶中。 Lambda @ Edge 为每个页面执行微操作。这种方法允许候选测试版本，例如，德国Internet Explorer用户获得一个配置，而其他人获得另一个配置。

分解SPA巨石： 可以将部分应用程序用Vue.js编写，然后部分使用React并部分使用Angular。

领域和子域

在领域驱动设计方面，Mezzalira将微前端定义为“业务子域的技术表示。”它们提供了明确约束的强大边界，并避免与其他子域共享逻辑或代码。

领域是用软件解决的问题空间目标，例如，DAZN的领域是流媒体视频。领域分为多个子域：发现和回放，客户支持，身份验证等。可以将软件团队分配到每个子域，创建新的组织结构，最小化跨子域之间的通信。关键决策是在本地而非全局情况下进行的。理想情况下，组件应该反映在服务本身的开发组织结构中。（banq注：康威定律）

当浏览器访问DAZN站点时，会下载运行环境（昵称为“Bootstrap”），该运行环境会启动应用程序，设置I / O以及跨子域的路由和共享配置。Bootstrap收集有关用户特定配置的信息并获取相应的组件。

微前端的几种方法：

一种是使用基本的HTML iFrames元素，其中每个帧都有自己的子域。 Spotify 将此方法用于其基于Web的音乐流媒体服务。事件总线协调跨不同iFrame的事件。简而言之，该公司正在使用Web技术作为前端，而后端逻辑则使用C ++编写。

另一种方法是使用组件。在线预订服务 OpenTable 使用 OpenComponents 技术栈走这条路。这里，注册表包含构建应用程序所需的所有组件，每个团队都可以在注册表中找到他们想要的组件。

第三种方法涉及服务器端组合，其中Web应用程序的所有元素不是由浏览器而是由服务器组装的。时尚电子商务网站 Zalando 在 Project Mosiac 的帮助下使用这种方法，这是一个服务框架，库，以及组件应如何协同工作的规范。一个组件， Tailor 为每个呈现的页面创建一个微小的运行环境层，组装所需的每个HTML片段。使用Go编写，Tailor的灵感来自 Facebook的BigPipe 。

许多微前端JavaScript框架也可用于支持微前端的概念，包括 Single-SPA ，它将不同的SPA与微小的应用程序运行时联系在一起。 Frint 是另一种提供这种方法的软件包。

微前端确实带来了许多潜在的缺点：

一个是有效载荷大小的问题。每个组件都带来了自己的技术，总会出现大量代码重复，减缓用户体验，并可能在组件需要更新时产生依赖性.

另一个问题是，与微服务本身一样，是一种固有的复杂性。微前端中心将不可避免地导致需要管理更多资源 - 更多存储库，更多工具，更多构建/部署管道，更多服务器，更多领域等。

微前端也将带来他们自己的一套要求。配置和管理基础设施需要更多的自动化。

微前端还可能有意想不到的好处：前端开发人员往往每年都会换工作，在很多情况下，他们只是为了尝试新事物。微前端可以提供一种在不离开公司的情况下试验新技术和框架的方法。

原文 https://www.jdon.com/52910

正文到此结束