Tauri：跨平台探索之旅

一、简介

  Tauri 是一个跨平台 GUI 框架，与 Electron 的思想基本类似。都是属于跨平台技术的解决方案

1737f4e90d0a8c1c27a9be2d19f64210.png

优缺点快速分析

  我们一般会把tauri作为 Electron 的替代方案，electron优点咱们不看，这里就提两个electron比较明显的问题：

  1. 安装包大小。Electron 应用程序需要内置 Chromium 渲染引擎和 Node.js 环境，导致项目安装包很大。

  2. 资源占用。Electron 占用较高的 CPU 和内存资源，作为小型的工具类项目应用，用户体验会不太友好。

  3. 启动时间稍显长。

  Tauri 作为一种使用 Rust 和 Web 技术栈构建跨平台桌面应用的框架。这里也分析一下它的几个优点和缺点：

  • 优点

  1. 高性能：Tauri 使用 Rust 语言编写底层代码，具有内存安全、高性能和并发性等优点。

  2. 跨平台支持：Tauri 支持多个平台，如 Windows、macOS 和 Linux，可以帮助开发者轻松地构建跨平台的应用。

  3. 小安装包：由于 Tauri 应用程序使用原生控件和 Web 技术结合的方式，因此安装包相对较小。

  4. 启用时间较短。

  5. 安全性：使用操作系统的原生 GUI 控件来创建应用程序界面，从而提高了应用程序的可访问性和安全性。

  • 缺点

  1. 学习成本：由于 Tauri 使用 Rust 和 Web 技术进行开发，因此需要具备一定的 Rust 和 Web 开发经验，对于新手开发者来说可能需要一定的学习成本。

  2. 社区规模：相比于其他框架，Tauri 的社区规模还相对较小，可能需要开发者自行解决一些问题。

  3. 可维护性：Tauri 尚处于快速发展阶段，可能存在 API 变动和不稳定的情况。以及webview也会有一些本身自带的兼容性问题等等。

cac4b40d94c6a2b8852fadfc817d257b.png
对比Tauri和Electron

  总的来说，Tauri 是一种非常有潜力的框架，它可以帮助开发者快速构建高性能、跨平台的桌面应用。但是，它也存在一些学习成本和可维护性等方面的问题，需要开发者在选型的时候有更多的思考。

二、使用教程

2.1 环境准备（以mac环境为例）

  其他环境的可以参考官方教学文档，在此不做赘述

  1. 安装 CLang 和 macOS 开发依赖项

xcode-select --install

  1. 安装Rust

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

2.2 构建项目

  使用 pnpm 创建项目

pnpm create tauri-app
fe49f26756db1def80d5e5aba7d4bb4e.png

  选择完你熟悉的项目配置后，执行提示的内容，运行项目，会自动在桌面弹出初始化的窗口

92b4bbda96182a8fc451b02be2e4ae13.png

2.3 项目构成

b607bfcc2756d5e24ec001fd1a8eb86a.png

  • dist：web项目打包编译目录

  • src：vue前端页面代码（渲染进程）

  • src-tauri：rust相关（主进程）

2.4 完善项目配置

  完成项目内容后，我们可以在 tauri.conf.json 文件中配置 Webview 的选项，包括 Webview 库的版本、窗口大小、窗口样式、窗口标题、用户代理字符串等。182bb52db39b235474fa61cf36150995.png

2.5 打包

pnpm tauri build

  直接执行打包会直接报个错18284f8b2c04ca23d2d8f1f67b533bd3.png  将tauri.conf.js的默认配置修改为build

9ed2a68e137be7973bd7d14443b8aeb6.png  再次执行打包就好了，然后直接安装使用

ebb1b06bb60556c96982c07c3516e05d.png

  到此为止，我们体验了一把使用 Tauri 开发桌面端应用的流程。可以感知到，它对前端开发者是比较友好的，但是如果想深入掌握它，需要学习 Rust。

