Tauri VS. Electron - 真实项目的比较
文章翻译自:Tauri VS. Electron - Real world application
以下是正文:
在这篇文章中我将会用真实的项目来比较 Electron 和 Tauri: Authme。Authme 是一个跨平台使用双因素验证的桌面程序。不大也不复杂,很适合作比较。你可以在 GitHub 上查看使用 Electron 开发的源代码,也可以在 GitHub 查看使用 Tauri 开发的源代码。我的目标是使用 Tauri 完全替代 Electron。
Electron 程序架构
Electron 是什么
Electron 是一个使用 JavaScript, HTML, and CSS 等web技术创建原生应用程序的框架。它负责处理难的部分以至于你只要专注在你应用上。如果你能构建一个网站,那么你也可以额构建一个桌面应用程序。
程序架构
The Electron app is written in plain-old HTML and JavaScript. For styling I'm using TailwindCSS and some custom CSS.
Electron 程序是使用普通的 HTML 和 JavaScript 编写的。样式部分使用了 TailwindCSS 和一些自定义样式。
Tauri 程序架构
Tauri 是什么
Tauri 是一个为所有主要的桌面平台构建微小、速度极快的二进制文件的框架。开发者可以使用任意编译为 HTML, JS 和 CSS 的前端框架来构建他们的用户界面。应用程序的后端是一个 rust 二进制文件,其中包含前端可以与之交互的 API
架构
我的 Tauri 应用程序使用了更现代的堆栈。构建工具是 Parcel,框架是 Svelte,使用 TypeScript 代替了 JavaScript。样式使用 TailwindCSS 完成。
比较
This is not a head-to-head comparison, but the app is basically the same.
这不是一个直接的比较,但应用程序基本上是相同的。
关键点:
- 包
- 启动时间
- 性能
- 程序后端
- 渲染程序
- 安全
- 自动更新
- 开发经验
1. 包
毫无疑问的赢家:Tauri
Tauri 程序安装包只有大约 2.5MB(!!!),而 Electron 程序安装包却有 85MB
Full bundle size:
Tauri 有一个主要的优势:程序会被编译为二进制,意味着你要成为一个逆向工程专家才能反编译程序。而在Electron 程序中你可以使用简单的 NPM 命令 拆解程序。
如果你的用户有 Tauri 使用的 webview 的正确运行时,那么你可以仅仅发送一个简单的可执行文件给他们,用户也不用安装任何东西。
2. 启动时间
虽然不是一个精确的测试,但运行程序并记录启动时间方面产生了一个赢家:
- Tauri: ~ 2 秒
- Electron: ~ 4 秒
3. 性能
同样这也不是一个精确地测试,只是一个粗略的比较。这些测试来自我的电脑:i5-4570 CPU, 16GB RAM, GTX 1660 and Windows 11
Tauri (Windows)
Test | CPU | RAM | GPU |
---|---|---|---|
Idle | 1% | ~ 80MB | 0% |
Electron (Windows)
Test | CPU | RAM | GPU |
---|---|---|---|
Idle | 1% | ~ 120MB | 0% |
Honestly I expected more from Tauri, sure it uses less RAM, but not by much. Let's take a look at what's up on the Linux side.
说实话我更期待 Tauri,它使用了更少的 RAM,但也不是很少。让我们看看在 Linux 上运行的情况。
Tauri
Electron
哇,Tauri 大胜!
4. 程序后端
这是 Tauri 的一个劣势(或者可以说是它最大的优势,取决于你自己)。在 Electron 程序中你可以使用 JavaScript 编写程序后端,因为 Electron 使用了 Node.js 运行时。Tauri 由 Rust 编写而来。如果你了解 Rust 可能会高兴,但如果你要在 scratch 上学习 Rust(我就是),你将要面对一些问题。
你必须使用 Rust 重新编写你的程序,所以我认为在这方面 Electron 是赢家。现在,后端的可选替代比如 Python,C++,Deno 已经在 Tauri 的规划中了,我很期待 Deno 的整合,这样我就可以再次用 JavaScript/TypeScript 编写程序了。
5. 渲染你的程序
Electron 是基于 Chromium 的,所以用户能在 Windows,Linux,macOS 上看到相同的界面。而 Tauri 使用的是系统 webview:Windows 上的 Edge Webview2 (Chromium),Linux 上的 WebKitGTK 和 macOS 上的 WebKit。糟糕的部分来了,如果你是一个 web 开发者你应该知道 Safari(Based on WebKit) 总是落后于每个 web 浏览器。可以通过 Can I Use 检测。总有一个 bug 出现在你亲爱的 Safari 用户上却不会出现在 Chrome。Tauri上有相同的问题存在并且除了包含 polyfills 不能做任何事情处理它。这方面来说,Electron是赢家。
我在开发 Tauri 时遇到的一个问题是我的 CSS 包没有包含“-webkit”前缀,所以我的应用程序的 CSS 漏洞百出。
6. 安全
Tauri 是非常安全的,但我不会说 Electron也是。Tauri 有许多内置的 安全 特性。你甚至可以显式启用或禁用某些 API。再 Electron 中你可以使用全部的 Node 接口,所以黑客很容易利用这些强大的接口。而Tauri 的情况并非如此,你必须显式地公开 Rust 函数。
7. 自动更新
xkcd.com
在2022年发布一个没有自动更新的应用程序是不可行的。如果你的用户不得不手动下载每一个更新,我不认为他们会高兴。Electron 和 Tauri 都有一个内置的自动更新程序,但 Tauri 的更加简单。我认为大部分人在 Electron 中使用 electron-updater。而 Tauri 中可以使用 内置 的更新器,不过不好的一面是你不得不维护自己的 更新服务 或者使用一个简单的 JSON file 不过你不得不手动更新。Electron 更新器从 GitHub 发布的二进制文件中提取信息,这样更加方便。
8. 开发经验
对于 Tauri,安装 Tauri CLI 就能得到整个包:热更新,在所有平台上构建你的程序,生成应用图标。而 Electron 除了框架本身之外什么都不会给你。你必须建立热更新,打包程序等等... Tauri 已经给你准备了所有东西。最棒的是:Tauri可以兼容世界上每一个 web 框架。它只需要一个本地路径或者文件夹其中包含所有绑定的代码。
总结
Electron 将会被替代?是的,Tauri 更好,但它仍然有待提高。我可以肯定未来几年里 Tauri 团队会抓住机会做得更好(这里可能翻译的不是很好,原文是:In a couple of years I'm sure the Tauri team will catch app to Electron)。令我期待的是:Deno 作为后端,更好的自动更新,对iOS/Android的支持。
感谢阅读我的第一篇文章!我的母语不是英语,文章中如果有任何错误的地方我感觉抱歉。
Tauri VS. Electron - 真实项目的比较的更多相关文章
- Java算法之递归打破及在真实项目中的使用实例
开心一笑 刚才领导问开发:"你觉得这个项目的最大风险是什么",开发说:"加班猝死" , 气氛尴尬了一分钟!!! 提出问题 1.递归算法简单复习 2.如何实现递归 ...
- OkGo3.0 --真实项目使用和二次封装(转)
转载:https://blog.csdn.net/jiushiwo12340/article/details/79011480 11.OkGo3.0真实项目使用和二次封装: ==== 11.OkG ...
- iOS -数据持久化方式-以真实项目讲解
前面已经讲解了SQLite,FMDB以及CoreData的基本操作和代码讲解(CoreData也在不断学习中,上篇博客也会不断更新中).本篇我们将讲述在实际开发中,所使用的iOS数据持久化的方式以及怎 ...
- 用java发邮件之一 (直接源于真实项目) 【原】
真实项目应用的java发送邮件,应该还待进一步完善. 依赖 mail-1.4.jar jar包下载地址: http://mvnrepository.com/artifact/javax.mail/ma ...
- 从后端到前端之Vue(四)小试牛刀——真实项目的应用(树、tab、数据列表和分页)
学以致用嘛,学了这么多,在真实项目里面怎么应用呢?带着问题去学习才是最快的学习方式.还是以前的那个项目,前后端分离,现在把前端换成vue的,暂时采用脚本化的方式,然后在尝试工程化的方式. 现在先实现功 ...
- Electron桌面项目-解决throw new Error('Electron failed to install correctly, please delete node_modules..
前言 Electron 是一个用 HTML,CSS 和 JavaScript 来构建跨平台桌面应用程序的一个开源库.由GitHub开发的. 其原理是 Electron 通过将 Chromium 和 N ...
- Solr搭建真实项目
在经过solr5.4.1 quick start 的学习后.我们要搭建真实的项目了 1.启动项目 bin/solr start 2.创建core bin/solr create -c pms 3.为 ...
- electron demo项目npm install安装失败解决办法
electron官网提供的demo项目,在npm install 的时候总是报错显示安装失败, 解决办法:FQ即可成功安装.
- 手把手教你创建electron+vue项目
electron可以结合前端的很多框架来进行快速的开发.在这里只讲一种electron结合vue并且使用前端的elementui来快速搭建一个项目页面. 第一步.创建electron 以管理员身份运行 ...
- vue真实项目结构
我明白你的需求.如果你想看一个真实企业项目使用的复杂目录结构,你可以参考以下几个例子: 根据1的介绍,一个vue项目的目录结构可以细分为以下几个部分: |- src | |- api 存放所有请求接口 ...
随机推荐
- BZOJ 3450 - Tyvj1952 Easy (期望DP)
描述 某一天 WJMZBMR 在打 osu~~~ 但是他太弱逼了,有些地方完全靠运气:( 我们来简化一下这个游戏的规则: 有 \(n(n\le 300000)\) 次点击要做,成功了就是 o,失败了就 ...
- vue 调试工具vue-devtools 安装
一.下载 工具vue-devtools 注:必须是5.1.1版本 比这个版本高的试过,没法正确使用. https://github.com/vuejs/vue-devtools/tree/v5.1.1 ...
- C#单向链表的实现
节点 public class ListNode { public ListNode(int NewValue) { Value = NewValue; } //前一个 public ListNode ...
- md文件的基本常用编写语法
md简介 .md即markdown文件的基本常用编写语法,是一种快速标记.快速排版语言,现在很多前段项目中的说明文件readme等都是用.md文件编写的,而且很多企业也在在鼓励使用这种编辑方式.下面就 ...
- Windows 平台 UTF-8 编码转换为本机编码
std::string from_utf8(const std::string& src) { int n = MultiByteToWideChar(CP_UTF8, 0, src.c_st ...
- RL 基础 | 如何注册自定义 gym 环境
如何 搭建 自定义 gym 环境:https://www.cnblogs.com/moonout/p/17174833.html 如何注册自定义 gym 环境: 博客:https://zhuanlan ...
- Could not get a resource from the pool 异常定位和解决
最近在服务中经常看到以下错误,进行下定位和问题解决分析: 2023-12-08 00:10:58.248 WARN [terra-sr-server,a9006fd27ccb81d0,a9006fd2 ...
- Socket 如何处理粘包
Socket 如何处理粘包 什么是粘包什么是半包? 粘包: 比如发送了AA BB 两条消息,但是另一方接收到的消息却是AAB,像这种一次性读取了俩条数据的情况就是粘包 半包: 比如发送的消息是ABC时 ...
- 【译】Visual Studio 2013 退役 :旧版本 Visual Studio 的支持提醒
新年到了,也是提醒我们 Visual Studio 支持生命周期中即将到来的日期的好时机.对 Visual Studio 2013 的支持将于今年4月9日结束.如果您使用的是旧版本的Visual St ...
- 07 - HTTP
HTTP 强烈推荐学习:HTTP | MDN 一 .基础概念 请求和响应报文 客户端发送一个请求报文给服务器,服务器根据请求报文中的信息进行处理,并将处理结果放入响应报文中返回给客户端. 请求报文结构 ...