如何评价rust前端框架dioxus？

2023-04-12 22:09| 来源: 网络整理| 查看: 265

主仓库贡献者、CLI 主要维护者、组织成员来回答一下吧：

我认为你无法直接将整个 Dioxus 与 Yew，Tauri 之类的项目进行对比，因为 Dioxus 涵盖的面很广，Dioxus-Web 就是类似于 Yew 的 Web UI 开发库，而 Dioxus-Desktop 则是在 Tauri Wry 的基础上使用 Rust 编写前端的解决方案。那这篇回答主要还是重点放在 UI 开发方面吧。

Dioxus 的作者最初是完全按照 React 设计的这个框架，内部实现、API风格都是严格按照 React Style 制作的。这件事情在我们社区之前也出现过争论，因为过度的模仿 React 导致其在 Rust 这门语言中发挥不出最好的效果，所以说后来 API 也有几次大的变动。（不过总的来看还是类似于 React 风格的）

再说说项目的活跃度吧，我发现近期作者有摸鱼的嫌疑，活跃度不如以前了，不过好在有新的一位大佬扛起了大旗（Demonthos：就是他抢走了我的贡献榜第二呜呜呜），相关的生态也在积极发展中，类似于 UI 组件库、拓展的 Hooks 库，以及支持 Dioxus liveview 的服务器框架也越来越多了，总的来说是在往好的方向发展。

回归到框架使用体验本身，我认为 Dioxus 在编写 UI 的设计上绝对是不错的，你可以使用一种叫 RSX 的结构来编写你的 UI 代码，它其实就是以另一种方法来编写 HTML 和虚拟 DOM：

fn app(cx: Scope) -> Element { let mut count = use_state(&cx, || 0); cx.render(rsx! { h1 { "High-Five counter: {count}" } button { onclick: move |_| count += 1, "Up high!" } button { onclick: move |_| count -= 1, "Down low!" } }) } 我个人认为是比 HTML 易读的（反正我不喜欢天天写这种格式！

再来说一下我比较在意的 Async 方面吧，因为写 UI 最重要的就是与后端进行交互，所以说我们自然会用到网络请求，自然也就涉及到了 Async 函数的调用了。Dioxus 的组件函数本身不支持 async 声明，但是我们提供了一个 UseFuture 的 Hooks，它可以让我们完成对异步函数的调用，并且根据不同情况渲染不同的 rsx 内容：

fn app(cx: Scope) -> Element { let breeds = use_future(&cx, (), |_| async move { reqwest::get("https://dog.ceo/api/breeds/list/all") .await .unwrap() .json::() .await }); let status = match breeds.value() { Some(Ok(val)) => "ready!", Some(Err(err)) => "errored!", None => "loading!", } cx.render(rsx! { h1 { "{status}" } }) }

你可以监控到很多种不同的情况，包括 Future 运行中，运行完成，重新运行期间等，并且你可以绑定外界变量变化的监听，如果外界变量被改变，则重新运行 Future 方法。

除此之外，Dioxus 还有非常易用的 Router 支持：

rsx!{ Router { Route { to: "/home", Home {} } Route { to: "/blog/:id", Blog {} } Route { to: "", NotFound {} } } }

这种表达方式当初让我眼前一亮，它被直接嵌入在 RSX 之中，用于表达当前组件下的子路径，使得 Web 开发再次变得方便。（目前路由功能必须在服务器的加持下运行，我们也在尝试为 CLI 寻找直接打包成自带路由相关 html 的方案）

总的来说，使用 Dioxus 开发网页是绰绰有余的，这里给罗列一些使用 Dioxus 制作的网站：

YuKun Liu | mrxzx.info - 我个人的介绍网站以及博客Pomo Timer - 社区用户制作的计时器（挺漂亮的）Caesar - 社区用户制作的一个加密网站（小玩具）Concentric Time - 社区用户制作的动态时钟Pi Searcher - 在 PI 中寻找数字串的小玩具Katex Wasm - 渲染 Katex 数学公式的 DemoZomatree / Furor - 使用 Dioxus 制作的 Revolt 客户端Prism for Rust - 渲染 Prism 高亮的 DemoDioxus Convert - 将 HTML 转为 RSX 的在线工具TeacherPod | Podcast - 使用 Dioxus 的在线播客系统

以上项目是我在社区 Discord 中找到比较有意思的项目（仅 Web 项目），Dioxus Web 开发的项目都是可以直接部署在 Github Page & Netlify 等在线平台的，我们也为 Dioxus Web 项目提供了一键部署的 Github Action | Deploy ，将它放在你的仓库中即可完成一键部署。

Dioxus 是一款值得你尝试的项目，我们也希望它能越来越好！

【本文地址】

公司简介

联系我们