三、整体构成

  Tauri主要基于以下几个关键技术：

  1. Rust

  2. Web技术

  3. Webview

  整体结构大致长这样👇🏻ab90c724fea2a1197ad6201eb28e41b0.png

  • 在 Tauri 架构中，Rust 应用程序是整个系统的核心，它提供了 Tauri API 的实现。通过tauri api让 Rust 应用程序与 WebView 和 Web 内容进行交互。

  • WebView 是一个通用的 Web 容器，通常基于底层平台的内置 Web 技术实现，例如：macOS 上的 WKWebView 和 Windows 上的 Edge WebView。WebView 用于加载 Web 内容，使其可以显示在原生桌面应用程序中。

  • Web 内容是在 WebView 中加载的 HTML、CSS 和 JavaScript 代码。Tauri 可以加载远程 Web 内容，也可以加载本地 Web 内容，例如打包在原生应用程序中的 Web 资源。

  通过这个架构，Tauri 提供了一种快速创建跨平台原生桌面应用程序的方法，充分利用了 Rust 的性能和 Web 技术的灵活性。那么，接下来简单讲一下这三块都有哪些内容。

3.1  Rust

  1. 语言

      Tauri的核心是使用 Rust 语言编写的。在 Tauri 中，Rust 代码用于调用本地操作系统的 API，实现应用的后端逻辑，并与前端 Web 技术进行交互。Rust的一些主要特性包括：

  • 内存安全：Rust 的所有权系统可以有效避免内存泄漏和空指针等问题，确保程序在运行时不会发生崩溃。

  • 线程安全：Rust 的并发模型允许开发者编写线程安全的代码，可以在多核处理器上并行执行，提高应用的性能。

  • 高性能：Rust 的编译器会在编译时进行优化，生成的二进制文件具有很好的性能表现。

  • 易于与其他语言交互：Rust 支持与其他语言进行交互，例如与 JavaScript 进行交互，这在 Tauri 中非常重要。

  • 除了上述特性，Rust 还有其他很多特性和优点，如代码可读性、错误处理、模式匹配等，这些特性在 Tauri 中也会得到充分的发挥。

  总之，Tauri 的 Rust 代码是实现其核心功能的关键，使用 Rust 可以有效避免一些常见的安全漏洞，并且可以保证应用具有高性能、可靠性和扩展性。

  1. 库的使用

  Tauri 使用了多个 Rust 库，主要包括以下几个方面：

  • 底层平台库：Tauri 使用了多个底层平台库，包括 winapi（Windows 平台）、cocoa（macOS 平台）、gtk（Linux 平台）等，这些库提供了与操作系统交互的接口，使得 Tauri 可以在不同的平台上实现一致的行为，达到抹平差异的目的。

  • Webview 库：Tauri 使用了多个 Webview 库，包括 webview, wry, cef, tao, nwjs 等，不同的平台使用不同的 Webview 库。这些库提供了在 Rust 代码中嵌入 Webview 的能力，使得 Tauri 可以在桌面应用中集成 Web 技术。

  • 异步编程库：Tauri 使用了 async-std 库来实现异步编程。这个库提供了基于 async/await 的异步编程模型，使得 Tauri 可以使用 Rust 的强类型和安全性，同时又能够处理异步操作。

  • 序列化和反序列化库：Tauri 使用了 serde 库来进行数据的序列化和反序列化。这个库提供了基于属性宏的序列化和反序列化方式，使得 Tauri 可以方便地在 JavaScript 和 Rust 之间传递数据。

  • 日志库：Tauri 使用了 env_logger 库来进行日志记录。这个库提供了一种灵活的日志记录方式，使得 Tauri 可以在开发和调试时方便地记录日志。

  • 其他库：除了上述库之外，Tauri 还使用了其他一些 Rust 库，包括 lazy_static（懒加载静态变量库）、serde_json（JSON 序列化和反序列化库）、walkdir（遍历目录和文件库）等，这些库提供了丰富的功能，使得 Tauri 可以实现更加复杂的功能。

3.2  Web

  在Tauri中，Web技术主要用于两个方面：一是创建应用程序的UI界面，二是通过Webview与Rust代码通信。

  先看看创建界面：我们可以使用HTML、CSS和JavaScript来创建应用程序的UI界面，也能够集成当前所有Web项目里头（包括React、Vue、Angular等等）。

