当前位置: 首页 > news >正文

微前端框架主流方案剖析

微前端架构是为了在解决单体应用在一个相对长的时间跨度下,由于参与的人员、团队的增多、变迁,从一个普通应用演变成一个巨石应用(Frontend Monolith)后,随之而来的应用不可维护的问题。这类问题在企业级 Web 应用中尤其常见。
微前端框架内的各个应用都支持独立开发部署、不限技术框架、支持独立运行、应用状态隔离但也可共享等特征。
本文会从框架的应用隔离实现方案、实战、优缺点三个方面探一探各个框架。帮助大家了解各个框架是如何使用,如何运行,从而能选出适合自己项目的微前端方案。

iframe

在没有各大微前端解决方案之前,iframe是解决这类问题的不二之选,因为iframe提供了浏览器原生的硬隔离方案,不论是样式隔离、js 隔离这类问题统统都能被完美解决。
但他的最大问题也在于他的隔离性无法被突破,导致应用间上下文无法被共享,随之带来的开发体验、产品体验的问题:

  1. url 不同步,浏览器刷新 iframe url 状态丢失、后退前进按钮无法使用。

  2. UI 不同步,DOM 结构不共享,弹窗只能在iframe内部展示,无法覆盖全局

  3. 全局上下文完全隔离,内存变量不共享,iframe 内外系统的通信、数据同步等需求,主应用的 cookie 要透传到根域名都不同的子应用中实现免登效果。

  4. ,每次子应用进入都是一次浏览器上下文重建、资源重新加载的过程。

single-spa

目前(2024年4月)github star 13k

http://www.lryc.cn/news/338275.html

相关文章:

  • 安卓逆向之-Xposed RPC
  • 【排序 贪心】3107. 使数组中位数等于 K 的最少操作数
  • 预览pdf文件和Excel文件
  • RT-thread线程间同步:事件集/消息队列/邮箱功能
  • 【机器学习】一文掌握机器学习十大分类算法(上)。
  • 策略模式(知识点)——设计模式学习笔记
  • Python学习从0开始——专栏汇总
  • 【iOS ARKit】Web 网页中嵌入 AR Quick Look
  • Java基础-知识点03(面试|学习)
  • 【GIS学习笔记】ArcGIS/QGIS如何修改字段名称、调整字段顺序?
  • Study Pyhton
  • 【MySQL】:深入解析多表查询(下)
  • 图像入门处理4(How to get the scaling ratio between different kinds of images)
  • 【项目精讲】Swagger接口文档以及使用方式
  • ThingsBoard通过服务端获取客户端属性或者共享属性
  • (78)删除有序数组中的重复项(79)排序矩阵查找
  • elasticSearch从零整合springboot项目实操
  • 【Linux实践室】Linux高级用户管理实战指南:用户所属组变更操作详解
  • C语言: 字符串函数(下)
  • WPF 数据绑定类属性 和数据更新
  • 使用云服务器搭建CentOS操作系统
  • unity的引用传递和数组的联系
  • Android bug Unresolved reference: BR
  • Unity DOTS1.0 入门(1) ECS机制与概述
  • root管理员用户启动kibana报错
  • 【leetcode面试经典150题】50. 插入区间(C++)
  • 第二期书生浦语大模型训练营第三次笔记
  • SpringMVC(一)【入门】
  • SQL Server详细使用教程
  • Spring Boot项目启动时执行指定的方法