跳到主要内容

big-AGI — 架构与原理

30 秒导读: big-AGI 是一个本地优先的多模型 AI 聊天工作台。它最难也最有价值的地方不是界面,而是把 20 多家 AI 厂商各不相同的流式 API 统一成一条「粒子流」,再在这之上做多模型并行 + 融合(Beam)。本文档由浅入深拆解这两块以及支撑它们的聊天/存储骨架。

1. 这是什么(零基础也能懂)​

  • 一句话定义: big-AGI 是一个跑在浏览器里的「多模型 AI 聊天台」——你带自己的 API key,它帮你同时连上 OpenAI、Anthropic、Gemini、xAI、Bedrock 等 20+ 家模型,在一个干净的界面里聊天、对比、融合答案。

  • 解决什么问题 / 给谁用: 假设你是工程师或研究者,想「同一个问题,让 GPT、Claude、Gemini 各答一遍,再挑/合一个最好的」。普通聊天应用只能连一家、只能一个答案。big-AGI 把多家厂商抽象成统一接口,还能并行跑、融合结果。给那些不满足于单一模型、想要掌控力与透明度的专业用户。

  • 它能做什么(功能):

    • 连接 20+ 家 LLM 厂商,统一的流式聊天体验(文本 / 推理过程 / 图片 / 音频 / 工具调用 / 引用)。
    • Beam:多个模型并行回答(scatter),再用一个模型把它们融合成一个答案(gather)。
    • 本地优先:对话存在你浏览器的 IndexedDB 里,离线可用,不依赖云端。
    • 画图、语音通话、人格(persona)、Diff 等附加 app。

  • 用起来什么样: 你在底部 Composer 输入框打字 → 选一个模型 → 回车。消息以打字机效果流式出现,推理模型还会先显示「思考过程」。想对比时点 Beam,选三四个模型,它们并排同时作答,你选一个、或让第四个模型把它们融合。

  • 一句话直觉/类比: 把它想成**「AI 界的多路混音台」**——每条音轨是一家厂商的原始信号,大坨电路(AIX)负责把各家不同的接口统一成同一种「插头」,你才能在一个调音台上同时推这些音轨、再混(merge)成一轨。

本节不出现底层代码。目标:完全不懂的人读完知道「这是干嘛的」。

2. 顶层全景(它大概怎么转)​

big-AGI 是一个 Next.js 15 应用,代码按职责分四层(见 CLAUDE.md):

目录职责典型内容
src/apps/功能应用,自包含chat/、beam/、draw/、call/、personas/
src/modules/可复用业务逻辑aix/(AI 通信)、beam/(多模型)、llms/(厂商抽象)、blocks/(渲染)
src/common/共享基建stores/(状态)、chat-overlay/(对话编排)、layout/(Optima 布局)
src/server/后端 tRPC两个路由:router-edge(AI,低延迟)、router-cloud(数据处理)

一张图:一条聊天消息怎么从输入跑到屏幕​

  你在 Composer 打字 + 回车
         │
         ▼
  ┌─────────────────────┐   ① 造一条 user DMessage,塞进对话
  │  ConversationHandler │      (src/common/chat-overlay/)
  │  对话编排器          │   ② messageAppendAssistantPlaceholder:
  └─────────┬───────────┘      造一条空 assistant 占位消息
            │ chat 编辑器(chat-persona.ts)
            │ 调 aixChatGenerateContent_*
            ▼
  ┌─────────────────────┐   ③ AIX 客户端:llmId -> access + model
  │   AIX Client (浏览器) │      把对话转成统一请求
  │   aix.client.ts      │
  └─────────┬───────────┘
            │ tRPC 流(或浏览器直连 CSF)
            ▼
  ┌─────────────────────┐   ④ AIX Server(Edge):按 dialect 分派到
  │   AIX Server (Edge)  │      对应厂商,把厂商响应解析成「粒子」
  │   chatGenerate.*     │
  └─────────┬───────────┘
            │ 粒子流 (AixWire_Particles)
            ▼
  ┌─────────────────────┐   ⑤ ContentReassembler:把碎粒子重组成
  │  ContentReassembler  │      DMessageFragment[](文本/推理/图片/工具…)
  │   (浏览器)           │
  └─────────┬───────────┘
            │ 每次更新替换 fragments 引用
            ▼
  ┌─────────────────────┐   ⑥ Zustand 存储 -> React 重渲染 -> 屏幕
  │  store-chats (Zustand)│     -> 自动持久化到 IndexedDB
  └─────────────────────┘

主线一句话: 用户输入 → ConversationHandler 造 user 消息并 append 空 assistant 占位 → chat 编辑器(chat-persona.ts)调 aixChatGenerateContent_* 触发执行 → AIX 客户端把对话变成统一请求 → AIX 服务端按厂商分派、把厂商响应解析成「粒子」 → ContentReassembler 把粒子重组成片段 → Zustand 存储驱动 UI 并落盘 IndexedDB。

这条主线里,「粒子」这层抽象是整个项目的脊梁——它让「20 家厂商」这件难事,在 UI 和存储看来只是「一种统一的流」。这就是第 1 章要讲的。

3. 阅读地图(建议顺序)​

顺序章节讲什么适合谁
①01-aix-streaming.mdAIX 流式管线:粒子模型、客户端三层、服务端 dispatch/parse、重组、重试/续传想懂「多厂商统一」是怎么做到的
②02-beam-multimodel.mdBeam:scatter(并行 N 个模型)/ gather(融合),vanilla Zustand 切片,异步指令链想懂多模型并行与融合
③03-chat-and-storage.md聊天与存储:DMessage 片段模型、ConversationHandler、本地优先持久化想懂数据模型与状态管理

建议: 先读 ① 第 1-3 节建立「粒子流」心智模型(这是看懂其余一切的钥匙),再按兴趣跳 ② 或 ③。

4. 一眼看清:big-AGI 在 chat-agents 货架里的取舍​

维度big-AGI 的选择
部署模型本地优先:对话在浏览器 IndexedDB,BYO-key,可离线;云同步是 Pro 增量层
厂商覆盖极广(20+),靠服务端 dispatch switch + 统一「粒子」抽象
流式架构粒子流:厂商响应 → 服务端解析成小粒子 → 客户端重组成片段,中间这层是协议无关的
杀手锏Beam:多模型 scatter/gather,业界少见
技术栈Next.js 15 / React 18 / MUI Joy / Zustand / tRPC(Edge 跑 AI)

详细的代码地图在每章末尾。