Tauri 2.0跨端開發：2026年從桌面到行動端的統一框架

前端工程

Tauri 2.0：一套程式碼，六個平台

Tauri 2.0最大的突破是從桌面端擴展到行動端。現在你可以用同一套Rust後端+Web前端，同時構建Windows、macOS、Linux、iOS、Android五個平台的應用。

對比資料：同功能應用，Tauri 2.0包體積8MB vs Electron 150MB，記憶體佔用45MB vs 280MB，啟動速度0.3s vs 2.5s。

Tauri vs Electron 全面對比

維度 Tauri 2.0 Electron
包體積 5-15MB 100-200MB
記憶體佔用 30-60MB 200-400MB
啟動速度 0.2-0.5s 1.5-3s
後端語言 Rust Node.js
WebView 系統原生 內建Chromium
行動端支援 iOS/Android 不支援
原生能力 Rust FFI Node.js N-API
安全模型 許可權沙箱 完整Node.js
生態成熟度 成長中 成熟

Tauri 2.0新架構

┌──────────────────────────────────────────────────────┐
│                   Web前端層                           │
│   React / Vue / Svelte / Vanilla JS                  │
├──────────────────────────────────────────────────────┤
│                   IPC通訊層                           │
│   invoke() / listen() / emit()                       │
├──────────────────────────────────────────────────────┤
│                   Tauri Core                          │
│  ┌──────────┬──────────┬──────────┬───────────────┐  │
│  │ 視窗管理  │ 外掛系統  │ 事件系統  │ 許可權管理    │  │
│  ├──────────┴──────────┴──────────┴───────────────┤  │
│  │              命令處理器（Commands）                │  │
│  ├─────────────────────────────────────────────────┤  │
│  │              平台適配層                            │  │
│  │   Windows │ macOS │ Linux │ iOS │ Android       │  │
│  └─────────────────────────────────────────────────┘  │
├──────────────────────────────────────────────────────┤
│                   Rust後端層                          │
│   業務邏輯 │ 檔案操作 │ 網路請求 │ 加密解密          │
└──────────────────────────────────────────────────────┘

Rust後端 + Web前端的IPC通訊

前端呼叫Rust命令

// src-tauri/src/commands.rs
#[tauri::command]
async fn process_image(image_path: String, options: ProcessOptions) -> Result<ProcessResult, String> {
    let img = image::open(&image_path)
        .map_err(|e| format!("無法開啟圖片: {}", e))?;

    let processed = match options.operation.as_str() {
        "compress" => compress_image(img, options.quality)?,
        "resize" => resize_image(img, options.width, options.height)?,
        "convert" => convert_format(img, options.format)?,
        _ => return Err("不支援的操作".to_string()),
    };

    let output_path = save_processed_image(processed, &options.output_dir)?;
    Ok(ProcessResult {
        output_path,
        file_size: fs::metadata(&output_path)?.len(),
    })
}

// 前端呼叫
import { invoke } from "@tauri-apps/api/core";

async function processImage() {
  const result = await invoke<ProcessResult>("process_image", {
    imagePath: "/path/to/image.png",
    options: {
      operation: "compress",
      quality: 80,
      outputDir: "/path/to/output",
    },
  });
  console.log(`處理完成: ${result.output_path}`);
}

事件通訊

// Rust端傳送事件
use tauri::Emitter;

#[tauri::command]
async fn start_batch_process(app: tauri::AppHandle, files: Vec<String>) -> Result<(), String> {
    for (index, file) in files.iter().enumerate() {
        process_single_file(file)?;
        app.emit("batch-progress", BatchProgress {
            current: index + 1,
            total: files.len(),
            file: file.clone(),
        }).map_err(|e| e.to_string())?;
    }
    Ok(())
}

// 前端監聽事件
import { listen } from "@tauri-apps/api/event";

const unlisten = await listen<BatchProgress>("batch-progress", (event) => {
  console.log(`進度: ${event.payload.current}/${event.payload.total}`);
  updateProgressBar(event.payload.current / event.payload.total);
});

