AI Beacon：零后端、纯浏览器运行的Transformer可视化教学工具

AI Beacon是一个开源教育平台，旨在解决Transformer架构理解困难的痛点。它通过浏览器原生交互式可视化，让用户直观理解Transformer工作原理，无需GPU、API密钥或安装，完全本地运行。核心理念是"理解来自实践"，用户可输入文本、配置参数，实时观看从分词到采样的完整过程。

大型语言模型改变生活，但Transformer内部机制对多数人仍是"黑盒"。传统学习方式（论文、视频）被动，难以建立直观理解，因内部操作是看不见的矩阵运算。AI Beacon（代号DEPTH）正是为解决这一教育痛点而生。

AI Beacon包含四大核心模块：

1. Transformer模拟器：展示完整前向传播过程（分词→嵌入→注意力→层归一化等），配有热力图、向量图，支持暂停/单步执行；
2. 训练流程模拟器：10步交互演示LLM训练（数据收集→部署）；
3. 模型时间线与基准测试：LLM发展时间线（按发布/家族筛选）、性能对比（MMLU等指标）；
4. 自动化时钟：AI对行业影响时间表（按领域查看渗透与就业预测）。 还提供双模式学习：简单模式（视觉隐喻）适合初学者，高级模式（数学公式/矩阵）适合进阶用户。

AI Beacon采用纯前端架构，技术栈包括Vite6+React19、TypeScript5+、Zustand5、Framer Motion11、Tailwind4等，部署于Cloudflare Pages。最核心是自定义TypeScript张量计算引擎，从零实现矩阵乘法、注意力计算等算子，虽限制模型维度（d_model≤64，token≤12），但保留核心机制，便于教学。

AI Beacon适用于多种场景：

• 课堂教学：教师实时演示，学生课后探索；
• 自学入门：无背景者通过交互建立直觉；
• 面试准备：复习Transformer细节；
• 研究辅助：验证想法或向非技术同事解释模型。

因浏览器运行，AI Beacon使用"玩具维度"模型，无法展示真实大模型的涌现能力等复杂行为。未来计划包括：支持更多架构（Mamba、RWKV）、添加交互式教程、导入自定义模型、社区扩展模块。

AI Beacon是开源项目，欢迎社区贡献。贡献需遵循：

• 代码模式（具名导出、设计令牌、无any类型）；
• 使用函数式组件；
• 确保可访问性（键盘导航、ARIA属性）；
• 提交前运行lint和test。 项目提供PRD和技术规范文档，帮助新贡献者快速上手。项目地址：https://github.com/Akashkunwar/AI-Beacon，在线演示：https://ai-beacon.pages.dev。