引言

随着大模型技术的快速发展，大模型客户端应用需求日益增长。为满足不同用户在各类操作系统（如 Windows、MacOS、Linux、移动平台等）上使用大模型服务，跨平台开发成为关键。合理的跨平台技术选型能显著提升开发效率、降低成本，并为用户带来一致体验。

技术框架比较

以下是对Electron、Flutter、React Native、Tauri、QT的具体比较：

框架	前端框架	编程语言	支持平台	构建环境	案例
Electron	Vue、React、Angular等	JavaScript、HTML、CSS	Windows、Mac、Linux	Node.js、MSVC	ChatBox
Flutter	自身UI组件	Dart	Android、iOS、Web、Windows、Mac、Linux	Flutter SDK、Android SDK	maid、ollama-app
React Native	React	JavaScript/TypeScript	Android、iOS	Node.js、Android SDK	OllamaServer
Tauri	Vue、React、Svelte等	Rust、JavaScript	Windows、Mac、Linux、Android	Node.js、Rust、Android SDK	NextChat
Qt	QML组件	C++、QML	Windows、Mac、Linux、Android、iOS	Qt SDK、MSVC、Android SDK	GPT4All

ChatBox

与大部分商业闭源的大模型桌面客户端的技术路线一样，ChatBox也是基于Electron框架来实现桌面端应用，ChatBox社区版并未提供移动端app的技术构建过程，但是官方提供了商业版的免费移动端app下载试用。

项目名	github地址	Star	平台
ChatBox（社区版）	https://github.com/chatboxai/chatbox	33.5k	Windows、Mac、Linux

功能特点

1. 多模型支持：Chatbox支持众多大语言模型，如OpenAI的GPT系列（GPT3.5 Turbo、GPT4等）、Anthropic的Claude、本地部署的LLaMA及其衍生模型等。用户可以根据自身需求和场景灵活切换不同的模型，从而利用各个模型的特点来完成不同的任务，比如利用GPT - 4的强大推理能力进行复杂问题解答，使用Ollama本地模型保障数据隐私。
2. 对话管理
   • 历史对话保存：会自动保存用户与模型的对话历史，方便用户随时回顾之前的交流内容。这对于需要参考之前讨论信息的场景非常有用，例如在进行项目规划、技术讨论等场景中，用户可以快速查找之前提到的观点和建议。
   • 对话导入导出：支持将对话记录导出为常见的文件格式（如JSON、CSV等），便于用户进行备份、分享或进一步分析。同时，也可以导入之前导出的对话，恢复之前的对话场景。
   • 多对话窗口：允许用户同时开启多个对话窗口，每个窗口可以与不同的模型进行交互，或者针对同一模型开展不同主题的对话。这大大提高了用户在处理多个任务或进行多主题研究时的效率。
3. 提示词管理
   • 预设提示词：提供了丰富的预设提示词模板，涵盖了各种常见的应用场景，如文案写作、代码生成、问题解答等。用户可以直接使用这些预设提示词快速启动对话，节省时间和精力。
   • 自定义提示词：支持用户创建和编辑自己的提示词。用户可以根据特定的需求和偏好，定制个性化的提示词，以引导模型生成更符合期望的回答。
4. 模型参数调整：Chatbox允许用户对模型的参数进行调整，例如温度（Temperature）、最大令牌数（Max Tokens）等。温度参数可以控制模型输出的随机性，数值越高，输出越随机；数值越低，输出越确定。最大令牌数则限制了模型生成回答的长度。通过调整这些参数，用户可以更好地控制模型的输出结果，以满足不同的应用需求。
5. 代码高亮：使用highlight.js组件实现了多语言代码高亮，包括Python、Java、Go、C++、JavaScript、HTML、CSS等等。
6. 支持Markdown：基于react-markdown组件展示LateX公式，代码高亮。

构建命令

安装项目依赖
npm install

构建应用
npm run build

开发模式运行
npm run dev

NextChat

NextChat采用了Tauri技术进行构建，由于Tauri仅使用系统自带的WebView来渲染界面，相比Electron 将 Chromium 浏览器内核打包到应用中，使得安装程序大小减少很多并且启动加载很快。目前最新版本NextChat v2.6.11的构建包管理package.json仍然采用tauri-apps/cli 1.5.11，而tauri-apps/cli 2.0才支持Android应用的构建。

项目名	github地址	Star	平台
NextChat	https://github.com/ChatGPTNextWeb/NextChat	82.1k	Windows、Mac、Linux

构建命令

安装项目依赖
yarn install

本地调试运行
yarn run dev

构建模块
yarn run build

本地debug模式运行
yarn run app:dev    [即运行yarn tauri dev]

编译本地应用
yarn tauri build

maid

这是一个Flutter工程项目，Windows本地构建时需要安装Flutter SDK和MSVC编译链。编译Android应用还需要安装Android SDK。