unlisten();

Tauri外掛系統

常用官方外掛

外掛 功能 支援平台
@tauri-apps/plugin-fs 檔案系統讀寫 全平台
@tauri-apps/plugin-notification 系統通知 全平台
@tauri-apps/plugin-clipboard 剪貼簿操作 全平台
@tauri-apps/plugin-biometric 生物辨識 iOS/Android/macOS
@tauri-apps/plugin-camera 相機存取 iOS/Android
@tauri-apps/plugin-geolocation 地理定位 iOS/Android
@tauri-apps/plugin-barcode-scanner 條碼掃描 iOS/Android
@tauri-apps/plugin-store 本地持久化儲存 全平台

行動端適配

iOS/Android的原生能力呼叫

import { platform } from "@tauri-apps/plugin-os";

async function shareContent(content: string) {
  if (platform() === "ios" || platform() === "android") {
    const { share } = await import("@tauri-apps/plugin-share");
    await share({ text: content, title: "分享" });
  } else {
    await navigator.clipboard.writeText(content);
    showToast("已複製到剪貼簿");
  }
}

async function authenticateUser() {
  if (platform() === "ios" || platform() === "android") {
    const { authenticate } = await import("@tauri-apps/plugin-biometric");
    const result = await authenticate({
      reason: "請驗證身份以繼續操作",
      fallbackToPin: true,
    });
    return result.isAuthenticated;
  }
  return true;
}

行動端UI適配

.app-container {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 1rem;
  height: 100vh;
}

@media (max-width: 768px) {
  .app-container {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }

  .sidebar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    z-index: 100;
    display: flex;
    flex-direction: row;
    overflow-x: auto;
  }
}

.toolbar {
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

打包與分發

各平台打包命令

# Windows NSIS安裝包
npm run tauri build -- --bundles nsis

# macOS DMG
npm run tauri build -- --bundles dmg

# Linux AppImage/Deb
npm run tauri build -- --bundles appimage,deb

# iOS
npm run tauri ios build -- --release

# Android APK/AAB
npm run tauri android build -- --release

自動更新配置

{
  "plugins": {
    "updater": {
      "endpoints": [
        "https://api.toolsku.com/updates/{{target}}/{{arch}}/{{current_version}}"
      ],
      "pubkey": "PUBLIC_KEY_HERE"
    }
  }
}

import { check } from "@tauri-apps/plugin-updater";
import { relaunch } from "@tauri-apps/plugin-process";

async function checkForUpdates() {
  const update = await check();
  if (update?.available) {
    await update.downloadAndInstall();
    await relaunch();
  }
}

效能最佳化

Rust側計算卸載

// 將CPU密集計算放在Rust側
#[tauri::command]
async fn calculate_hash(file_path: String) -> Result<FileHash, String> {
    let mut hasher = Sha256::new();
    let mut file = File::open(&file_path).map_err(|e| e.to_string())?;
    let mut buffer = [0u8; 8192];

    loop {
        let n = file.read(&mut buffer).map_err(|e| e.to_string())?;
        if n == 0 { break; }
        hasher.update(&buffer[..n]);
    }

    Ok(FileHash {
        algorithm: "SHA-256".to_string(),
        hash: format!("{:x}", hasher.finalize()),
    })
}

總結

  1. Tauri 2.0是跨端開發的最佳選擇 — 包體積小、效能高、一套程式碼五平台
  2. Rust後端是核心優勢 — CPU密集任務卸載到Rust，比Node.js快10-100倍
  3. 外掛系統豐富 — 檔案系統、生物辨識、相機等原生能力開箱即用
  4. 行動端支援是殺手鐧 — Electron做不到的，Tauri 2.0做到了

如果你在2026年還在用Electron，是時候認真考慮Tauri 2.0了。8MB vs 150MB的包體積差距，使用者會用下載量投票。

本站提供瀏覽器本地工具，免註冊即可試用 →

#Tauri#Rust#跨平台#桌面应用#移动端