微前端的利益和缺陷

栏目:国内业绩

更新时间:2023-08-24

浏览: 37558

微前端的利益和缺陷

产品简介

上周 Twitter 上关于“微前端”的话题火了,支持和阻挡两派都拿出了有力的论据,吵得不行开交。

产品介绍

本文摘要:上周 Twitter 上关于“微前端”的话题火了,支持和阻挡两派都拿出了有力的论据,吵得不行开交。

上周 Twitter 上关于“微前端”的话题火了,支持和阻挡两派都拿出了有力的论据,吵得不行开交。这场争论让我想起了“CSS in JS”的大讨论,双方也都说服不了对方。

以前我在这种争论里也是咄咄逼人,但这次我决议接纳更中立的态度。我认为,就像“CSS in JS”一样,实施微前端详细有哪些价格、有哪些区别,都取决于你的项目和组织资源约束条件。实现微前端也有许多好的方法,自然也有许多糟糕的手段。所以我们来看看微前端的利益、不足和缺陷。

微前端究竟是什么?“微前端架构”是一种使用微服务模式构建前端应用的方法。微前端的理念是将你的前端拆分为一组可独立部署、松散耦合的应用。然后将这些应用组装在一起以建立面向用户的单个应用法式。实现微前端有许多技术方法(详见下方链接),差别的企业有差别的对策;从服务端转换(听起来很奇特,但它基本等同于古老 php 的 include 语句,可以跨越应用法式障碍)到 iframe 和 JavaScript 元框架和 Web 组件等都是可选的微前端方案。

相关链接:实现微前端的技术方法: https://medium.com/dazn-tech/adopting-a-micro-frontends-architecture-e283e6a3c4f3如果你想获取关于微前端的简介、利益以及差别实现方法的全面先容,我推荐 Cam Jackson 的微前端文章,我们前端指端也对该篇文章举行了翻译,详细链接见下方: https://martinfowler.com/articles/micro-frontends.html利益:组织灵活性和一致性微前端的支持者强调它能像微服务那样淘汰团队间的依赖,提升组织灵活度。微前端的其他利益有:独立部署差别的服务实现自治团队,具备独立迭代和创新的能力能够围绕业务部门或产物来打造团队这些都是很有价值的优势,对于大型和庞大的项目尤其显着;但纵然是较小的应用法式项目也可以受益于独立部署等微前端特性。当我在 2010 年开始开发电子商务应用(那时微服务还没泛起)时,我一直担忧无关变量以某种方式破坏结账流程。我们建设了笼罩广泛的测试框架来预防这种情况,但追念起来,这种场景正是独立服务 + 微前端大显身手的好去处。

开云全站app下载

不足:操作庞大性我们现在不仅要编辑静态文件,还要完成诸如构建庞大系统、转换和大型框架等任务,所以想要实现正常运行的前端情况需要一系列庞大的事情。微前端让前端情况变得越发庞大了。如今在整个应用中举行任何类型的测试都可能需要多个前端协作,更不用说将这些前端组装在一起所需要的种种工具了。

履历微服务的开发者会很熟悉下面这些挑战:需要在开发中运行许多差别的应用来测试完整的应用体验跟踪和调试整个系统的问题应付整个系统的版本控制任务本质上来说,我们是在用整个系统的庞大度价格换取单个前端的简练度。缺陷:性能、不连贯的体验Twitter 上有许多对微前端的批判。

下面的问题看来是很是严重的:每个团队都有自己的技术选择,浏览器最终可能需要下载许多框架和重复代码。用户是把你的公司和产物看作一个整体的。所以这也是阻挡完全独立组件的一个论据——如果团队也完全独立开来,问题会越发严重。

微前端的一些实现(特别是嵌入 iframe)可能会导致严重的可会见性问题。虽然微前端的支持者争辩说这些问题纷歧定会泛起,但这种方法似乎确实让这些问题泛起的可能性增加了。妥协:微前端体验的界线微前端能否做到利大于弊,详细取决于你的情况和条件。对于小型、高度协作的团队和相对简朴的产物来说,微前端的优势相比价格来说就很不显着了;而对于大型、功效众多的产物和许多较独立的团队来说,微前端的利益就会更突出。

开云全站app下载

另有一系列方法可以在避开所有缺点的前提下获得许多利益。只要坚持使用一种框架,并使用像 single-spa.js(https://single-spa.js.org/)这样的协作框架,你就可以通过资源共享和只需下载一次的公共代码来制止大多数性能损失。可以使用共享组件库来消除许多纷歧致的用户体验。

固然,这些方法都需要你放弃一定水平的独立性。到某种水平之后,你的架构就基础不再是微前端架构了。详细怎样取舍也是取决于你的产物和组织情况的。

重点就是——工程就是权衡的艺术,而微前端为你提供了另一个可以做权衡的维度。英文原文: https://zendev.com/2019/06/17/microfrontends-good-bad-ugly.html作者 | JKBall译者 | 王强编辑 | Yonie整理:千锋web前端。


本文关键词:开云全站app下载

本文来源:开云全站app下载-www.jpsoundworks.com