项目名	github地址	Star	平台
maid	https://github.com/Mobile-Artificial-Intelligence/maid	1.8k	Windows、Mac、Android

构建命令

检查开发环境
flutter doctor 或者 flutter doctor -v

清理环境
flutter clean

构建Android应用
flutter build apk

构建Windows应用
flutter run -d windows     调试模式并运行应用
flutter build windows      编译发布版本的应用

GPT4All

基于QT 实现并可以本地运行大模型的桌面客户端。编译环境需要确定依赖关系，CUDA的nvcc在Windows系统中默认依赖微软的MSVC编译器（cl.exe），而MinGW使用GCC/G++工具链，两者不兼容，所以编译支持CUDA的llama.cpp时，应该避免使用MinGW编译器。

项目名	github地址	Star	平台
GPT4All	https://github.com/nomic-ai/gpt4all.git	72.9k	Windows、Mac、Linux

主要的目录与文件：

• gpt4all-backend: 包含了 GPT4All 的后端服务实现llama.cpp。
• gpt4all-bindings: 提供跨语言绑定支持，使不同编程语言可以调用 GPT4All 的功能。
• gpt4all-chat: 聊天界面的相关代码，用于本地模型的交互应用。
• gpt4all-training: 训练新模型或对现有模型进行微调所需的功能集。

这里我们只需要构建gpt4all-chat，它会自动构建gpt4all-backend的llama.cpp依赖，这是由于构建文件 gpt4all-chat/CMakeLists.txt中包含了以下的指令：
add_subdirectory(…/gpt4all-backend llmodel)

修改gpt4all-chat/CMakeLists.txt以添加Qt6 SDK的路径：
set(CMAKE_PREFIX_PATH “C:/Qt/6.8.2/msvc2022_64/lib”)
set(Qt6_DIR “C:/Qt/6.8.2/msvc2022_64/lib/cmake/Qt6”)
set(Qt6QmlTools_DIR “C:/Qt/6.8.2/msvc2022_64/lib/cmake/Qt6QmlTools”)

构建命令

构建编译配置
cmake -B build -DCMAKE_BUILD_TYPE=Release -DLLMODEL_KOMPUTE=OFF
执行构建应用
cmake --build build --config Release 

QML窗口布局

main.qml
    StartupDialog.qml
    PopupDialog.qml
    NewVersionDialog.qml
    NetworkDialog.qml
    MyToolButton.qml
    HomeView.qml           主页视图
    ChatView.qml           对话聊天视图
    ModelsView.qml         模型列表视图
    LocalDocsView.qml      本地文档视图
    SettingsView           设置视图
    AddCollectionView.qml
    AddModelView.qml
        ToastManager.qml
        AddGPT4AllModelView.qml
        AddRemoteModelView.qml
        AddHFModelView.qml

HomeView.qml
    MyButton.qml
    MyWelcomeButton.qml
    MyFancyLink.qml

ChatView.qml
    PopupDialog.qml
    ConfirmationDialog.qml
    ChatDrawer.qml
    MyMiniButton.qml
    MyBusyIndicator.qml
    CollectionsDrawer.qml
    ChatItemView.qml
        MyMenu.qml
        MyMenuItem.qml
        ChatViewTextProcessor（chatviewtextprocessor.h）
        MyFileDialog.qml
        ChatCollapsibleItem.qml
        ThumbsDownDialog.qml

ModelsView.qml

LocalDocsView.qml

SettingsView.qml                 设置
    ApplicationSettings.qml      设置/应用/应用设置
    ModelSettings.qml            设置/模型/模型设置
    LocalDocsSettings.qml        设置/本地文档/本地文档设置

SettingsView.qml
    MySettingsStack.qml

ModelSettings.qml
    MySettingsTabTab.qml
    MySettingsButton.qml
    MySettingsDestructiveButton.qml
    MyTextField.qml
    MySettingsLabel.qml
    MyTextArea.qml
    MyComboBox.qml

ApplicationSettings.qml
    MyDirectoryField.qml
    MyFolderDialog.qml
    MyCheckBox.qml

OllamaServer

在移动平台上可以直接下载并运行本地大模型，这是通过移动设备直接运行Ollama可执行程序（Kotlin代码中使用ProcessBuilder类启动外部进程Ollama），并由前端通过访问Ollama所提供的RESTful API来实现。该项目是一个react native工程项目，构建Android应用需要安装Android SDK和NDK。

项目名	github地址	Star	平台
OllamaServer	https://github.com/sunshine0523/OllamaServer	62	Android

构建命令

检查本地构建环境
npx react-native doctor

安装第三方依赖
npm install

本地Debug运行Android应用
npx react-native run-android

构建aab安装包
npx react-native build-android

构建Android安装包
cd android
gradlew.bat assembleRelease

清理构建
gradlew.bat clean