tauri - 可替換 electron 的PC端 SPA 框架

最近意外發現了這個框架,從這框架的說明和個人實踐來看,確實是之後 PC 端的主流框架, 你們都知道 electron 的惟二缺點: 1. 性能較差 2.包的尺寸太大.下面給出使用 tauri 的理由

tauri 介紹

如下介紹來自官方說明:

爲何使用 tauri

• 原始Tauri應用程序的打包大小小於3 MB，比Electron的大小小140 MB。
• 內存佔用小於使用相同代碼庫構建的Electron應用程序的大小的一半。
• 安全是Tauri的頭等大事，咱們正在不斷創新。
• 遺憾的是，底層是 Chromium 的使用者（例如Electron）沒法得到 FLOSS(自由/開源軟件) 許可。 資料來源：0 1 2

技術細節

tauri 具備五個主要組成部分：

• 用於建立，開發和構建應用程序的Node.js CLI
• Rust Core，用於綁定到底層WEBVIEW並提供可搖樹優化的API
• Rust Bundler用於製造最終的二進制文件
• Webview的Rust綁定
• Webview低層庫，用於建立和與操做系統「本機」 Webview交互

Tauri應用程序中的用戶界面目前在macOS上使用Cocoa / WebKit，在Linux上使用gtk-webkit2，在Windows上經過Edge使用MSHTML（IE10 / 11）或Webkit。 Tauri基於MIT許可的進行工做，即webview。

tauri 與 electron 的對比

	Tauri	Electron
MacOS 的包大小	0.6 MB	47.7 MB
MacOS 的內存消耗	13 MB	34.1 MB
接口服務提供	Varies	Chromium
後臺綁定	Rust	Node.js (ECMAScript)
底層引擎	C/C++	V8 (C/C++)
自由/開源軟件	Yes	No
多線程	Yes	No
字節碼傳遞	Yes	No
能夠顯示PDF	Yes	No
多窗口	Soon	Yes
GPU 訪問	Yes	Yes
自動更新	Soon	Yes (1)
跨平臺	Yes	Yes
自定義 APP 圖標	Yes	Yes
Windows 包	Yes	Yes
MacOS 包	Yes	Yes
Linux 包	Yes	Yes
iOS 包	Soon	No
Android 包	Soon	No
支持本地 web 服務	Yes	Yes
沒有本地服務選項	Yes	No
桌面文件盒	Soon	No

Notes

1. Electron在Linux上沒有本地自動更新程序，但由electron-packager提供

環境搭建

如下爲 macOS 爲例子, 其餘的環境能夠查看原文檔 點此查看

Tauri是一個多語言系統，所以須要大量工具。

系統依賴項：

$ brew install gcc

使用 brew 下載 gcc 依賴

node 運行環境:

此框架的運行須要 node 12 以上的環境:

nvm install 12
nvm use 12

使用 nvm 下載 node 12

Rustc and Cargo 包管理

$ curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

這條命令時須要梯子才能下好的
下載的時候一路回車便可
完成後,關閉終端,打開後查看

grewer@Grewer-2 ~ % rustc --version
rustc 1.42.0 (b8cedc004 2020-03-09)

Tauri 打包工具

$ cargo install tauri-bundler --force

此命令的下載也建議使用梯子,否則會比較慢

至此, 此框架的基礎環境都已經搭建完成

使用(無縫融合進現有的項目)

首先你須要一個 web 項目, 能夠是 react-create-app 或者 vue-cli 建立的項目,也能夠是任意的 web 項目

在項目中下載 tauri:

yarn add tauri
# 或者
npm install tauri

下載完成後,在當前項目的目錄下,使用命令

tauri init

以後, 你的項目下會出現一個目錄 src-tauri:

再根據你的 web 項目啓動時的端口修改文件 src-tauri/tauri.conf.json:

"build": {
    "distDir": "../build", //打包後的路徑
    "devPath": "http://localhost:8080", // 此爲 dev 啓動時的url
    "beforeDevCommand": "",
    "beforeBuildCommand": ""
  },

如今啓動項目:

"dev": "tauri dev",

第一次啓動的時候會有點慢,要加載一些東西,後面就快了不少了

這裏我留下個人 demo:

https://github.com/Grewer/tauri-example

總結

從上述狀況來看,這確實是一個潛力更加大的 PC 框架,可是如今(時間點:2020-04-27)的缺點也明顯,就是還不夠成熟因此如今實驗性的 PC 項目可使用,可是想在生產環境使用,還須要在等等