使用客户端技术构建基于LLM的Web应用程序
2023年10月13日
这是一篇由Jacob Lee撰写的客座博客文章，他是@LangChainAI的JS/TS维护者，前@Autocode联合创始人兼CTO，Google Photos工程师。
这篇博客文章的最初版本是为Google内部的WebML峰会2023准备的演讲，您可以在这里查看。
众所周知，长期以来机器学习主要是一个Python的游戏，但最近ChatGPT的流行吸引了许多新的开发者进入这个领域。JavaScript作为最广泛使用的编程语言，自然也吸引了许多Web开发者，他们尝试构建Web应用程序。
已经有大量文章讨论了通过API调用（例如OpenAI、Anthropic、Google等）来构建使用LLM的应用程序，所以我尝试了一种不同的方法，尝试使用仅限本地模型和技术（最好是在浏览器中运行的技术）来构建Web应用程序！
为什么？
这种构建方式的一些主要优点是：
- 成本。由于所有计算和推理都在客户端进行，因此开发者构建应用程序的额外成本仅为（非常便宜的）托管。
- 隐私。没有任何数据需要离开用户的本地机器！
- 由于没有HTTP调用开销，因此可能提高速度。
- 但这可能会被由于用户硬件限制而导致的推理速度变慢所抵消。
项目
我决定尝试使用开源的本地运行软件重新创建LangChain最流行的用例之一：一个执行检索增强生成（简称RAG）的链，允许你“与你的文档聊天”。这使你可以从各种非结构化格式中锁定的数据中获取信息。
数据摄取
第一步是加载我们的数据，并将其格式化为稍后可以使用自然语言查询的方式。这包括以下步骤：
- 将文档（PDF、网页或其他数据）拆分为语义片段
- 使用嵌入模型创建每个片段的向量表示
- 将片段和向量加载到称为向量存储的专用数据库中
这些第一步需要一些组件：文本分割器、嵌入模型和向量存储。幸运的是，这些都在浏览器友好的JS中已经存在！
LangChain负责文档加载和分割。对于嵌入，我使用了一个小型HuggingFace嵌入模型，它被量化以使用Xenova的Transformers.js包在浏览器中运行，对于向量存储，我使用了一个非常棒的Web Assembly向量存储，名为Voy。
检索和生成
现在我已经建立了一个加载数据的管道，下一步就是查询它。
这里的一般思路是获取用户的输入问题，在我们准备好的向量存储中搜索与查询语义最相似的文档片段，并使用检索到的片段加上原始问题来引导LLM根据我们的输入数据得出最终答案。
后续问题需要一个额外的步骤，这些问题可能包含代词或对先前聊天记录的其他引用。由于向量存储通过语义相似性执行检索，因此这些引用可能会干扰检索。因此，我们在使用该问题搜索我们的向量存储之前，添加了一个额外的反引用步骤，将初始步骤改写成一个“独立”的问题。
找到可以在浏览器中运行的LLM证明很困难——强大的LLM非常庞大，并且通过HuggingFace提供的LLM无法生成良好的响应。还有一个机器学习编译的WebLLM项目，看起来很有前景，但是需要在页面加载时下载一个巨大的多GB文件，这增加了大量的延迟。
我过去曾尝试过使用Ollama作为一种易于使用的现成方法来运行本地模型，并且当我听说可以通过shell命令将本地运行的模型公开到Web应用程序时，我感到惊喜。我将其插入，它结果是缺失的部分！我启动了较新的、最先进的Mistral 7B模型，它在我的16GB M2 Macbook Pro上运行得很流畅，最终得到了以下本地堆栈：
结果
你可以在Vercel上尝试Next.js应用程序的实时版本。
你需要在本地机器上通过Ollama运行Mistral实例，并通过运行以下命令使其能够访问相关域名，以避免CORS问题。
$ ollama run mistral
$ OLLAMA_ORIGINS=https://webml-demo.vercel.app OLLAMA_HOST=127.0.0.1:11435 ollama serve
这里有一些LangSmith（我们的可观察性和追踪平台）中的示例追踪，针对一些问题。我使用我的个人简历作为输入文档。
- “这是关于谁的？”
- “他们知道JavaScript吗？”
结论
总的来说，这个项目进展顺利。一些观察结果：
- 开源模型正在快速发展——我使用Llama 2构建了这个应用程序的初始版本，而Mistral仅仅几周后就发布了。
- 越来越多的消费级硬件制造商在其产品中包含GPU。
- 随着开源模型变得越来越小和越来越快，使用像Ollama这样的工具在本地硬件上运行这些模型将变得越来越普遍。
- 虽然用于向量存储、嵌入和其他特定任务模型的浏览器友好型技术在过去几个月里取得了令人难以置信的进步，但LLM仍然过于庞大，无法实际捆绑在Web应用程序中。
对于Web应用程序利用本地模型的唯一可行解决方案似乎是我上面使用的流程，其中一个功能强大的预安装LLM向应用程序公开。
新的浏览器API？
由于非技术Web最终用户不会习惯运行shell命令，因此这里最好的答案似乎是一个新的浏览器API，其中Web应用程序可以请求访问本地运行的LLM（例如，通过弹出窗口），然后将该功能与其他浏览器内特定任务模型和技术一起使用。
感谢阅读！
我对基于LLM的Web应用程序的未来以及Ollama和LangChain等技术如何促进令人难以置信的新用户交互感到非常兴奋。
以下是应用程序中使用的各种组件的一些链接：
- 演示应用程序：https://webml-demo.vercel.app/
- 演示应用程序GitHub仓库：https://github.com/jacoblee93/fully-local-pdf-chatbot
- Voy：https://github.com/tantaraio/voy
- Ollama：https://github.com/jmorganca/ollama/
- LangChain.js：https://js.langchain.ac.cn/
- Transformers.js：https://hugging-face.cn/docs/transformers.js/index
请与Jacob Lee和@LangChainAI在X/Twitter上保持联系。