多框架架构
连接框架前，区分 CLI、宿主、运行时、应用和视觉库。
五项独立职责
shell 是汇集应用的页面，微前端是每个可挂载应用。WU 运行时连接两者，CLI 准备用于开发的文件和工具。
表格以本门户架构为例。可以选择其他 shell 和视觉组件，Astro 与 Lit 不是 WU runtime 的要求。
| 部分 | 负责的内容 | 提供的结果 |
|---|---|---|
| WU CLI | Workspace 生成、开发和编译 | 文件、配置、进程和编译输出 |
| Astro Shell | 全局 URL、导航与页面组合 | 文档 HTML 与应用 slots |
| WU Framework | 注册、加载、生命周期和通信服务 | 独立应用的共同契约 |
| 微前端 | 一项功能及其资源 | mount/unmount 实现与自身状态 |
| Lit 库 | 控件与视觉契约 | 可供不同框架使用的 Custom Elements |
CLI 在开发和编译期间工作，运行时在浏览器执行。Astro 可以生成不需要框架 JavaScript 的页面，交互部分通过客户端模块加载。
URL 由 shell 管理
shell 需要决定每个 URL 显示什么、后退/前进如何工作，以及焦点移动到哪里。WU 没有可通过 wu.router 或 wu.routes 调用的公开路由器。路由元数据本身不会实现导航。
本门户由 Astro 生成 /docs/.../、/labs/ 和 /sources/，使用普通 HTML 链接。文档切换会卸载上一页并创建新页面上下文，没有隐藏 SPA，也不承诺跨文档保留状态。
使用持久 shell 的产品可以结合 History API 和自己的路由器。宿主需串行处理切换：卸载前一应用、挂载下一应用、更新标题和焦点，并处理失败。这是宿主额外承担的职责。
每个微前端负责一项能力
实验室包含两项刻意保持精简的能力：
- 命令生成器： 将读者选择的配置转换为 CLI 命令。React 管理状态并适配 DOM 事件。
- 运行时检查器： 显示和修改共享状态、接收事件并观察清理。Vue 管理这部分逻辑。
并非每个按钮或卡片都变成 WU 应用。按钮、表单和面板属于 Lit 组件，不需要单独部署或微前端生命周期。
挂载契约
显式生命周期使应用创建哪些资源、由谁销毁一目了然：
import { wu } from 'wu-framework';
wu.define('saludo', {
mount(container) {
const message = document.createElement('p');
message.textContent = 'Aplicación montada por WU';
container.append(message);
},
unmount(container) {
container.replaceChildren();
}
});这只定义实现。宿主还需初始化应用注册/配置并调用 mount，定义不等于已经显示。manifest 和 wu.init() 的精确形式请参阅框架手册。
本地状态、DOM 与应用间通信
选择最贴近关系的机制：
| 关系 | 机制 |
|---|---|
| React 或 Vue 内部状态 | 本地框架状态 |
| 应用传给 Lit 控件的数据 | Custom Element 属性 |
| 控件向应用表达意图 | 带类型的 DOM 事件 |
| 其他应用关心的事实 | WU 事件总线 |
| 可观察的共享数据 | WU Store |
| 提供方与消费方之间的版本化服务 | WU Contracts |
不要把 store 的可变对象作为视觉 API 暴露。传递数据和事件，并在应用卸载时取消订阅。
隔离与信任
门户使用 sandbox: 'module'，模块在同一 JavaScript 上下文执行，不是抵御恶意代码的边界。Lit 组件通过 Shadow DOM 管理样式，但 Shadow DOM 不阻止全局上下文访问。
本项目应用是可信本地代码。facade capabilities 限制经由它执行的操作，不会自动让任意模块变得安全。strict、eval、proxy 和 none 模式具有不同约定，其限制在手册中说明。
一致的界面
门户视觉系统采用黑色背景、暖白文字、提示红色、青柠状态色和细分隔线。阅读页保持足够文字尺寸、可见焦点和可滚动表格。
文档静态组合由 Astro 负责，交互控件以 Lit 实现。React 和 Vue 不引入第二套按钮和表单。
参考资料
- 源码：
wu-framework/src/core/wu-core.js、wu-store.js、wu-event-bus.js、wu-contracts.js和src/index.js。 - Astro：客户端脚本与 Custom Elements。
- Lit：生命周期与资源清理。