ARTICLE · 1053714
百宝箱:一个纯本地运行的「桌面 + 安卓」全能工具箱,到底用了哪些技术?
一句话认识百宝箱
用到的技术与架构
技术 | 角色 | 一句话说明 | 官网 |
Rust | 底层底座 / 核心逻辑 | 负责存储、文件、设备互联、AI 视觉、离线词库等底层能力，通过 Tauri 的 IPC 直接供前端调用，无需额外 HTTP 后端进程 | https://www.rust-lang.org/ |
Tauri 2 | 跨平台客户端外壳 | 用系统原生 WebView 承载界面，同时支持 Windows 与 Android，安装包比 Electron 类方案小得多 | https://tauri.app/ |
Vue 3 + TypeScript | 前端框架 | 组件化构建全部界面，类型安全，配合 Pinia 管理状态 | https://vuejs.org/ |
Vite | 构建 / 打包 | 负责前端的开发调试与产物打包，热更新快、产物精简 | https://vite.dev/ |
Element Plus + Pinia | UI 组件 / 状态管理 | 提供成熟的桌面级交互组件与全局状态 | https://element-plus.org/ · https://pinia.vuejs.org/ |
PixiJS（v8） | 2D 动画与互动渲染 | 驱动水族馆、抓娃娃机、动物园等互动小游戏的高性能动画 | https://pixijs.com/ |
SQLite | 本地存储 | 书签、分类、工具偏好、离线词库全部落在本地数据库，零服务端依赖 | https://www.sqlite.org/ |
Excalidraw | 白板 / 手绘 | 提供可手绘风格的无限画布白板 | https://excalidraw.com/ |
@file-viewer（文件预览组件） | 文件预览器 / 多格式预览 | 纯前端、可自托管，支持 Word / Excel / PPT / PDF / 图片 / 音视频 / 3D / CAD 等数十种格式本地预览 | https://doc.file-viewer.app/ · https://github.com/flyfish-dev |
iroh / EasyTier | 设备互联 | 局域网 / 互联网模式下的导航同步与文件传输，端到端加密（QUIC） | https://iroh.computer/ · https://github.com/EasyTier/EasyTier |
离线词库（ECDict / 新华字典） | 教育数据 | 英汉词典（约 24MB）、新华字典随包内置，断网也能查 | https://github.com/skywind3000/ECDict · https://github.com/pwxcoo/chinese-xinhua |
桌面小宠物（page-mascot） | 趣味吉祥物 | 右下角卡通形象：跟随鼠标/手指视线、戳一戳有表情、可拖动位置、多款皮肤切换；素材与交互移植自开源项目 nilbuild/page-mascot（MIT），用 Vue 3 + CSS 精灵图实现，位置与皮肤存 localStorage | https://github.com/nilbuild/page-mascot · https://koboyo.com/page-mascot |
SSH 远程连接（xterm.js + russh） | 远程终端 / SFTP | 前端用 xterm.js 渲染终端界面，后端用纯 Rust 的 russh（SSH 客户端）+ russh-sftp 实现连接与文件传输，加密走 ring（无 C 依赖），桌面与安卓全平台可用 | https://xtermjs.org/ · https://github.com/Eugeny/russh |
流程图（Vue Flow） | 流程可视化 | 拖拽式节点流程图编辑，基于 @vue-flow/core 及背景 / 控制条 / 缩略图插件 | https://vueflow.dev/ |
家族族谱（AntV G6） | 关系图谱 | 家谱 / 亲属关系图谱可视化，基于蚂蚁 AntV G6 v5 图可视化引擎 | https://g6.antv.antgroup.com/ |
流程图（Mermaid） | 文本画图 | 用文本描述直接生成流程图 / 时序图 / 架构图，与 Vue Flow 拖拽式互补 | https://mermaid.js.org/ |
数据图表（ECharts） | 数据可视化 | 成长曲线、统计图表等可视化，Apache 开源图表库 | https://echarts.apache.org/ |
二维码 | 生成 / 识别 | 二维码生成（qrcode）与扫码识别（@zxing/library、jsQR），多款工具用到 | https://github.com/zxing-js/library · https://github.com/cozmo/jsQR |
汉字书写（hanzi-writer） | 教育笔顺 | 小学汉字笔顺书写动画，跟着写、一笔一画学汉字 | https://hanziwriter.org/ |
代码与 SQL 编辑（CodeMirror） | 编辑器内核 | 数据库管理器的 SQL 编辑、代码工具；配 node-sql-parser / sql-formatter 做解析与格式化 | https://codemirror.net/ |
后端引擎（sqlx / mysql_async / redis / rustls / lopdf） | 后端能力 | 数据库驱动（PostgreSQL / MySQL / Redis）、SSL 证书检测（rustls + x509-parser）、PDF 处理（lopdf），均为纯 Rust、无 C 依赖 | https://github.com/launchbadge/sqlx · https://github.com/redis-rs/redis |
技术不需要展开太多——核心思路就是：Rust 做硬核底座，Tauri 把它包成原生客户端，Vue 3 + Vite 写界面，SQLite 存一切，PixiJS 负责好玩的动画。