先上背景,新入职一家公司,公司使用到了这个框架,学习一番,要求很低,让自己能够在这个业务线正常的开发。
学习第一步,看官网。给您贴一下官网地址,开心贴贴。
什么是微前端:抄一下,如下:
微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略。
英文好的可以再看一下:
Techniques, strategies and recipes for building a modern web app with multiple teams that can ship features independently . -- Micro Frontends
微前端架构旨在解决单体应用在一个相对长的时间跨度下,由于参与的人员、团队的增多、变迁,从一个普通应用演变成一个巨石应用(Frontend Monolith)后,随之而来的应用不可维护的问题。这类问题在企业级 Web 应用中尤其常见。
读到这里就知道,能用这个框架的都不是小项目了,最起码要有一定的规模,才用得上这个框架。
特性和优势:
- 📦 基于 single-spa 封装,提供了更加开箱即用的 API。
- 📱 技术栈无关,任意技术栈的应用均可 使用/接入,不论是 React/Vue/Angular/JQuery 还是其他等框架。
- 💪 HTML Entry 接入方式,让你接入微应用像使用 iframe 一样简单。
- 🛡 样式隔离,确保微应用之间样式互相不干扰。
- 🧳 JS 沙箱,确保微应用之间 全局变量/事件 不冲突。
- ⚡️ 资源预加载,在浏览器空闲时间预加载未打开的微应用资源,加速微应用打开速度。
- 🔌 umi 插件 ,提供了 @umijs/plugin-qiankun 供 umi 应用一键切换成微前端架构系统。
好了,不闲扯了,下面开始正式学习。