微前端
micro frontends
GraphQL
微前端 & 微前端实践 & 微前端教程
转载
2020-07-14 20:18:00
342阅读
2评论
微前端 是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将单页面前端应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用还可以独立开发、独立部署。同时，它们也可以在共享组件的同时进行并行开发——这些组件可以通过 NPM 或者 Git Tag、Git Submodule 来管理。qiankun（乾坤） 就是一款
原创
2023-12-19 11:44:03
129阅读
什么是微前端 微前端，听这名字感觉很超前，其实已经有很多公司都已经用上了该技术，例如我的项目组也用上了，跟后端的微服务很类似，用作解耦。现在的网站开发日渐复杂，通常会有很多独立的模块组成，分成不同的业
原创
2023-01-27 20:18:16
692阅读
一. 了解 微前端(1) 解决的问题工程越来越大，打包越来越慢团队人员多，产品功能复杂，代码冲突频繁、影响面大内心想做 SaaS 产品，但客户总是要做定制化如图所示，就可以看出微前端的好处应用自治。只需要遵循统一的接口规范或者框架，以便于系统集成到一起，相互之间是不存在依赖关系的。单一职责。每个前端应用可以只关注于自己所需要完成的功能。技术栈无关。你可以使用 Angular 的同时，又可以使用 R
转载
2024-01-30 10:42:57
107阅读
一、简介微前端这个术语最初来自 2016 年的 ThoughtWorks 技术雷达，说到微前端，这里不得不首先提出另一个概念“微服务”。微服务是面向服务架构（SOA）的一种变体，把应用程序设计成一系列松耦合的细粒度服务，并通过轻量级的通信协议组织起来具体地，将应用构建成一组小型服务。这些服务都能够独立部署、独立扩展，每个服务都具有稳固的模块边界，甚至允许使用不同的编程语言来编写不同服务，也可以由不
转载
2023-08-21 16:34:21
266阅读
一、什么是微前端微前端是一种软件架构，可以将前端应用拆解成一些更小的能够独立开发部署的微型应用，然后再将这些微应用进行组合使其成为整体应用的架构模式。微前端架构类似于组件架构，但不同的是，组件不能独立构建和发布，但是微前端中的应用是可以的。微前端架构与框架无关，每个微应用都可以使用不同的框架。二、 微前端的价值1. 增量迁移迁移是一项非常耗时且艰难的任务，比如有一个管理系统使用 AngularJS
转载
2024-08-16 11:44:58
142阅读
无界微前端：关键词：sync： 浏览器刷新、前进、后退子应用路由状态也都不会丢失（为true时，url后面会拼接路由参数）exec： 预执行指的是在应用空闲的时候将子应用提前渲染出来，可以进一步提升子应用打开时间，只需要在preloadApp中将 exec 设置为true即可alive: true子应用保活当子应用设置为保活模式，切换子应用后仍
转载
2024-07-02 20:12:23
252阅读
导语 | 微前端是将Web应用由单一的单体应用转变为多个小型前端应用聚合为一的一种手段。本文从微前端的基础理论出发，对其核心技术进行阐述，最后结合项目进行简单的应用实践。一、微前端背景（一）什么是微前端微前端提供了一种技术：可以将多个独立的Web应用聚合到一起，提供统一的访问入口。一个微前端应用给用户的感观就是一个完整的应用，但是在技术角度上是由一个个独立的应用组合通过某种方式
转载
2024-03-15 09:32:15
75阅读
qiankun文档: 快速上手微前端 : 是最近一年国内前端领域被频繁提及的关键字，虽然它并不是一个全新的领域/技术，但很显然在当今越来越多的前端应用即将步入第 3 个、第 5 个甚至更久的年头的背景下，如何给 巨石应用/遗产应用 注入新鲜的技术血液已经成为我们不得不正视的问题，而微前端正是解决这类问题的一个非常合适的解决方案。qiankun : 是一个生产可用的微前端框架，它基于 si
转载
2024-03-25 23:10:37
51阅读
微前端是一种全新的前端架构模式，旨在将前端应用程序拆分成多个小型应用程序，并独立地构建、部署和运行。每个微前端应用程序都有自己的代码库、构建和部署过程以及运行时环境。主应用程序负责整合所有子应用程序并根据所需功能进行加载或卸载子应用程序。主要优势包括：跨团队协作更加高效，技术栈共存、可扩展性和可维护性等。本文将对比5个流行的微前端框架，其中包含 micro-app 注重点。Single-SPA（S
转载
2024-01-02 12:28:18
141阅读
微前端背景对于公司内部管理系统、ToB的SaaS系统等一系列的项目中，由于项目本身的生命周期较长，又长期不断的迭代，加入新的功能模块，最终会导致项目本身的体积越来越大，结构越来越复杂。不但影响了日后的维护成本、性能等方面，而且对于开发来讲，也是越写越写不下去，最后的建议可能就是 Emm... 你懂的。微前端的概念很早就有了，比如说早期的iframe。但对于现在前端的技术的不断发展出现很多优秀的微前
转载
2024-03-11 12:44:03
105阅读
微前端架构是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。由此带来的变化是，这些前端应用可以独立运行、独立开发、独立部署。以及，它们应该可以在共享组件的同时进行并行开发——这些组件可以通过 NPM 或者 Git Tag、Git Submodule 来管理。注意：这里的前端应用指的是前后端分离的单应用页面，在这基础才谈
转载
2023-11-29 20:32:56
90阅读
微前端架构：优势，缺点和痛点 一. 什么是微前端 “微前端架构”就是构建基于微服务的前端应用架构。 其思想是将前端应用切分为一系列可以单独部署的松耦合的应用，然后将这些应用组装起来创建单个面向用户的应用程序。 微前端的实现各不相同，因为不同的公司的技术方案不同，从服务器端页面嵌入到iframes到Javascript元框架(meta-frameworks)和web components。 二. 微
转载
2023-12-06 18:15:24
68阅读
一、前言相信大家对于微前端的概念和思想都有了解过，在此我不再赘述。在我们的业务项目中，由于项目比较大，在日常的开发过程中也暴露出来了问题：项目启动慢，打包部署上线慢。这给我们开发和运维人员带来了很大的不便，有时候有紧急任务需要上线，也得打包半个钟才能交付到运维处。因此，我们打算使用微前端的方案，来解决我们目前的困境。下面我以一个简化版本的 demo，进行我们实践的介绍。 二、项目简介项目划分为几个
转载
2023-10-12 23:04:13
138阅读
微前端项目在本地开发完成后，接下来就需要考虑如何部署上线。主应用和微应用都应该是独立开发和部署的，属于不同的仓库。一、 部署在同一服务器如果服务器数量有限，或不能跨域等原因需要把主应用和微应用部署在一起。通常的做法是主应用部署在一级目录，微应用部署在二/三级目录。1.1 微应用改造由于微应用部署在非根目录，微应用打包之前需要配置webpack构建时的publicPath为目录名称，以便于主应用注册
转载
2021-08-18 17:43:00
436阅读
微前端已经是一个非常成熟的领域了，但开发者不管采用哪个现有方案，在适配成本、样式隔离、运行性能、页面白屏、子应用通信、子应用保活、多应用、vite 框架支持、应用共享等用户核心诉求都或存在问题，或无法提供支持。本文提供一种基于 iframe 的全新微前端方案，完善的解决了这些核心诉求。为什么还要造微前端框架目前较成熟的微前方案有 qiankun、micro-app、EMP 方案，下面分别分析这
转载
2024-06-30 11:12:27
33阅读
微前端概念 微前端是借鉴了微服务的理念，将一个庞大的应用拆分成多个独立灵活的小型应用，每
原创
2023-07-04 19:45:20
1121阅读
微前端已经是一个非常成熟的领域了，但开发者不管采用哪个现有方案，在适配成本、样式隔离、运行性能、页面白屏、子应用通信、
原创
2024-03-15 15:03:50
1122阅读
在公司里面，一般团队都是按照业务划分的，在没有微前端的时候，如果几个团队维护一个项目肯定会遇到一些冲突，比如合并代码的
原创
2024-09-05 10:10:17
2039阅读
微前端的概念最早由 thoughtworks 在 2016 年提出。其核心思路是借鉴后端微服务架构理念，将一个单体的庞大的前端应用拆分为多个简单独立的前端工程。每个前端工程可以独立开发、测试、部署。最终再由一个容器应用，将拆分后的微前端工程组合为一个整体，面向用户提供服务。 微前端的架构方式所带来的好处也是显而易见的：降低代码耦合微前端可独立部署团队可以按照业务垂直拆分更高效常见的实现方
