- 综合排序
- 最热优先
- 最新优先
- 来自专栏前端开发中的事
微前端之qiankun微前端
什么是微前端: 微前端项目是将每一个可以独立开发，测试，部署的子项目集合到一个主项目之下。对于用户来说，主项目仍然是一个完整的产品，而整个组装的过程对于用户来说，是透明的。 微前端不仅仅可以兼容不同的开发环境还可以兼容技术栈。可以做到更大程度的解耦合。 spa网页 [image.png] 微前端网页 [image.png] 为什么需要微前端： 当前应用较大，需要拆解开独立开发 多业务团队，独立开发同一个项目 集合式的中台项目等项目需要 同一个项目内需要兼容不同的架构项目 微前端的特点： 任意的JS框架都可以兼容使用，接入简单。 ，微前端的落地实现 qiankun的特点： 基于 single-spa 封装，提供了更加开箱即用的 API。
3K70发布于 2021-04-01 - 来自专栏超级架构师
【微前端架构】AWS 上的微前端架构
微前端架构将微服务开发原则引入前端应用程序。在微前端架构中，开发团队独立构建和部署“子”前端应用程序。这些应用程序由“父”前端应用程序组合而成，该前端应用程序充当容器来检索、显示和集成各种子应用程序。 带有微前端的微服务后端 微前端的好处 与单体前端相比，微前端具有以下优势： 独立工件：微服务开发的核心原则是工件可以独立部署，这对于微前端仍然适用。 微前端挑战 相反，微前端提出了以下挑战： 父/子集成：微前端引入了确保父应用程序以与单体应用程序相同的一致性和性能显示子应用程序的任务。这一点将在下一节中进一步讨论。 构建微前端 微前端架构模式最困难的挑战是将子应用程序与父应用程序集成。优先考虑用户体验对于任何前端应用程序都至关重要。 结论 微前端架构为前端应用程序引入了微服务开发的许多熟悉的好处。微前端架构还允许您管理小型独立组件，从而简化构建复杂前端应用程序的过程。
2.5K10编辑于 2022-03-08 - 来自专栏京东技术
微前端概述
Tech 导读 本文由浅到深地对微前端进行了概括性介绍，读者可以了解到微前端的概念、微前端的特点与价值、微前端的实现方案、一个微前端框架应具备的功能，以及微前端的适用场景。 读者可以多关注下本文提到的各个开源的优秀的微前端实现方案，通过对比及借鉴来实现一套适合自身业务的微前端方案。 01 微前端是什么 传统的分而治之的策略已经无法应对现代 Web 应用的复杂性，因此衍生出了微前端这样一种新的架构模式，与后端微服务相同，它同样是延续了分而治之的设计模式，不过却以全新的方法来实现。 推荐阅读微前端框架之single-spa 从入门到精通 2.qiankun：qiankun是一个基于single-spa的微前端实现库。HTML entry接入方式。 《前端架构从入门到微前端》一书中，将微前端的实现方案分为六种：路由分发、前端微服务化、微应用、微件化、iframe、Web Components。
2K40编辑于 2022-03-17 - 来自专栏微信小程序栏目
微前端——理论
***一、微前端1、什么是微前端微前端类似于微服务，它将微服务的理念应用于浏览器端。（1）微服务：把后端的功能进行了拆分，使用统一的网关进行调用。 图片***对前端应用进行拆分，将不同的功能按照不同的维度拆分成多个子应用，实现应用的自治。微前端的核心在于拆, 拆完后再合！ 优点：通用度高缺点：设计难度大例如：用户想要访问A应用，不需要加载其他应用，直接可以打开4、微前端拆分方式不合理的采用微前端，可能会带来很多问题，如前端基础设施不完善，会导致各个应用有大量的重复代码。 iframe 内外系统的通信、数据同步等不方便；慢，每次子应用进入都是一次浏览器上下文重建、资源重新加载的过程三、微前端开源方案Single-SPA：用于前端微服务化的JavaScript前端解决方案 以上两种是现阶段比较常用且较成熟的方案，后期文章中会详细介绍，除此之外，还有Piral、Luigi，以及腾讯的微前端oteam和无界（基于iframe）以及Hel微前端，美团的Bifrost，字节的lModern.js
2.6K130编辑于 2022-10-06 - 来自专栏一Li小麦
微前端随记
微前端 大型组织的组织结构，软件架构在不断变化。导致组织和应用不断膨胀，从而映射到软件架构中。 移动优先->App平台（One App）->中台战略->...? 微前端是一种类似微服务的架构。是微服务理念在浏览器端的应用实践。即将原来由单页面前端应用由单一的单体，转变微多个小型前端应用的聚合体。每个子项目可以独立开发部署，也可以进行并行开发。 微前端的核心思想就是（拆）分（自）治。达到降低维护成本的目的。以下是它的三个基本概念： 自治：不同应用由不同团队维护，但遵循统一的接口规范或框架以便于集成。因此彼此之间不存在依赖。 那么什么时候考虑做微前端？ •遗留系统的迁移：最重要的原因。正在赚钱的东西没有理由毁掉重来。人生苦短，尽量不要重构了。•聚合前端应用：这是前端特有的需求——后台使用微服务，希望的是解耦服务之间的依赖。 ——微前端就是一种“热闹”的技术。因此，在采用之前，需要看看看别人的失败经验。对于未来，仍然有很多路要走。
44510编辑于 2022-03-29 - 来自专栏万丈高楼平地起
微前端乾坤
1.什么是微前端？ 微前端（Micro-Frontends）是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。 微前端不是单纯的前端框架或者工具，而是一套架构体系， qiankun 是一个基于 single-spa 的微前端实现库，旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。 qiankun 孵化自蚂蚁金融科技基于微前端架构的云产品统一接入平台。 *基于 *single-spa 封装，提供了更加开箱即用的 API。 umi 插件，提供了 @umijs/plugin-qiankun 供 umi 应用一键切换成微前端架构系统。 2.qiankun 框架的应用 主应用中操作 1. 第二种是基于 redux 实现的通信方式 - Shared 通信，适合需要跟踪通信状态，子应用具备独立运行能力，较为复杂的微前端应用。
1.7K20编辑于 2022-03-09 - 来自专栏柒八九技术收纳盒
理解微前端
今天我们来谈谈一个比较时髦的概念- 「微前端」。 「微前端」是一套用于「组织大型前端应用的指导规范」。是受后端「微服务」启发而发展而来。 接下来，我们就从微前端解决了哪些现存前端问题，并在解决这些问题的过程中做出了哪些取舍和权衡。 话不多说，我们开始。 微前端试图解决什么问题？ 有一些底层技术，如「webpack模块联盟」，使微前端成为可能。还有像single-spa这样的流行框架，为实现微前端做出了不小的努力。 这可能是设计上的问题，因为微前端并不指向一个特定的通用实现。这也是为什么对微前端的用途会让人感到困惑的原因之一。 而，「微前端」都是为了「解决组织问题，而不是性能问题」。它被用在由许多团队合作的大型SPA的背景中。 微前端的潜在问题 ❝微前端有着崇高的目标，「旨在解决真正的大型项目组织问题」。
61520编辑于 2022-08-25 - 来自专栏前端自习课
【微前端】1443- 将微前端做到极致-无界方案
本文提供一种基于 iframe 的全新微前端方案，完善的解决了这些核心诉求。 为什么还要造微前端框架 目前较成熟的微前方案有 qiankun、micro-app、EMP 方案，下面分别分析这三个微前端方案： qiankun 方案 qiankun 方案是基于 single-spa 的微前端方案。 速度快 无界微前端非常快，主要体现在首屏打开快、运行速度快两个方面。 无界微前端不仅能够做到静态资源的预加载，还可以做到子应用的预执行。
6.7K32编辑于 2022-11-15 - 来自专栏深度学习与python
微前端的未来
最后，我会分享下 2022 年我将关注微前端生态系统的哪些方面。 增加事先设计 微前端架构的主要挑战之一是回答这样一个问题：微前端有多 "微"？ 许多组织都面临这个问题。 在与数个从事分布式架构工作的团队的几次接触中，我发现，“分布式组件”的实现比微前端多得多。通过分布式组件，领域知识在容器和“微前端”之间，甚至是容器和多个“微前端”之间共享。 微前端通信 当同一个视图中有多个微前端时，它们有时候需要相互通信。 在我为设计微前端而创建的心理模型中，我建议微前端之间使用发布 - 订阅模式进行通信，严格执行微前端之间的边界，避免或至少减少设计时耦合，让团队有更大的自主性。 想象一下，一个微前端基础设施会自动把自己注册到一个发现服务中，而 UI 设计器会从发现服务中检索微前端，而不是直接与微前端进行点对点的联系。
64220编辑于 2022-06-13 - 来自专栏西岭老湿
微前端架构实战
这些问题让我们意识到，扩展前端开发规模以便于多个团队可以同时开发一个大型且复杂的产品是一个重要但又棘手的难题。 因此，早在2016年，微前端概念诞生了。 第1章 什么是微前端？ 可以理解微前端是一种将多个可独立交付的小型前端应用聚合为一个整体的架构风格。 微前端并没有技术栈的约束。每一套微前端方案的设计，都是基于实际需求出发。 使用微前端架构就可以解决问题，在保留原有项目的同时，可以完全使用新的框架开发新的需求，然后再使用微前端架构将旧的项目和新的项目进行整合。 其中，目前值得关注是去中心模式中的EMP微前端方案，既可以实现跨技术栈调用，又可以在相同技术栈的应用间深度定制共享资源，如果刚开始调研微前端的话，可以先尝试了解一下EMP微前端方案，或许会给你带来不错的使用体验
4.6K00发布于 2021-04-25 - 来自专栏WebJ2EE
【微前端】：Why Not Iframe
为什么不用 iframe，这几乎是所有微前端方案第一个会被 challenge 的问题。 但是大部分微前端方案又不约而同放弃了 iframe 方案，自然是有原因的，并不是为了 "炫技" 或者刻意追求 "特立独行"。 如果不考虑体验问题，iframe 几乎是最完美的微前端解决方案了。
1.3K10编辑于 2022-03-30 - 来自专栏Dawnzhang的开发者手册
微前端建设方案
第1章 概述 为解决项目前端的高耦合、改动牵一发而动全身、多种技术栈强制混用、前端反复重构不彻底的问题，提出微前端的建设。 微前端指的是一种由独立交付的多个前端应用组成整体的架构风格。 2、应用微前端，可以集成主框架运行，可以独立运行。 3、应用微前端，不能强依赖主框架的基础文件。 2.4 总体设计 第3章 架构设计 3.1 微前端架构设计 实现“1+1+N模式”。 研发主应用与微前端需要的公共组件、脚本 5.2 Demo测试 研发一个Demo，包含：主架构、主应用（整个GA-OA前端）、应用微前端，可以访问主应用，同时可以访问独立应用微前端。 5.4 公文办理 l 重构公文办理应用微前端 l 公文办理微前端，集成至主架构 l 主应用（GA-OA）剔除公文办理相关源码 5.5 通知通告 l 重构通知公告微前端 l 通知公告微前端，集成至主架构 l 主应用（GA-OA）剔除通知公告相关源码 5.6 会议管理 l 重构会议管理微前端 l 会议管理微前端，集成至主架构 l 主应用（GA-OA）剔除会议管理相关源码 5.7 规范性文件 l 重构规范性文件微前端
82241编辑于 2022-05-10 - 来自专栏前端技术研究和应用
浅析微前端技术
CustomElement 结合自定义的 ShadowDom，将微前端封装成一个类 WebComponent 组件，从而实现微前端的组件化渲染。 微前端的适用场景微前端的适用场景中大型项目建设微前端项目的初衷就是为未来可能的扩展开发提供可能，因此微前端非常适合具有多个团队维护的大型项目。 如果你把生产力放在首位，可以考虑 微前端 架构微前端的劝退场景业务边界不清晰的项目，在发起一个微前端项目前，你需要对该项目的业务领域及分工有着全面的了解。 如果你不知道某个特定的功能是由哪个团队负责开发及维护的，最终这个微前端项目将会变得一团乱，开发及维护成本极高，而由此带来的人效提升却很少，背离的微前端的初衷。 小型项目，在评估是否需要采用微前端架构前，你需要对平台的规模有大概的认知，不要为了纸面上的优势而强行采用微前端方案，业界还有很多其他小而美的框架可以尝试。微前端是前端发展的必然阶段。
1.9K60编辑于 2023-04-14 - 来自专栏Super 前端
前端架构--从入门到微前端
年中，自己做规划（2019Thinking(上) – 一个前端开发者的个人思考）时，考量了一段时间「微前端」，也关注到了《微前端的那些事儿》的文章，从而了解了作者「黄峰达」，也就购买了下面将要聊的书《 前端架构：从入门到微前端》 本书围绕前端架构的实施，从基础的架构规范，到如何设计前端架构，再到采用微前端架构拆分复杂的前端应用。 设计：架构设计的模式，以及设计和制定前端工作流 基础：通过深入构建系统、单页面应用原理、前端知识体系等，来构建出完整的前端应用架构体系 实施：通过与代码结构的方式，介绍如何在企业级应用中实施组件化架构、 设计系统和前后端分离架构 微前端：引入6种微前端的概念，以及如何划分、设计微前端应用，并展示了如何实现这6种微前端架构 演进：提出更新、迁移、重构、重写、重新架构等架构演进方式，来帮助开发人员更好地设计演进式架构 业务相关内容 微前端？目前预演中，对于目前我们思考的点： 业务边界如何划分？ 应用的标识化或者注册中心的方式如何考量？ 应用通信机制：嵌入业务的特定通信机制 或 剥离业务的通用通信机制？
1.2K21发布于 2020-05-28 - 来自专栏程序那些事儿
微前端那些事儿
什么是微前端 根据Micro-Frontend 官网的定义，微前端是将网站或者 web 应用程序视为由独立团队拥有的功能组合。 构建微前端应用程序有不同的方法，但主要我们可以将它们分为四个重要方面: 路由微前端 组成微前端 微前端通信 定义微前端 微前端的组合 微前端由客户端，服务器端，边缘测组合而成。 微前端之间的通信 与路由一样，微前端之间的通信也取决于组合的类型。当我们在相同或不同页面上使用多个微前端时，我们总是希望可以和其他微前端用户交互。 不同微前端之间的沟通可能不是那么微不足道，尤其是当有不同的团队构建它们时。为了维持独立部署的原则，我们需要确保每个微前端都不知道其他微前端，即使它们是水平分割的并且是同一页面的一部分。 这些自定义事件通过一个常见的类似对象的窗口进行调度，以便所有微前端都可以使用它。 定义微前端 在微前端我们可以使用不同的技术栈，我们可以将vue和react进行结合使用。
62730编辑于 2023-03-07 - 来自专栏coding个人笔记
做个微前端demo
之前已经分享过微前端，至于落地还是不落地就看公司和项目了，今天基于微前端做了个小demo，分享一下。 可以去qiankun官网看看，包括微前端核心设计理念、为什么不是ifram和快速上手及一些问题都很清楚。
1.3K30发布于 2020-09-04 - 来自专栏微前端
为什么 “大前端” 需要 “微前端”？
，以及我对微前端的了解，来谈谈我们为什么需要微前端。 需要特别说明的是，微前端的概念本身非常广泛：前端应用可以被拆分为多个子应用，再通过 构建时集成、服务端拼装 或 浏览器运行时加载 等不同方式组合。无论是哪种形式，都可以被称为“微前端”。 举个例子，即便采用了微前端架构，如果各团队仍然各自实现登录逻辑，页面跳转方式与传统 MPA 相同，那么微前端带来的好处几乎无法体现。 这种思想对于微前端落地非常关键，因为构建本身直接影响代码的最终呈现。如果工程化代码无法高效迭代，微前端的可维护性和稳定性都会受到严重影响。 等到我们拥有这样的微前端架构我们再来回答，微前端是不是银弹这句话也不迟，我相信AI也会加速这类框架的诞生。
45010编辑于 2025-09-23 - 来自专栏Teobler的开发日记
微前端拆分实践
“ 这篇文章是我一次活动分享的讲稿” 最近项目上机缘巧合用微前端解决了一些团队问题，借此机会跟大家分享一下。 微前端作为近两年兴起的一种解决方案，也不是什么新东西了，既然是解决方案，那么微前端帮我们解决了什么问题呢？这里我以我们项目组为例子讲讲： 我们为什么需要微前端？ 基于这样的背景，我们发现微前端这套解决方案很好地解决了我们的问题。说白了在我们的项目背景下，我们最希望得到的东西是 -- 团队自治。 在开始微前端的拆分前我们进行了一些调研后选择了它作为我们微前端的框架，说是调研其实当时我们并没有过多的了解每一个框架，比如国内比较有名的 qiankun。 引用 [1] single-spa [2] 迭代开发中的微服务拆分 [3] 微前端——前端开发新体验 [4] systemjs
1.5K00发布于 2021-09-14 - 来自专栏前端博客
微前端学习笔记（1）：微前端总体架构概述，从微服务发微
微前端微前端是一种类似于微服务的架构，是一种由独立交付的多个前端应用组成整体的架构风格，将前端应用分解成一些更小、更简单的能够独立开发、测试、部署的应用，而在用户看来仍然是内聚的单个产品。 为什么需要微前端？遗留系统迁移。解决遗留系统，才是人们采用微前端方案最重要的原因。聚合前端应用。微服务架构，可以解耦后端服务间依赖。而微前端，则关注于聚合前端应用。热闹驱动开发。 微前端的实现，意味着对前端应用的拆分。拆分应用的目的，并不只是为了架构上好看，还为了提升开发效率。微前端优势：应用自治。 微前端的整体架构微前端部署平台目前较成熟的微前方案有 qiankun、micro-app、EMP 方案，但是它们与MF有着本质的不同，那就是对“微前端”的定义：方案微的定义微前端的定义Module Federation 《微前端学习笔记（1）：微前端总体架构概述，从微服务发微》,请注明出处：https://www.zhoulujun.cn/html/webfront/engineer/Architecture/9029
1.2K10编辑于 2024-06-06 - 来自专栏京程一灯
微前端自检清单
最近在做公司微前端，整理了一份微前端搭建清单，如果你正在考虑是否要做微前端，不妨做个参考。 为什么选择微前端 解决一个技术需求，有很多种方法，为什么选微前端？ 我们看过微前端的发展史就会明白，它并不是凭空出现的，而是项目在不断发展过程中形成的，解决项目臃肿的技术方案。 微前端特点 微前端的核心是解决巨石应用，它都有这些特点： 简单、松耦合的代码库 微前端架构倾向于编写和维护更小、更简单、更容易开发的项目。 技术栈无关，各项目可以使用不同的技术栈。 有了技术方案之后，微前端这条路就可以走通了，除此之外，还需考虑过渡方案。 过渡方案 过渡方案指的是如何让微前端平滑上线。试想一下，如果在微前端改造时，项目来了新需求，这时应该怎么办？ 思考与总结 本文从需求分析开始，一步一步理清了微前端需要注意的各种问题，以及一些解决方案，希望能对微前端感兴趣的你有所收获。
1.1K20发布于 2020-07-22
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号