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!')"
        }
    }
}
相关推荐
用户62960593247056 分钟前
一次位置调整引发的画布失忆:深入 Vue2 虚拟 DOM 复用机制
前端·vue.js
Sterting8 分钟前
条件渲染与列表渲染
前端·vue.js
__sjfzllv___11 分钟前
在职前端Leader学习/转行 AI Agent -DAY28
前端
不爱说话郭德纲12 分钟前
uni-app x iOS 扫码模糊怎么办?AVFoundation 灰尘级别摄像头助你超广角聚焦
前端·uni-app·app
柒和远方13 分钟前
V062:WebGPU 端侧推理与单例模式:从 Transformers.js 把大模型装进浏览器,到 Worker 线程的流式对话
前端
huabuyu16 分钟前
INP 自动化归因与自愈:如何自动定位、修复并验证一次卡顿
前端·javascript
何时梦醒17 分钟前
第一篇:项目概览 — 在浏览器里跑大模型,端侧 AI 的革命来了
前端·人工智能
何时梦醒17 分钟前
第二篇:工程化搭建 — Vite + React + TypeScript + TailwindCSS 全解析
前端·人工智能
只一21 分钟前
React 性能优化精讲:useCallback 与 useMemo 彻底吃透(附实战案例)
前端·react.js
橘子星22 分钟前
浏览器也能跑大模型:WebGPU + Transformers.js 本地运行 DeepSeek-R1
前端·人工智能