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!')"
        }
    }
}
相关推荐
开开心心就好几秒前
手机悬屏翻译工具外语游戏漫画APP全覆盖
android·前端·javascript·python·游戏·pdf·html
支支დ7 分钟前
Phind 前端特定优势:AI 编程助手的体验革新
前端
对象存储与RustFS8 分钟前
给 RustFS 拆多租户权限:IAM 用户、组与策略的实战
后端·rust·开源
DDXYcoder12 分钟前
万字解析动态内存从编译到运行
java·前端·算法
光影少年13 分钟前
react navite封装一个RN 通用按钮组件
前端·javascript·react native·react.js·前端框架
晴天1615 分钟前
CSS 预处理器深度解析-Day35
前端·css
恋猫de小郭17 分钟前
AI 时代,也许你的 Flutter 需要一套 Dartastic OpenTelemetry 监控
android·前端·flutter
wujiuhsu20 分钟前
前端实现二维码生成器:Canvas、SVG、纠错等级、扫码校验与批量
前端
计算机魔术师25 分钟前
从卖铲人到圈地:英伟达129亿拿下Hugging Face
前端
攻城狮-申29 分钟前
git本地分支对齐远程分支
前端·git