如果你做过桌面应用,大概率听说过 Electron——它用 Chromium 把 Web 技术打包成跨平台程序,但代价是动辄上百 MB 的安装包和高内存占用。Tauri 走了一条相反的路:用系统自带的 WebView 渲染界面,用 Rust 编写后端逻辑,最终产物体积常常只有 Electron 的十分之一。本文带你从零跑通一个 Tauri 项目,理解它与 Electron 的本质差异,并给出可落地的工程化建议。
一、Tauri 与 Electron 到底差在哪
很多团队想用 Web 技术做桌面端,第一个想到的就是 Electron。它的优势是生态成熟、Web 标准完整,但每个窗口都内置一个 Chromium,导致程序”又胖又重”。Tauri 的核心思路是:前端仍然是你熟悉的 HTML/CSS/JS(React、Vue、Svelte 都行),但渲染交给操作系统自带的 WebView(Windows 上是 WebView2,macOS 上是 WKWebView,Linux 上是 WebKitGTK),后端则用 Rust 提供系统能力。
这一架构差异带来三个直接好处:安装包更小、内存更省、安全性模型更清晰(Rust 端默认不开放任何系统 API,必须显式声明)。下面的对比表能帮助你在选型时快速判断。
| 维度 | Tauri | Electron |
|---|---|---|
| 渲染内核 | 系统自带 WebView | 内置 Chromium |
| 后端语言 | Rust | Node.js |
| 空项目体积 | 约 5–15 MB | 约 80–150 MB |
| 典型内存占用 | 较低 | 较高 |
| 安全模型 | 显式授权 API | 主进程全权 |
| 多窗口成本 | 低(共享 WebView 进程) | 高(每窗口独立引擎) |
二、环境准备:Rust 工具链与脚手架
Tauri 的前置依赖是 Rust 工具链和系统的 WebView 开发库。macOS 与 Windows 开箱即带 WebView,Linux 需要安装 webkit2gtk 等依赖。推荐用 rustup 管理 Rust,再用官方脚手架生成项目。
# 安装 Rust 工具链
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
source "$HOME/.cargo/env"
# 用官方脚手架创建项目(前端框架选 Vanilla/Vue/React 均可)
npm create tauri-app@latest
# 交互选择:项目名称、前端框架、包管理器
# 进入项目并安装依赖
cd my-tauri-app
npm install
生成后的目录里,src/ 是前端代码,src-tauri/ 是 Rust 后端与打包配置。开发时一条命令同时拉起前端 Dev Server 和 Rust 窗口:
# 同时启动前端热更新 + 原生窗口
npm run tauri dev
三、前端如何调用 Rust:核心 invoke 机制
Tauri 的灵魂是 invoke:前端用它在 Web 线程里调用 Rust 函数,Rust 端通过 #[tauri::command] 宏把普通函数暴露成可被前端调用的命令。所有跨边界调用都经过类型校验与权限检查。
3.1 在 Rust 端定义命令
// src-tauri/src/lib.rs
#[tauri::command]
fn greet(name: &str) -> String {
format!("Hello, {}!", name)
}
#[cfg_attr(mobile, tauri::mobile_entry_point)]
pub fn run() {
tauri::Builder::default()
.invoke_handler(tauri::generate_handler![greet])
.run(tauri::generate_context!())
.expect("error while running tauri application");
}
3.2 在前端调用命令
// src/main.ts
import { invoke } from '@tauri-apps/api/core'
const msg = await invoke('greet', { name: 'Tauri' })
console.log(msg) // Hello, Tauri!
相比 Electron 里”前端和 Node 在同一进程随便调”,Tauri 的边界更清晰:UI 永远不碰系统资源,真正的能力封装在 Rust 命令里,并通过配置声明谁能调用。这种”最小权限”设计大幅缩小了攻击面。
3.3 异步调用与错误传播
前端 invoke 本质上是一次跨线程异步调用,Rust 端的命令可以返回 Result 类型,Tauri 会自动把它序列化成前端可 catch 的异常。因此务必在命令里用问号运算符提前返回错误,而不是吞掉异常——否则前端只会拿到一个空响应,排查成本极高。对于耗时操作,建议在 Rust 端用 spawn 把任务丢到后台线程,避免阻塞 UI 事件循环。
四、窗口、托盘与权限配置
窗口尺寸、应用标识、允许的 API 范围都集中在 src-tauri/tauri.conf.json。下表列出最常用的配置项,完整字段请参考官方 schema。
{
"$schema": "https://schema.tauri.app/config/2",
"productName": "myapp",
"identifier": "com.example.myapp",
"build": {
"frontendDist": "../dist",
"devUrl": "http://localhost:5173"
},
"app": {
"windows": [
{ "title": "My App", "width": 800, "height": 600, "resizable": true }
],
"security": { "csp": null }
},
"bundle": {
"active": true,
"targets": "all"
}
}
需要调用文件系统、HTTP、通知等能力时,要在 capabilities 里显式授权,并在 Rust 端引入对应插件。这正是 Tauri 与 Electron 安全观的最大分野:能力默认关闭,用时再开。
4.1 系统托盘与单实例
多数桌面工具需要常驻托盘。Tauri 通过 tauri-plugin-tray 在配置里声明托盘图标与菜单,配合 tauri-plugin-single-instance 可以避免重复启动多个窗口。注意托盘图标在不同 DPI 下要准备多分辨率资源,否则在 Retina 屏上会发虚。
五、与 VS Code、Docker 协同的开发体验
日常开发用 VS Code 高效配置 配合 rust-analyzer 插件,可以获得 Rust 与前端一体化的智能提示。把项目放进 Docker 容器化实践 做一致性构建也很常见,尤其是需要在 Linux 上交叉验证 WebView 依赖时。
一个实用建议:把 src-tauri/target 加入构建缓存,CI 里复用 Rust 编译产物,能把打包时间从十几分钟压到两三分钟。
六、用 GitHub Actions 自动打包多平台
跨平台打包是桌面应用最头疼的环节。Tauri 官方提供了 tauri-action,配合 GitHub Actions 实战 里讲到的矩阵构建,可以一次产出 macOS / Windows / Linux 三个安装包。
name: build-tauri
on: [push]
jobs:
release:
strategy:
matrix:
platform: [macos-latest, ubuntu-latest, windows-latest]
runs-on: ${{ matrix.platform }}
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: 20
- run: npm install && npm run build
- uses: tauri-apps/tauri-action@v0
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
with:
projectPath: src-tauri
七、性能实测:体积与内存对比
下面是社区对”Hello World”级别程序常见的量级参考(具体数字随版本和平台浮动,仅作趋势判断)。可以看到 Tauri 在体积和内存上都明显占优。
| 指标 | Tauri (v2) | Electron |
|---|---|---|
| 安装包体积 | 约 12 MB | 约 120 MB |
| 冷启动内存 | 约 80 MB | 约 280 MB |
| 进程数量 | 2–3 个 | 5 个以上 |
| 单窗口额外开销 | 极低 | 高 |
八、选型建议:何时用 Tauri,何时仍用 Electron
Tauri 并非银弹。如果你的应用重度依赖 Chromium 独有特性,或团队完全没有 Rust 经验且不愿投入学习成本,Electron 仍是更稳妥的选择。反之,工具类软件、内网客户端、对安装包体积有严格要求的分发场景,Tauri 的优势会被进一步放大。一个实用的判断标准是:当安装包体积和内存占用会直接影响用户留存时,优先评估 Tauri。
九、常见踩坑与上线检查清单
- Linux 缺 WebView 依赖:打包前务必装好 webkit2gtk-4.1 与相关库,否则编译直接失败。
- 权限未声明:调用 fs/http 报错多半是 capabilities 没开,先查插件授权而非改代码。
- 前端路径不对:
frontendDist必须指向构建产物目录,dev 与 build 要分开配置。 - 图标格式:各平台对 icns/ico/png 要求不同,用官方
tauri icon命令统一生成。 - 体积没变小:确认没把整个 Chromium/Node 误打包进
bundle资源。
小结
Tauri 用”系统 WebView + Rust 后端”的组合,在体积、内存和安全性上全面优于传统 Electron 方案,非常适合工具类、内网客户端、轻量 SaaS 桌面端等场景。它的学习曲线主要在 Rust 侧,但换来的是更可控的发布产物。如果你的应用还需要对外暴露本地服务,可以参考 Nginx 反向代理 做一层统一的入口与证书管理。下一步,不妨从一个内部小工具开始,用 Tauri 跑通”开发—打包—自动发布”的完整闭环。




