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!')"
        }
    }
}
相关推荐
林小帅24 分钟前
NestJS v11 + Prisma v7 ESM 迁移配置解析
前端·javascript·后端
IT_陈寒39 分钟前
React的setState竟然不是立刻生效的,害我调试半天
前端·人工智能·后端
简简单单就是我_hehe43 分钟前
前端埋点日志解决方案:完整 User-Agent 解析工具实现,爬虫识别、设备品牌、操作系统、浏览器版本全解析(附完整源码)
前端·爬虫
William_Xu2 小时前
Vue 2 与 Vue 3 生命周期对比
前端
Hilaku2 小时前
为什么你的大文件断点续传,一遇到弱网就崩溃?
前端·javascript·程序员
胡哈3 小时前
React Compiler:让开发者忘掉 memo 这件事
前端·react.js
xiyueyezibile3 小时前
“自迭代” Skill 的 team-pitfalls 的演进
前端·后端·ai编程
林恒smileZAZ3 小时前
`Array(100).map(() => 1)` 为什么全为空?
前端·javascript
小巧的砖头3 小时前
C#会重蹈覆辙吗?系列之2:反射及元数据的性能问题
开发语言·前端·c#
KaMeidebaby3 小时前
卡梅德生物技术快报|蛋白的叠氮基修饰:实操解析:核酸模板耦合蛋白的叠氮基修饰实现靶蛋白定点共价标记
前端·人工智能·物联网·算法·百度