docs/content/zh-Hans/blog/DevLog-2025.05.16/index.md
大家好！我是 Neko，Project AIRI 的发起者！
很抱歉在 Project AIRI 的 DevLog 更新上有所延迟，请原谅我们的拖延。
在过去的几个月里，我们为 AIRI 写了许多精彩的 DevLog，分享我们的开发进展，在其中我们分享了想法、理念，解释了我们使用的技术、从中获得的艺术灵感...一切的一切。
我也写了这两篇精彩且受欢迎的 DevLog！希望你们喜欢阅读它们。
在过去的几周里，Project AIRI 本身的主要任务有一段时间没有进展，也许我在 2025 年 3 月以来的大规模 UI 重构和发布后有些疲惫。大部分工作都是由社区维护者完成的，
非常感谢 @LemonNekoGH、@RainbowBird 和 @LittleSound 在以下领域所做的工作：
::: tip 什么是角色卡？ 本地优先的聊天应用程序如 SillyTavern、RisuAI 或在线服务如 JanitorAI 使用一个包含角色背景、性格和其他角色扮演必要上下文的文件来定义每个独立的角色。
角色卡并不是存储和分享 LLM 驱动的角色扮演角色的唯一方式，Lorebook（故事书） 在这个领域扮演着另一个关键角色，但这完全是另一个值得写一整套文档系列来分享的故事，现在，试着阅读 Void's Lorebook Types 和 AI Dynamic Storytelling Wiki。
我个人很喜欢这个学习这些概念的 wiki：AI Dynamic Storytelling Wiki，如果你对 AI 角色扮演感兴趣，值得一读。 :::
要使用角色卡，导航到设置页面（应用程序右上角，或在桌面应用程序中悬停齿轮图标），找到并点击"Airi Card"按钮。
这将带你到"Airi Card 编辑器界面"，在那里你可以上传和编辑你的角色卡进行人格定制。
对于角色卡展示，我们也尝试了一些方法...
它在我们的 UI 组件库中是实时的，你可以在这里玩玩：https://airi.moeru.ai/ui/#/story/src-components-menu-charactercard-story-vue 。
纯 CSS 和 JavaScript 控制，布局有效，所以我们不需要担心画布计算。
哦，角色卡展示的大部分工作都是由 @LittleSound 完成和指导的，非常感谢。
这两个是主要的更新和尝试，这部分工作由 @LemonNekoGH 完成，她为这些内容写了另外两篇 DevLog，分享了幕后的技术细节。（我想对 Tauri 开发者和用户来说很有价值。）你可以在这里阅读它们：
从 4 月 15 日开始，我发现 AIRI 中的 VAD（语音激活检测）、ASR（即自动语音识别） 和 TTS（文本转语音） 都非常复杂且难以使用和理解，在那个时候，我正在与 @himself65 合作改进和测试来自 Llama Index 的新项目的用例，这是一个帮助处理基于事件的 LLM 流式令牌流和音频字节的库，叫做 llama-flow。
llama-flow 真的很小，而且使用起来类型安全。在没有它的旧时代，我必须手动包装另一个队列结构，以及 Vue 的响应式驱动的工作流系统，将许多异步任务链接在一起，以便能够处理数据来驱动 AIRI。
那时我开始实验更多的例子，简化 VAD、ASR、TTS 工作流的演示。
最终，我得到了这个：WebAI 实时语音聊天示例，我设法证明了这项工作可以在 Web 浏览器中用一个 300 ~ 500 行的 TypeScript 代码来实现 ChatGPT 语音聊天系统。
<ThemedVideo controls muted src="./assets/webai-examples-demo.MP4" style="height: 640px;" />我尽力将所有可能的步骤分解为小的可重用片段，以帮助演示如何从头开始构建实时语音聊天系统：
希望你能从中学到一些东西。
在这段时间里，我们发现了一个有趣且强大的仓库，叫做 k2-fsa/sherpa-onnx，它支持跨 macOS、Windows、Linux、Android、iOS 等 12 种语言的 18 种语音处理任务。令人着迷！
所以 @luoling 也为此做了另一个小演示：Sherpa ONNX 驱动的 VAD + ASR + LLM 聊天 + TTS
由于我们为 VAD、ASR、聊天和 TTS 演示所做的工作，这催生了一个名为 xsAI 🤗 Transformers.js 的新副项目，它简化了调用 WebGPU 驱动的模型推理和使用 workers 提供服务，同时仍然保持与我们之前成功的项目 xsAI 的 API 兼容性。
我们也为此做了一个游乐场...在 https://xsai-transformers.netlify.app 上玩玩吧。
你今天就可以通过 npm 安装它！
npm install xsai-transformers
::: tip 这意味着什么？ 这意味着你可以通过一个 if 开关在云端 LLM 和语音提供商与本地 WebGPU 驱动的模型之间切换。
这为我们带来了一个新的可能性，能够在浏览器中实验甚至实现简单的 RAG 和重排序系统，而无需任何服务器端代码，甚至不需要后端服务器。
哦，Node.js 也支持！ :::
我添加了 Telegram 机器人支持，能够处理动画贴纸，由 ffmpeg 驱动（还能是什么，显然）。现在它可以读取和理解用户发送的动画贴纸甚至视频。
系统提示词太大了，我设法大幅减少了系统提示词的大小，节省了超过 80% 的令牌使用量。
许多图像资源需要我手动找到合适且易于使用的在线解决方案来去除背景，但我决定基于 Xenova 所做的工作...为自己制作一个。
我在系统中集成 WebGPU 驱动的背景去除器方面做了一些小实验，你可以在 https://airi.moeru.ai/devtools/background-remove 这里玩玩。
我们添加了对阿里云模型工作室和火山引擎作为语音提供商的支持，我想很有用？
更多故事可以在 Roadmap v0.5 中找到
自从我们支持了角色卡，在处理模板变量渲染和组件重用时感觉不是很好和流畅...
如果...
if 和 if-else 控制流被注入那么为什么我们不制作一个工具来用前端框架如 Vue 或 React 编写 LLM 提示词，也许将此扩展到其他框架和平台？
这就是我们得到的：Velin。
我们甚至制作了一个用于编辑和实时渲染的游乐场，同时享受 npm 包的生态系统（是的，你可以导入任何包！）。
在这里试试：https://velin-dev.netlify.app
也支持编程 API，Markdown（MDX 正在开发中，支持 MDC），你今天就可以通过 npm 安装它！
npm install @velin-dev/core
好吧...今天就到这里，我希望你们喜欢阅读这篇 DevLog。
让我们用我们最近在中国杭州参加的活动的更多图片来结束 DevLog：Demo Day @ 杭州。
这是我，我与其他参与者分享了 AIRI 项目，我们在那里度过了美好的时光！遇到了许多有才华的开发者、产品设计师和企业家。
介绍了我今天在这篇 DevLog 中分享的几乎所有内容，还有备受喜爱的 AI VTuber Neuro-sama。
我用来分享的幻灯片是这样的：
幻灯片本身是完全开源的，你也可以在这里玩玩：https://talks.ayaka.io/nekoayaka/2025-05-10-airi-how-we-recreated-it/#/1
哦...由于这篇 DevLog 也标志着 v0.5.0 的发布，我想提及一些我们在过去几周达到的里程碑：
再见！