2cf284454196e4aa8b72087725a24369.png

  接下来看看如何让Webview与Rust代码通信。

定义Tauri事件

  可以写在main.rs里

#[tauri::command]
fn hello(name: String) -> String {format!("Hello, {}!", name)
}fn main() {tauri::Builder::default().invoke_handler(tauri::generate_handler![hello]).run(tauri::generate_context!()).expect("error while running tauri application");
}

  在上面的代码中，我们定义了一个hello函数，并使用tauri::command宏将其注册为一个Tauri事件。该函数接受一个名为name的字符串参数，并返回一个格式化的问候语

在JavaScript代码中发送事件

  在JavaScript代码中，我们可以使用window.tauri.invoke方法来发送一个Tauri事件。例如，我们可以编写以下代码来调用Rust中的hello事件：

window.tauri.invoke('hello', { name: 'Alice' }).then(response => {console.log(response); // 输出 "Hello, Alice!"});

3.3  Webview

  在Tauri中，Webview是负责渲染应用程序UI的核心组件。具体来说，Webview是一个用于显示网页内容的窗口，类似于浏览器中的标签页。Tauri使用Webview作为应用程序的UI引擎，并使用Rust和JavaScript代码来控制UI的行为。

  Tauri使用了一些第三方的Webview引擎，例如：webview、wry 和 cocoa webview。这些Webview引擎为Tauri提供了不同的支持平台和不同的性能特征。

  另外，Tauri提供了一组Rust API，可以用于与Webview进行交互，例如：

  • tauri::window: 用于与当前窗口进行交互。

  • tauri::event: 用于发送事件到Webview。

  • tauri::menu: 用于在Webview中创建菜单。

  除了使用Rust API之外，我们还可以使用JavaScript代码与Webview进行交互。例如，我们可以使用以下代码在JavaScript代码中获取Webview的引用：

const webview = window.tauri.promisified({cmd: 'getWebview'
});

  当我们获取了Webview的引用之后，我们可以使用JavaScript API来控制Webview的行为，例如：

  • webview.addEventListener: 监听Webview事件。

  • webview.postMessage: 向Webview发送消息。

  • webview.executeJavaScript: 在Webview中执行JavaScript代码。

  通过使用这些API，我们可以实现高度自定义的UI界面，同时也可以方便地与Rust代码进行通信和交互。

四、资源 & 文档

  • Tauri官方文档 - https://tauri.app/

  • Awesome Tauri（精选的 Tauri 生态系统和社区中最好的东西，包含插件和应用，可以借鉴和学习） -  http://github.com/tauri-apps/awesome-tauri。

  • Tauri issues（Tauri问答）- http://github.com/tauri-apps/tauri/issues

  • Tauri discussions（Tauri讨论社区） - http://github.com/tauri-apps/tauri/discussions

  • Rust 编程语言基本语法学习- http://doc.rust-lang.org/book/

  • crates.io（Rust生态的包管理网站） - http://doc.rust-lang.org/book/

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.hqwc.cn/news/1264.html

如若内容造成侵权/违法违规/事实不符，请联系编程知识网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

监督学习和无监督学习

监督学习和无监督学习

文章目录 监督学习和无监督学习监督学习算法包括无监督学习算法包括OpenCV十个子类举例： 监督学习和无监督学习 监督学习和无监督学习是机器学习领域中两种不同的学习范式，它们之间的区别在于数据的标签或标记的可用性以及学习任务的性质。 监督学习&am…
阅读更多...
【探索 Kubernetes|作业管理篇 系列 10】Pod 健康检查和恢复机制

【探索 Kubernetes|作业管理篇 系列 10】Pod 健康检查和恢复机制

前言 大家好，我是秋意零。 上一篇中介绍了，Pod 的服务对象，从而对 Pod 有了更深的理解； 今天的主题是 Pod 健康检查和恢复机制，我们将结束 Pod 的内容。 最近搞了一个扣扣群，旨在技术交流、博客互助&am…
阅读更多...
电商数据分析方案和BI强强联合，一站式做分析

电商数据分析方案和BI强强联合，一站式做分析

搭建一个电商大数据分析平台需要哪些条件？总的来说需要一套满足电商数据分析需求的方案，一个能够提供强大数据计算分析功能和数据可视化图表的平台，比如电商数据分析方案和奥威BI软件这样的组合。 电商数据分析方案BI软件，一站式…
阅读更多...
CT-ICP: 带有闭环的实时且灵活鲁棒的LiDAR里程计

CT-ICP: 带有闭环的实时且灵活鲁棒的LiDAR里程计

文章：CT-ICP: Real-time Elastic LiDAR Odometry with Loop Closure 作者：Pierre Dellenbach, Jean-Emmanuel Deschaud, Bastien Jacquet, and Francois Goulette 编辑：点云PCL 代码： https://github.com/jedeschaud/ct_icp https…
阅读更多...
Apache RocketMQ EventBridge：构建下一代事件驱动引擎

Apache RocketMQ EventBridge：构建下一代事件驱动引擎

作者：沈林 前言 事件驱动，这个词在部分人印象中，它是一个过时的技术——没什么新意。从时间上看，确实也是这样，上世纪 60 年代，事件驱动就已经被正式提出，经常会被在 GUI 编程中。但是在有些人…
阅读更多...
印刷企业WMS仓储管理系统解决方案

印刷企业WMS仓储管理系统解决方案

在数字化转型的浪潮中，印刷企业也积极寻求适合自身发展的解决方案。作为印刷业的重要环节，仓储管理对于提高效率、降低成本至关重要。而印刷企业WMS仓储管理系统的应用，为印刷企业带来了全新的解决方案。 印刷WMS仓储管理系统是一种基于信息技…
阅读更多...
区块链生态发展

区块链生态发展

文章目录 前言以太坊的到来什么是图灵完备？什么是智能合约？ 以太坊的应用去中心化应用 DApp代币发行 公有链&联盟链区块链应用总结 前言 前面的区块链文章有介绍区块链的诞生以及底层运行原理， 本文主要介绍一下区块链应用的发展&#x…
阅读更多...
34岁上岸，我终于圆了自己的考研梦

34岁上岸，我终于圆了自己的考研梦

​ 大家好，我是独孤风，一位曾经的港口煤炭工人，目前在某国企任大数据负责人，公众号大数据流动的作者。 ​ 虽然告诉自己要平静，但是当接到EMS录取通知书的那一刻，眼眶还是忍不住有些湿润。今年正好是是东北…
阅读更多...
flutter 简介 flutter 能为我们做什么

flutter 简介 flutter 能为我们做什么

flutter 简介 flutter 能为我们做什么 前言一、什么是Flutter？二、Flutter的特点和优势三、Flutter与其他跨平台框架的比较总结 前言 陆陆续续已经写了60多篇的flutter 的文章了，本篇文章就来说说我对flutter 的简单看法 一、什么是Flutter&#xff1f…
阅读更多...
ffmpeg命令参数

ffmpeg命令参数

主要参数 -i 设定输入流 -f 设定输出格式（format） -ss 开始时间 -t 时间长度视频参数 -vframes 设置要输出的视频帧数 -b 设定视频码率 -b:v 视频码率 -r 设定帧率 -s 设定画面的宽与高 -vn 不处理视频 -aspect aspect 设置横纵比4:3 或16:9 或1.333或…
阅读更多...
果蔬识别系统Python+Django+TensorFlow+卷积神经网络算法

果蔬识别系统Python+Django+TensorFlow+卷积神经网络算法

一、介绍 果蔬识别系统，使用Python作为主要开发语言，基于深度学习TensorFlow框架，搭建卷积神经网络算法。并通过对数据集进行训练，最后得到一个识别精度较高的模型。并基于Django框架，开发网页端操作平台，…
阅读更多...
Unity渲染工程收集

Unity渲染工程收集

NPR 非真实渲染 UnityURP-AnimeStyleCelShader SSR 屏幕空间反射 UnitySSReflectionURP
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023