这些前端新技术你很难再忽视了 —— Tauri

🤔What

什么是 Tauri？

答：Tauri 是一个跨平台 GUI 框架，与 Electron 的思想基本类似。Tauri 的前端实现也是基于 Web 系列语言（任何前端框架，例如 Vue.js、React 或 Angular），后端使用 Rust。Tauri 可以创建体积更小、运行更快、更加安全的跨平台桌面应用。

前端也要关注 Tauri？ 答：跟着尤大的脚步准没错。

image.png

其次，Tauri 想要干掉的是咱 大 JavaScript 全干之路 上桌面应用解决方案 Electron，必须关注！

🧐Why

Tauri 比 Electron 有什么不一样？？

答：四个字：更小！更快！

首先，electron 的问题：由于塞入 Chromium 和 nodejs，一个什么也不做的electron项目压缩后也大概要50m。 其次，electron 还有个问题：内存消耗过大，因为 Chromium 本身就很吃内存，再加上提供操作系统访问能力的 nodejs，有很大的内存消耗，对小工具类的项目不友好。 tauri 看了一下，不再塞入 Chromium 和 nodejs，前端使用操作系统的 webview，后端和操作系统集成这块使用 rust 实现，理论上应该比 nodejs 要精简高效。

有没有一种隐约的感受：

从 Vue 到 Svelte

从 React 到 SolidJS

从 Electron 到 Tauri

这些新技术似乎都在追求体积更小、速度更快！

🤫Where

官方文档地址？还是看文档更准确。

答：https://tauri.app/zh/

image.png

🙄When

Tauri 什么时候诞生的？

答：2022年6月20日 — Tauri 1.0 已正式发布。

今年 6 月才刚发布，简直就跟一个新生儿一样。虽然它很新，但是 github star 数已经 4.8w+

Vue.js 核心团队成员 Guillaume Chau 最近用 Tauri 创建了 guijs，用于管理 JavaScript 项目。这说明：Tauri 与 Vue.js 配合得很好~

image.png

• https://guijs.dev/

😄Who

Tauri 作者是谁？

答：Lucas Fernandes Nogueira

image.png

这绿格子太“绿”了~

😁How

怎么使用？

答：支持用 Vite 快速创建。

1. yarn create tauri-app

image.png

可以看出，目前主流的 Web 框架 Tauri 都支持

1. 选择 create-vite

image.png

1. 然后选择 Y， 安装 @tauri-apps/api，选择 vue-ts

image.png

1. 检查 Rust 版本、安装成功。
2. 运行 yarn tauri dev

image.png

一个基于 Vue 3 + TypeScript + Vite 的桌面端应用已经运行起来了。

小结：Tauri 用 Rust 写的。Rust，又是 Rust，记得 Deno 也是用 Rust 写，Rust 可以实现 JavaScript 的基建工作，保障 JavaScript 能更多发光发热。https://www.rust-lang.org/