写一次 Rust。 在 8 个平台上直接画到 GPU 上。

use gpux::prelude::*;
use gpux::ui::component::button::{Button, ButtonVariants as _};

impl Render for ClusterMonitor {
    fn render(&mut self, _: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
        let state = self.store.read();
        v_flex().size_full().p_5().gap_4()
            .bg(cx.theme().background).text_color(cx.theme().foreground)
            .child(format!("活跃节点: {} · P99: {:.2}ms", state.nodes, state.p99_ms))
            .child(
                h_flex().gap_2()
                    .child(Button::new("scale-up").primary().label("+ 扩容节点")
                        .on_click(cx.listener(|this, _, _, cx| {
                            this.store.update(|s| s.nodes += 1);
                            cx.notify();
                        })))
                    .child(Button::new("inspect").outline().label("调用 cluster.inspect")
                        .on_click(cx.listener(Self::on_sample_snapshot))),
            )
    }
}

use gpux::prelude::*;
use serde::{Deserialize, Serialize};

#[derive(Debug, Serialize, Deserialize)]
pub struct InspectReq { pub region: String, pub include_vram: bool }

#[derive(Debug, Serialize, Deserialize)]
pub struct ClusterSnapshot { pub healthy_nodes: u32, pub vram_used_mb: f32, pub frame_budget_ms: f32 }

// 1. 普通强类型 Rust 函数即可作为服务，无需过程宏标记
pub fn inspect_cluster(req: InspectReq) -> anyhow::Result<ClusterSnapshot> {
    Ok(ClusterSnapshot { healthy_nodes: 16, vram_used_mb: 24.8, frame_budget_ms: 0.14 })
}

// 2. 在视图中以 1.2µs 延迟直接做类型安全调用
let req = InspectReq { region: "ap-east-1".into(), include_vram: true };
if let Ok(snap) = self.services.call::<InspectReq, ClusterSnapshot>("cluster.inspect", &req) {
    self.store.update(|s| { s.nodes = snap.healthy_nodes; s.p99_ms = snap.frame_budget_ms; });
}

use gpux::prelude::*;

impl ClusterMonitor {
    pub fn render_adaptive_shell(&mut self, width: f32, height: f32) -> Div {
        let responsive = ResponsiveContext::from_viewport(width, height)
            .with_safe_area(if width < 600.0 { SafeAreaInsets::ios_notch() } else { SafeAreaInsets::zero() });

        let root = v_flex().size_full()
            .pt(px(responsive.safe_area.top)).pb(px(responsive.safe_area.bottom));

        if responsive.is_mobile() {
            root.px_4().child(self.render_mobile_cards())
                .child(self.render_bottom_tab_bar(self.router.can_go_back()))
        } else {
            root.px_6().child(
                h_flex().size_full().gap_5()
                    .child(self.render_desktop_sidebar())
                    .child(self.render_telemetry_grid(responsive.breakpoint.recommended_columns())),
            )
        }
    }
}

use gpux::prelude::*;

pub fn build_app() -> gpux::App {
    App::new().title("GPUX Telemetry Studio").size(1120.0, 720.0)
        .bind("cluster.inspect", inspect_cluster)
        .with_state(ClusterState::default())
}

// 1. 桌面端入口 (macOS Metal / Linux Vulkan / Windows DX12)
pub fn run_desktop() -> anyhow::Result<()> {
    build_app().run_with_view(ClusterMonitor::new)
}

// 2. 移动端 C-ABI 导出 (iOS UIKit / Android NativeActivity / 鸿蒙 XComponent)
#[unsafe(no_mangle)]
pub extern "C" fn gpux_mobile_entry() -> i32 {
    build_app().run_mobile().map(|_| 0).unwrap_or(-1)
}

// 3. Web (WASM) 与小程序端入口 (WebGPU / WebGL2)
#[cfg(target_arch = "wasm32")]
#[wasm_bindgen::prelude::wasm_bindgen(start)]
pub fn wasm_main() -> Result<(), wasm_bindgen::JsValue> {
    build_app().run_web_with_view("gpux-canvas", ClusterMonitor::new)
        .map_err(|e| wasm_bindgen::JsValue::from_str(&e.to_string()))
}