Tauri

Tauri 用 系统 WebView（WebView2 / WKWebView）+ Rust 后端 承载 Web UI，安装包往往比 Electron 小一个数量级。UI 仍用 html-css-essentials 与 react-essentials 那套；Rust 侧 负责窗口、文件、系统调用。

学习目标

• 对比 Tauri 与 Electron 的架构与体积差异
• 理解 invoke 命令：前端 ↔ Rust 边界
• 评估团队是否需要引入 Rust 工具链

架构对比

	Electron	Tauri
渲染引擎	捆绑 Chromium	OS 自带 WebView
后端运行时	Node.js	Rust
典型体积	较大	较小（仍含 WebView 运行时依赖）
前端栈	任意 Web	任意 Web（常见 Vite + React）
系统 API	Node + 原生模块	Rust command + 插件

Tauri 不捆绑整颗 Chromium——Windows 依赖 WebView2，macOS 用 WKWebView；部署时要确认目标机器 WebView 可用。

前端调用 Rust（概念）

Rust 侧注册命令，前端：

import { invoke } from "@tauri-apps/api/core";

const tracks = await invoke("fetch_tracks_cache");

Rust 侧实现读取本地缓存、调用 http-protocol-essentials 风格的 HTTP 客户端等——敏感逻辑放 Rust，前端只拿 DTO。

与 Electron preload 类似：最小暴露、强类型、校验输入。

与工具链衔接

• 脚手架：create-tauri-app，常配 ft-vite 开发 UI
• CI 需 Rust toolchain + 各平台打包（比纯 Web ft-deploy 复杂）
• 若团队只有前端、无 Rust 维护者，Electron 的 Node 生态 可能更易招人

何时选 Tauri

倾向 Tauri：

• 对安装包体积敏感（工具类、B 端小客户端）
• 愿意维护 Rust 侧 API 层
• 不需要 Electron 某款 仅 Node 可用 的遗留模块

倾向 Electron：

• 依赖特定 Chromium 版本行为一致
• 大量现有 Electron 插件/示例
• 团队已熟悉 Node 主进程代码

两者 都不是 替代良好 Web 版的理由——先问用户是否只需浏览器 + PWA。

练习

• 列表对比：Electron 与 Tauri 各三个优缺点
• 假想「离线 tracks 阅读器」，哪些 API 放 Rust、哪些留前端
• 查 Tauri v2 文档中 Capabilities / Permissions 一句话含义

小结

Tauri = 系统 WebView + Rust 壳；省体积，换 Rust 与 WebView 差异成本。 下一课移动 Web 与混合方案。