终极指南:如何快速掌握Garfish微前端框架
【免费下载链接】garfishA powerful micro front-end framework 🚚项目地址: https://gitcode.com/gh_mirrors/ga/garfish
Garfish是一套强大的微前端解决方案,主要用于解决现代web应用在前端生态繁荣和web应用日益复杂化两大背景下带来的跨团队协作、技术体系多样化、web应用日益复杂化等问题。从架构层面出发将多个独立交付的前端应用组成整体,这些前端应用能够「独立开发」、「独立测试」、「独立部署」,但是最终在用户看来仍然是内聚的单个产品。
为什么选择Garfish微前端框架?
微前端是一种类似于微服务的架构,是一种由独立交付的多个前端应用组成整体的架构风格,将前端应用分解成一些更小、更简单的能够独立开发、测试、部署的应用,而在用户看来仍然是内聚的单个产品。它主要解决了两个问题:随着项目迭代应用越来越庞大,难以维护;跨团队或跨部门协作开发项目导致效率低下的问题。
Garfish起源于头条号的实际场景,随着业务发展变成一个Monolithic-Applications(巨石应用)。同时由于维护的团队人员都比较分散,工程大,导致开发调试效率低、上线困难(代码合并相互依赖),成为阻塞业务发展的一个重要因素。于是在2018年衍生了Garfish这个微前端框架,经过大量业务方实际场景的验证和打磨,Garfish逐渐趋于成熟。
快速了解Garfish核心功能特性
丰富高效的产品特征 ✨
- Garfish微前端子应用支持任意多种框架、技术体系接入
- Garfish微前端子应用支持「独立开发」、「独立测试」、「独立部署」
- 强大的预加载能力,自动记录用户应用加载习惯增加加载权重,应用切换时间极大缩短
- 支持依赖共享,极大程度的降低整体的包体积,减少依赖的重复加载
- 内置数据收集,有效的感知到应用在运行期间的状态
- 支持多实例能力,可在页面中同时运行多个子应用提升了业务的拆分力度
高扩展性的核心模块 🛠️
- 通过Loader核心模块支持HTML entry、JS entry的支持,接入微前端应用简单易用
- Router模块提供了路由驱动、主子路由隔离,用户仅需要配置路由表应用即可完成自主的渲染和销毁,无需关心内部逻辑
- Sandbox模块为应用的Runtime提供运行时隔离能力,能有效隔离JS、Style对应用的副作用影响
- Store提供了一套简单的通信数据交换机制
高度可扩展的插件机制 🧩
提供业务插件满足各种定制需求
如何开始使用Garfish?
环境准备
首先,确保你的开发环境中已经安装了Node.js和npm。然后通过以下命令克隆Garfish项目仓库:
git clone https://gitcode.com/gh_mirrors/ga/garfish探索项目结构
Garfish项目包含多个核心模块和示例应用,主要目录结构如下:
- packages/: 包含Garfish的核心模块,如core、router、sandbox等
- dev/: 包含各种框架的示例应用,如app-react-18、app-vue-3等
- website-new/: 项目文档和网站相关资源
参考官方文档
详细的使用指南和API文档可以在项目的文档目录中找到:website-new/docs/
Garfish适用场景
如果你的团队成员多、项目类型多,并且想将其打造成「内聚的单个产品」,Garfish会是一个理想的选择:
- 项目的团队成员来自多个团队
- 项目内多条迭代出现需求挤兑,影响测试、发布效率
- 跨空间、跨时间维度导致团队内技术体系无法统一
- 多个前端应用需要达到「内聚的单个产品」特征
- 「内聚的单个产品」中部分内容希望达到独立开发、独立发布、独立测试、独立灰度等能力
通过本指南,你已经对Garfish微前端框架有了基本的了解。开始探索这个强大的工具,体验微前端带来的高效开发模式吧!
【免费下载链接】garfishA powerful micro front-end framework 🚚项目地址: https://gitcode.com/gh_mirrors/ga/garfish
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考