Giter Club home page Giter Club logo

micorfrontend's Introduction

微前端实践

什么是微前端

引用官方概念的来说,微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略。

通俗地说,微前端,就是一站式接入所有的系统,把所有系统都统一到同一个站点下,统一服务入口,各个系统根据路由的不同,以模块的形式加载,统一标准化各个系统的文档和消息发布,简化各个系统的操作。各个系统间以模块的形式加载,尽管使用技术框架不一样,也互不影响系统功能,各个系统独立开发和维护。

为什么使用微前端

为什么使用微前端?

微前端,听上去很高深莫测,但是其实就是一个很简单的概念,下面的几种场景就能让你摸清它到底是什么?

在公司中,产品众多,每次访问一个系统,都要打开相应的网站,有时,各个系统的token还不能通用,而要频繁登录验证,造成工作效率低下。

有时,各个系统的文档风格完全不一样,或者缺乏文档指引,使得用户使用系统时,并不能完全上手使用。这时你是否希望各个系统是否要统一文档的整理,并且在同一个地方,能够随时可以打开浏览。

还有,前端框架众多,vue、react、angular,能否让各个使用不同框架的前端系统,集中管理起来,共享功能,而不影响各个系统开发团队独立开发维护。

这时,微前端的概念就产生了。

图片

微前端架构具备以下几个核心价值:

  • 技术栈无关 主框架不限制接入应用的技术栈,微应用具备完全自主权

    能让各个使用不同框架的前端系统,集中管理起来

  • 独立开发、独立部署 微应用仓库独立,前后端可独立开发,部署完成后主框架自动完成同步更新,而不影响各个系统开发团队独立开发维护

  • 增量升级

    在面对各种复杂场景时,我们通常很难对一个已经存在的系统做全量的技术栈升级或重构,而微前端是一种非常好的实施渐进式重构的手段和策略

  • 独立运行时 每个微应用之间状态隔离,运行时状态不共享

参考资料:

qiankun

可能是你见过最完善的微前端解决方案

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.