序言
Angular是两个采用 HTML 和 JavaScript 撰写的 Web 后端构架,可用于撰写两个网页的 JavaScript 应用领域,这些应用领域能数次采用或稍加调整德博瓦桑县今后采用。
为了扩充商品的规模,每一间组织在高速成长的过程中都要直面一连串的考验:项目组并购,优先选择恰当的控制技术栈,项目间的见下文,以及可扩充性。在现代世界中,他们会有微服务项目为丛藓科扭口藓耦应用领域程序。这在服务项目端是全然可取的,但在后端应该怎样操作方式?在此,微后端(Micro Frontend)就出现了,这近似于微服务项目,但它并不是保有两个模块,而要保有整个销售业务并集。让他们来看一下,它有甚么益处,它又会怎样改变 Angular 的未来。
为甚么需要微后端?
微后端:是将一般而言模块或网页代销在分立的域中,并与主要的 shell 应用领域(寄主应用领域程序)资源整合的一种应用程序体系结构。每两个微应用领域都有两个完备的销售业务并集,因此具有以下特点:
归一队项目组保有。这并不表示只有一队项目组会负责管理复原所有 bug。而要意味著,每一并集都有两个专门针对的项目组,他们具有销售业务方法论和控制技术栈各方面的科学知识。隔绝销售业务的一部分带来了益处,而部分雇员的离任并不会对公司的商品和销售业务造成任何影响。如果你对销售业务并集有甚么疑点,你能即时与项目组联络,而非个人。项目组里的每两个核心成员都要把自己的科学知识短片通过文件格式和科学知识共享资源会议传递给他们。
分立实现。保有微应用领域的项目组在优先选择控制技术栈各方面保有全然的民主自由。它能是是两个不同的构架,代码课堂教学或构架。尽管分量越高,稳定性越少,但他们还是要和保有另两个微应用领域的其他项目组完全一致,最少是在构架的优先选择上。这样,它能精简技师们在项目组间的过渡阶段,因此使共享资源和软件系统具有可宠信的小组件的库成为可能。
分立部署。由于每一微应用领域被代销在单独的域中,因此它们都必须单独部署。这会迫使你构建多个管道,这有时可能是个考验。首先,你必须注意顺序,以防一些微应用领域共享资源共同的依赖关系、库、模块和工具。此外,一定要保证每一管道都尽可能地解耦。这样就能并行运行,因此能大大加快构建的速度。
解耦。微应用领域必须尽可能地解耦。理想情况下,它们间不应该存在依赖关系。它们只能通过共享资源库来共享资源数据,如状态、UI 小组件、接口和工具帮助。这一部分需要在体系结构阶段进行额外的工作,以创建合适的抽象。另一各方面,重要的是要找到平衡点,不要过度设计。
可扩充性。微后端构架最大的优点就是可靠性。即使其中两个微应用领域失效,其他的也能正常工作。这对保有多个大型分立功能的大型 Web 应用领域十分重要。让他们想象一下 Facebook,如果其中两个功能,如群组,被删除后,用户仍然还能够与朋友聊天。
健壮的微后端构架
有甚么方法可以实现微后端构架,有两个可能的途径:
微后端作为两个模块。在这种情况下,微应用领域更加细化。它作为两个小组件,能在各种应用领域中重复采用。这种方法的问题在于,它让微应用领域间的耦合变得更加紧密。创建两个合适的抽象可能会很复杂,而且很容易削弱微后端构架的优势。
微后端作为两个网页。通过这种方法,他们就能为每两个微应用领域提供两个单独的网页。相对于以前的方法,这使得他们能避免父子间的紧密依赖关系。所以,这是实现微后端构架最常用的方法。
微应用领域间共享资源数据的方法
在构架微后端中,最大的考验之一就是数据共享资源。数据能有不同的类型,如 状态 , UI 模块 ,或 工具函数 。确保你的微应用领域没有包含任何 数据存储状态,因此必须将其分离到两个可共享资源的数据层。你能想象它近似于后端-后端通信,其中后端是微应用领域,后端(数据层)是可共享资源的库。此外,UI 模块和实用工具也将属于同两个 Bucket,作为可宠信的共享资源库。这个理念与单体仓库(monirepo)原理有着密切的重叠。它通过共享资源数据确保了应用领域程序间的一致性。
还有一些他们需要提到的微应用领域间的通信方式。首先,他们能利用浏览器的存储功能。能是 localStorage、sessionStorage、用于存储会话数据或用户元数据的 Cookie,也能是 indexedDB 中一些更复杂的数据结构。除了这些,你还能简单地通过路由器的查询参数在微应用领域间进行数据传输。
为甚么是 Angular?
Angular 提供了已定义的构架,与单体仓库原理和微后端的最佳课堂教学相一致。
高级构架分为三个主要部分: 工作区 、 项目 和 库 。 通过对 Angular 工作区的初始化,他们生成了两个单体仓库应用的骨架,并进一步包括了项目和库。每一项目 都能是两个具有单独入口点的微应用领域,因此能具有灵活和可定制的构架。而另一各方面, 库 能在项目间共享资源可宠信的数据,它能是数据层、UI 模块和其他工具函数。
Angular模块 是主要的构建模块。它们将整个功能、模块集或网页及其依赖关系进行封装。这是将他们的微后端应用领域包起来的绝佳优先选择。
路由 特性是 Angular 开箱即有的,无需安装外部包。它提供了微应用领域间保持网页转换所需的所有功能。路由出口能让你配置 shell 应用领域,代销到微应用领域的每一网页的导航。你能优先选择哪个路由将加载哪一种 Angular 模块。
最后,通过采用 惰性加载,当有需要时,能加载 Angular 模块,从而减少了应用领域的包大小,加速了网页的加载速度。Angular 在路由和惰性加载模块 间有两个原生的资源整合。唯一的局限性就是在编译时会加载,但他们需要的是将这个模块在运行时动态地加载。他们很快就会告诉你怎样做到这一点。
怎样构建?
好的,他们回顾了微后端的最佳课堂教学,并了解了 Angular 是怎样适合实现这种构架的。还有几个不确定的区域。
首先是怎样实时动态地加载模块。这个问题能通过 webpack 提供的Module Federation 插件来轻松解决。它支持本地和远程模块分立地、异步地构建,这对他们的情况来说是最理想的。
第二个问题就是他们怎样将所有这些资源资源整合起来,创建两个可取的原型,因此能对其进行迭代。最快的方法是采用 NX CLI,它将为他们生成所有的模板。
Angular的特性:
如果你正在思考是否学习它,不妨先了解下它有哪些核心的特性:
1、有助于管理依赖关系
这里他们提到一个术语 —— 依赖注入,SPA(单页 Web 应用领域)可能是最好的应用领域场景。为了提供原生的应用领域体验,SPA 临时提供了动态加载时间。有了许多的依赖关系,这些应用领域程序的性能能在不同的模块上得到改进,并减轻服务项目器的负担,从而使应用领域更快,更轻便。
2、促进并行开发
在 Angular内部,开发者能分立代码和测试,而无需再进入其他环境。随着 Angular JS 的出现,能在开发中采用模式,因此使得 JS 更易于采用。
3、不用撰写 MVC 管道
开发者正在寻找减少代码行或缩小代码大小的方法。Angular已经消除了制定 MVC 管道的必要性。
4、数据过滤器
过滤器分立运行,在数据被查看前有助于过滤数据。Angular有很多过滤器,这就是为甚么它提供了更多的稳定性。例如,反转文本字符串、分页等。
5、高度访问和资源整合
Angular有效的资源整合了新的特性,因此易于访问。此外,它还提供了强大的维护手段。调试代码的紧要关头需要很多时间,开发者当然希望能减少耗费这各方面的时间,Angular构架对此有很大的帮助。
结语
他们发现,微后端构架与 Angular 是紧密兼容的。有多种工具能将它们结合起来,比如 Module Federation 和 NX monorepos。他们只能猜测,未来的 Angular 版本会不会从一开始就支持微后端构架。