微前端架构落地实践
📚 30章 · 从入门到前沿
01
微前端概述
什么是微前端
核心价值
适用场景与挑战
02
技术选型对比
iframe
Web Components
Module Federation
qiankun
single-spa
03
qiankun 框架入门
核心概念
主/子通信机制
生命周期钩子
04
主应用搭建
React 框架搭建
路由配置
子应用注册与加载
05
子应用接入 (React)
React 改造
webpack 配置
独立/集成运行
06
子应用接入 (Vue)
Vue 改造
vue.config.js
生命周期适配
07
子应用接入 (Angular)
Angular 改造
自定义元素
Zone.js 处理
08
样式隔离方案
CSS Modules
Shadow DOM
qiankun 隔离
BEM 规范
09
JS 沙箱机制
快照沙箱
Proxy 沙箱
legacy vs proxy
10
全局状态管理
initGlobalState
props 传参
EventBus 模式
11
路由管理策略
路由冲突
路由前缀
动态路由注册
12
公共依赖加载
externals+CDN
Module Federation
共享库方案
13
数据共享与通信
localStorage
postMessage
自定义事件
14
微前端部署方案
独立/统一部署
Nginx 配置
Docker 容器化
15
构建与打包优化
Monorepo 管理
增量构建
缓存策略
速度优化
16
性能监控与埋点
子应用加载性能
首屏时间
资源错误监控
17
错误边界与容错
子应用崩溃处理
降级方案
错误日志上报
18
微前端测试策略
单元测试
集成测试
E2E 测试
独立测试
19
微前端与微服务
BFF 层设计
API 网关
服务拆分对齐
20
微前端权限管理
统一登录 SSO
路由权限
按钮级权限
21
微前端国际化方案
主应用统一语言包
子应用独立语言包
动态切换
22
微前端主题定制
CSS 变量方案
动态主题切换
子应用主题同步
23
微前端与低代码平台
低代码引擎集成
组件市场
动态加载
24
微前端与 Serverless
边缘渲染
SSR 微前端
函数计算
25
微前端与 WebAssembly
WASM 模块加载
性能敏感场景
26
微前端与 PWA
离线缓存
Service Worker
子应用离线可用
27
微前端与 WebSocket
实时通信
消息广播
子应用连接管理
28
微前端与 WebRTC
音视频通话
屏幕共享
子应用集成
29
微前端与 Web3
区块链 DApp
钱包连接
智能合约交互
30
微前端未来趋势
Islands 架构
微前端+AI
Web 组件标准化