Tauri：用 Web 技术构建桌面应用的新范式

一、Tauri 是什么

Tauri 是一个用 Rust 编写的桌面应用开发框架（MIT 协议开源，GitHub 82k+ Star），允许开发者使用 HTML/CSS/JS 前端技术栈构建跨平台桌面应用，后端由 Rust 驱动。与 Electron 相比，Tauri 不捆绑完整的 Chromium 浏览器，而是复用操作系统内置的 WebView，打包体积通常只有 Electron 应用的 1/20。

二、核心优势

2.1 极致的包体与内存占用

Tauri 不内嵌浏览器引擎，而是调用系统原生 WebView（Windows 用 WebView2、macOS 用 WKWebView、Linux 用 WebKitGTK）。一个基础的 Tauri 应用：

指标	Electron	Tauri

|------------|----------|---------|
| 安装包大小 | ~120 MB | ~5 MB |
| 内存占用（空闲） | ~250 MB | ~30 MB |
| 启动时间 | ~2s | ~0.3s |
| CPU 占用（空闲） | ~5% | ~0.1% |

2.2 安全优先的架构设计

Tauri 从设计层面将安全置于首位。前端运行在沙箱化的 WebView 中，默认无法直接访问系统 API。所有敏感操作（文件读写、Shell 命令、系统调用）必须通过 Rust 后端显式暴露的 IPC 通道，且支持细粒度的权限配置。

java 复制代码

// tauri.conf.json 中的权限配置
{
  "tauri": {
    "allowlist": {
      "fs": {
        "scope": ["$APP/*", "$DOWNLOAD/*"],
        "readFile": true,
        "writeFile": false
      },
      "shell": { "open": true }
    }
  }
}

2.3 前端框架无关

Tauri 对前端零侵入，React、Vue、Svelte、Solid 甚至纯 HTML 均可使用。构建产物就是标准的前端静态资源，Tauri 只负责将其嵌入原生窗口。

2.4 Rust 驱动的后端性能

Rust 带来了零成本抽象、内存安全和接近 C 的性能。对于需要密集计算的任务（大文件哈希、图片处理、加密解密），放在 Rust 后端执行比 JS 快数十倍。

2.5 完整的生态工具链

Tauri 提供了 CLI 脚手架、热重载开发服务器、自动更新、图标生成、跨平台打包等一整套工具，开发者体验对标一线前端框架。

三、适用场景

场景	推荐度	说明

|----------------------|------|-------------------------------|
| 工具类桌面应用（笔记、剪贴板管理、截图） | 强烈推荐 | 包体小、内存省，用户安装意愿高 |
| 企业内部管理工具 | 强烈推荐 | 只需 WebView 运行时，Windows 10+ 自带 |
| 性能敏感应用（音视频处理、文件管理） | 推荐 | Rust 后端处理密集计算，体验流畅 |
| 跨平台 MVP 快速验证 | 强烈推荐 | 一套代码覆盖 Windows/macOS/Linux |
| 需要深度系统集成的应用 | 推荐 | Tauri 2.x 支持插件系统，扩展性强 |
| 需要兼容 Windows 7 的场景 | 不推荐 | WebView2 仅支持 Windows 10+ |

四、从零开始：构建一个 Markdown 预览器

4.1 环境准备

bash 复制代码

# Windows 需安装 WebView2（Win10+ 已内置）
# 安装 Rust
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

# 安装 Tauri CLI
cargo install tauri-cli

4.2 创建项目

bash 复制代码

# 使用 Vue 模板创建项目
npm create tauri-app@latest md-previewer -- --template vue-ts
cd md-previewer
npm install

4.3 编写前端界面

html 复制代码

<!-- src/App.vue -->
<script setup lang="ts">
import { ref } from "vue";
import { invoke } from "@tauri-apps/api/core";

const input = ref("# Hello Tauri\n\nType markdown here...");
const html = ref("");

async function render() {
  html.value = await invoke("render_markdown", { text: input.value });
}

render();
</script>

<template>
  <div class="container">
    <textarea v-model="input" @input="render" class="editor" />
    <div v-html="html" class="preview" />
  </div>
</template>

4.4 编写 Rust 后端

rust 复制代码

// src-tauri/src/main.rs
use pulldown_cmark::{Parser, html};

#[tauri::command]
fn render_markdown(text: &str) -> String {
    let parser = Parser::new(text);
    let mut html_output = String::new();
    html::push_html(&mut html_output, parser);
    html_output
}

fn main() {
    tauri::Builder::default()
        .invoke_handler(tauri::generate_handler![render_markdown])
        .run(tauri::generate_context!())
        .expect("error while running tauri application");
}

4.5 添加 Markdown 解析依赖

bash 复制代码

# src-tauri/Cargo.toml
[dependencies]
tauri = { version = "2", features = [] }
pulldown-cmark = "0.11"

4.6 运行与构建

bash 复制代码

# 开发模式（热重载）
cargo tauri dev

# 构建生产包
cargo tauri build

构建完成后，安装包约 6 MB，而同等功能的 Electron 版约 150 MB。

五、Tauri 2.x 的关键升级

2024 年发布的 Tauri 2.0 带来了重大架构改进：

特性	Tauri 1.x	Tauri 2.x

|--------|-------------|-----------------------|
| IPC 方式 | invoke + 事件 | 新增 Channel API，支持流式传输 |
| 多窗口 | 基础支持 | 原生多窗口管理 |
| 插件系统 | 有限 | 完全插件化（20+ 官方插件） |
| 移动端 | 实验性 | iOS / Android 正式支持 |
| 安全模型 | 白名单 | 基于 Capability 的权限系统 |
| 文件系统 | 基础 API | 虚拟文件系统 + 作用域隔离 |

六、与其他方案的对比

维度	Electron	Tauri	Flutter Desktop

|---------|-------------|--------------|--------------|
| 语言 | JS + C++ | JS + Rust | Dart + C++ |
| 包体大小 | 大 (~120MB) | 小 (~5MB) | 中 (~30MB) |
| 内存占用 | 高 | 低 | 中 |
| Web 技术栈 | 原生支持 | 原生支持 | 需 WebView 插件 |
| 原生性能 | 中 | 高（Rust） | 高（Skia） |
| 移动端 | 不支持 | Tauri 2.x 支持 | 支持 |
| 生态成熟度 | 极高 | 快速增长 | 成熟 |
| 学习成本 | 低（纯 JS） | 中（需 Rust 基础） | 中（需 Dart） |

七、总结

Tauri 代表了桌面应用开发的下一代范式：用前端技术写 UI 保持开发效率，用 Rust 写后端保证性能和安全，最终交付一个轻量、快速、用户愿意安装的桌面应用。对于任何需要分发桌面客户端的新项目，Tauri 值得作为首选方案评估。

参考开源地址 ：GitHub - tauri-apps/tauri: Build smaller, faster, and more secure desktop and mobile applications with a web frontend. · GitHub