微前端 & 微前端实践 & 微前端教程
微前端 & 微前端实践 & 微前端教程
微前端
micro frontends
https://github.com/neuland/micro-frontends
2016, ThoughtWorks technology radar
https://martinfowler.com/articles/micro-frontends.html
每个微型前端都独立部署到生产中

每个应用程序应由一个团队拥有

每个服务器都可以独立构建和部署
- Container + SSR

Micro Frontends in Actions
https://github.com/xgqfrms/micro-frontends
https://microfrontends.xgqfrms.xyz

实现原理分析
iframe, sandbox (完全隔离,不方便通信)
Container + SSR (路由分发)
js 闭包,namespace
web components
css in js
css modules (命名冲突问题)
Why Not Iframe
https://www.yuque.com/kuitos/gky7yw/gesexv
https://qiankun.umijs.org/zh/guide#它是如何工作的
微前端框架
single-spa

$ npm i single-spa
qiankun
微服务
Microservices
https://samnewman.io/books/building_microservices/
GraphQL

微前端 videos
https://www.youtube.com/watch?v=o1Sr39DVdOQ
https://www.youtube.com/watch?v=dTW7eJsIHDg
https://www.youtube.com/watch?v=wCHYILvM7kU
refs
https://www.thoughtworks.com/radar/techniques/micro-frontends
PDF, technology-radar
https://assets.thoughtworks.com/assets/technology-radar-vol-22-cn.pdf
https://www.thoughtworks.com/radar#downloads
https://github.com/ChristianUlbrich/awesome-microfrontends
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!
微前端 & 微前端实践 & 微前端教程的更多相关文章
- 前端 | JS 任务和微任务:promise 的回调和 setTimeout 的回调到底谁先执行?
首先提一个小问题:运行下面这段 JS 代码后控制台的输出是什么? console.log("script start"); setTimeout(function () { con ...
- 还不知道如何实践微服务的Java程序员,这遍文章千万不要错过!
作者:古霜卡比 前言 本文将介绍微服务架构和相关的组件,介绍他们是什么以及为什么要使用微服务架构和这些组件.本文侧重于简明地表达微服务架构的全局图景,因此不会涉及具体如何使用组件等细节. 要理解微服务 ...
- Web前端开发最佳实践(8):还没有给CSS样式排序?其实你可以更专业一些
前言 CSS样式排序是指按照一定的规则排列CSS样式属性的定义,排序并不会影响CSS样式的功能和性能,只是让代码看起来更加整洁.CSS代码的逻辑性并不强,一般的开发者写CSS样式也很随意,所以如果不借 ...
- Web前端开发最佳实践(6):过时的块状元素和行内元素
前言 前端程序员在学习HTML的过程中,肯定接触过页面元素的两个基本类型:块状元素和行内元素,也有大量的技术文章或者教程在介绍这两个概念.但这两个HTML元素相关的概念从字面上却和CSS样式有着很深的 ...
- 前端如何真正晋级成全栈:腾讯 Serverless 前端落地与实践
Serverless 是当下炙手可热的技术,被认为是云计算发展的未来方向,拥有免运维.降低开发成本.按需自动扩展等诸多优点.尤其是在前端研发领域,使用 Node 开发云函数,可以让前端工程师更加专注于 ...
- web前端开发最佳实践笔记
一.文章开篇 由于最近也比较忙,一方面是忙着公司的事情,另外一方面也是忙着看书和学习,所以没有时间来和大家一起分享知识,现在好了,终于回归博客园的大家庭了,今天我打算来分享一下关于<web前端开 ...
- Web前端优化最佳实践及工具集锦
Web前端优化最佳实践及工具集锦 发表于2013-09-23 19:47| 21315次阅读| 来源Googe & Yahoo| 118 条评论| 作者王果 编译 Web优化Google雅虎P ...
- [转] Web 前端优化最佳实践之 Mobile(iPhone) 篇
原文链接:http://dbanotes.net/web/best_practices_for_speeding_up_your_web_site_server_mobile.html Web 前端优 ...
- [Linux] 一个前端必会的 Nginx 免费教程-在虚拟机中用deepin测试
原文技术胖的 nginx 技术胖 专注于前端开发 deepin Linux Deepin 是一个基于 DEB 包管理的一个独立操作系统,和那些 Ubuntu(下个大版本是基于 debian 开发) 的 ...
随机推荐
- 洛谷P2865
感觉此题可作为严格次短路的模板,因此来写一写 Description 给定 \(n\) 个点,\(r\) 条双向道路,求从 \(1\) 号点到 \(n\) 号点的严格次短路 Solution 维护两个 ...
- 静默安装Oracle也没那么恐怖
几种必须静默安装的情况 服务器为了减少资源占用,没安装图形组件 不能进入机房,只能远程SSH 想炫(Z)耀(B),静默安装显得有技术含量 磁盘分区要求 如没有特别要求,装机时可按如下分区比较好管理 / ...
- 关于ckfinder上传文件时不能根据结果返回自定义操作问题?
最近项目中为了便于文件的管理,所以CMS项目中使用到了ckfinder插件,但是在使用的过程中,发现其自带的上传事件,如果上传重名的文件,该工具会自动提示错误,显示上传失败.但是如果想要自己去处理重名 ...
- JavaScript——事件
事件:是由访问Web页面的用户引起一系列操作. 事件的作用:用于浏览器和用户的交互 以下代码为相关试验代码: HTML事件: <script type="text/javascript ...
- 笔趣看小说Python3爬虫抓取
笔趣看小说Python3爬虫抓取 获取HTML信息 解析HTML信息 整合代码 获取HTML信息 # -*- coding:UTF-8 -*- import requests if __name__ ...
- ElasticSearch结合Logstash(三)
一.Logstash简介 1,什么是Logstash Logstash 是开源的服务器端数据处理管道,能够同时从多个来源采集数据,转换数据,然后将数据发送到您最喜欢的"存储库"中. ...
- Codeforces Round #651 (Div. 2) A. Maximum GCD(数论)
题目链接:https://codeforces.com/contest/1370/problem/A 题意 有 $n$ 个数大小分别为 $1$ 到 $n$,找出两个数间最大的 $gcd$ . 题解 若 ...
- 2019中国大学生程序设计竞赛(CCPC) - 网络选拔赛(8/11)
$$2019中国大学生程序设计竞赛(CCPC)\ -\ 网络选拔赛$$ \(A.\hat{} \& \hat{}\) 签到,只把AB都有的位给异或掉 //#pragma comment(lin ...
- 【uva 1312】Cricket Field(算法效率--技巧枚举)
题意:一个 L*R 的网格里有 N 棵树,要求找一个最大空正方形并输出其左下角坐标和长.(1≤L,R≤10000, 0≤N≤100) 解法:枚举空正方形也就是枚举空矩阵,先要固定一个边,才好继续操作. ...
- Codeforces Round #531 (Div. 3) E. Monotonic Renumeration (构造)
题意:给出一个长度为\(n\)的序列\(a\),根据\(a\)构造一个序列\(b\),要求: 1.\(b_{1}=0\) 2.对于\(i,j(i\le i,j \le n)\),若\(a_{i ...