Dioxus框架中Liveview

Liveview

Liveview允许应用程序在服务器上_运行_并在浏览器中_渲染_。它使用WebSockets在服务器和浏览器之间进行通信。

示例:

  • 简单示例

支持

Dioxus Liveview将在未来的版本中迁移到dioxus-fullstack。一旦迁移发生,你可能需要更新你的代码。我们计划使这次迁移尽可能小。

与Web平台相比,Liveview目前在功能上受到限制。Liveview应用程序在服务器上的原生线程中运行。这意味着浏览器API不可用,因此渲染WebGL、Canvas等并不像在Web上那样容易。然而,原生系统API是可访问的,所以流媒体、WebSockets、文件系统等都是可行的API。

路由器集成

目前,Dioxus路由器不与liveview渲染器中的浏览器历史集成。如果你有兴趣为Dioxus贡献这个功能,这个问题在这里被跟踪。

管理延迟

Liveview使得从客户端与服务器通信变得非常方便,但也存在一些缺点。主要是在Dioxus Liveview中,默认情况下每次交互都会通过服务器。

因此,使用liveview渲染器时,你需要非常注意管理延迟。在其他渲染器上足够快的事件,如受控输入,在liveview渲染器中可能会令人沮丧地难以使用。

为了解决这个问题,你可以在liveview应用程序中注入一些JavaScript。如果你使用原始属性作为监听器,你可以注入一些JavaScript,当事件被触发时将被运行:

rust 复制代码
rsx! {
    div {
        input {
            "oninput": "console.log('input changed!')"
        }
    }
}
相关推荐
落落落洛克3 分钟前
WAIC 2026收官复盘:国产AI打通大模型、智能体、物理机器人全产业闭环
前端
小时代的大玩家12 分钟前
HarmonyOS新特性-沉浸光感在叠叠消小游戏中的落地实践
前端·harmonyos
hunterandroid14 分钟前
[鸿蒙从零到一] ArkUI 状态管理实战:从 @State 到 @Provide 与 @Consume
前端
Hilaku14 分钟前
为什么很多人觉得前端很简单?
前端·javascript·程序员
hunterandroid17 分钟前
[鸿蒙从零到一] ArkUI 列表与网格实战:List、Grid 与 LazyForEach
前端
李明卫杭州19 分钟前
Vue2 数组响应式为什么总"不更新"?深入源码对比 Vue3 的 Proxy 改造
前端·javascript·vue.js
索西引擎25 分钟前
【React】useReducer 与 useState 的比较研究:复杂状态管理场景下的选型
前端·react.js·前端框架
hunterandroid29 分钟前
前台服务适配与线上排查:通知权限、启动限制和任务保活
android·前端
我是大卫41 分钟前
【图】React源码解析-从“上帝视角”俯瞰React的认知框架
前端·react.js·源码
不简说1 小时前
JS 代码技巧 vol.6 — 20 个性能优化野路子,从渲染到网络全栈提速
前端·javascript·程序员