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

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

image.png

新系列《这些前端新技术你很难再忽视了》,包括:SolidJS、Svelte、Tauri、Bun、Schema等。每一个都引领前端技术演变趋势,很有必要了解。


咱们将采用 5W1H 分析法,即 What(何事)、Why(何因)、Where(何地)、When(何时)、何人(Who)、How(何法)6 个维度来解析这些“新玩意儿”。

本篇带来 —— 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



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

答: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


😄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 版本、安装成功。


  1. 运行 yarn tauri dev

image.png


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


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


相关文章
|
1月前
|
人工智能 Rust 前端开发
前端界的未来趋势:掌握这些新技术,让你的作品走在时代前沿!
【10月更文挑战第30天】前端开发正以前所未有的速度发展,新技术层出不穷。本文探讨了AI助手(如GitHub Copilot)、低代码/无代码平台、跨平台技术(如React Native)和WebAssembly等未来主流技术,并附上示例代码,帮助你走在时代前沿。
78 1
|
1月前
|
前端开发 JavaScript
前端界的革命:掌握这些新技术,让你的代码简洁到让人惊叹!
前端技术的快速发展带来了许多令人惊叹的新特性。ES6及其后续版本引入了箭头函数、模板字符串等简洁语法,极大减少了代码冗余。React通过虚拟DOM和组件化思想,提高了代码的可维护性和效率。Webpack等构建工具通过模块化和代码分割,优化了应用性能和加载速度。这些新技术正引领前端开发的革命,使代码更加简洁、高效、可维护。
26 2
|
1月前
|
前端开发 开发者 C++
独家揭秘:前端大牛们如何高效学习新技术,保持竞争力!
【10月更文挑战第31天】前端技术飞速发展,如何高效学习新技术成为关键。本文通过对比普通开发者与大牛们的策略,揭示了高效学习的秘诀:明确目标、主动探索、系统资源、实践应用和持续学习。通过这些方法,大牛们能更好地掌握新技术,保持竞争力。示例代码展示了如何通过实践加深理解。
43 4
|
1月前
|
前端开发 JavaScript API
前端界的革命性突破:掌握这些新技术,让你的作品引领潮流!
【10月更文挑战第30天】前端技术日新月异,从传统的HTML、CSS、JavaScript到现代的React、Vue、Angular等框架,以及Webpack、Sass等工具,前端开发经历了巨大变革。本文通过对比新旧技术,展示如何高效掌握这些新技术,助你作品引领潮流。
43 2
|
7月前
|
前端开发 JavaScript vr&ar
前端新技术探索:WebAssembly、Web Components与WebVR/AR
【4月更文挑战第12天】WebAssembly、Web Components和WebVR/AR正重塑Web应用的未来。WebAssembly允许C/C++等语言在Web上高效运行,提供接近原生的性能,如游戏引擎。Web Components通过Custom Elements和Shadow DOM实现可复用的自定义UI组件,提升模块化开发。WebVR/AR(现WebXR)则让VR/AR体验无需额外应用,直接在浏览器中实现。掌握这些技术对前端开发者至关重要。
97 3
|
资源调度 前端开发 JavaScript
这些前端新技术你很难再忽视了 —— Monorepo
这些前端新技术你很难再忽视了 —— Monorepo
这些前端新技术你很难再忽视了 —— Monorepo
|
存储 资源调度 前端开发
这些前端新技术你很难再忽视了 —— pnpm
这些前端新技术你很难再忽视了 —— pnpm
|
JSON 前端开发 JavaScript
这些前端新技术你很难再忽视了 —— JSON Schema
这些前端新技术你很难再忽视了 —— JSON Schema
|
Web App开发 Rust JavaScript
这些前端新技术你很难再忽视了 —— Bun
这些前端新技术你很难再忽视了 —— Bun
|
2月前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
170 2