Longbridge 开源 GPUI Component：Rust 桌面端的 GPU 加速 UI 组件库

星眸·GitHub 观察者 技术创作者 2026-08-20 1551 阅读

Longbridge 开源 GPUI Component：Rust 桌面端的 GPU 加速 UI 组件库

GitHub： https://github.com/longbridge/gpui-component
⭐ 13,273 | 794 Fork | Rust | Apache-2.0

一、项目定位

gpui-component 是 Longbridge（长桥科技）开源的 Rust 桌面 UI 组件库，基于 GPUI 构建。GPUI 最初由 Zed Industries 开发，是 Zed 编辑器（曾以 13 亿美元估值融资）的核心渲染引擎，Longbridge 在其基础上封装了完整的生产级组件体系。

从定位上看，项目走的是 shadcn/ui 的思路——不是”安装即用”的封闭框架，而是提供可复用、可定制、可直接拷贝到项目中的组件资产。Longbridge 从第一天起就用它构建 Longbridge Pro 桌面客户端，所有组件都在真实商业产品中被反复打磨过。

二、技术架构

项目分为两个层级：

┌──────────────────────────────────────┐
│           APPLICATION                │
└───────────────┬──────────────────────┘
                │
     ┌──────────┴──────────┐
     ▼                     ▼
┌──────────────┐   ┌──────────────────┐
│gpui-component│   │ Your Design System│
│  完整样式组件 │   └────────┬─────────┘
└──────┬───────┘            │
       └─────────┬──────────┘
                 ▼
        ┌────────────────┐
        │   gpui-base    │
        │ Behavior+State │
        │  Infrastructure │
        └───────┬────────┘
                ▼
              GPUI
层级 定位
gpui-component 完整样式组件，开箱即用，适合构建应用
gpui-base 底层行为与基础设施，无样式，适合自建设计系统

这种分层和 Web 生态的对应关系很清晰：GPUI → HTML+Tailwind，gpui-base → Base UI，gpui-component → shadcn/ui。

三、技术特色

1. GPU 加速，120 FPS 有保障

GPUI 使用 GPU 进行渲染而非 CPU 光栅化，这是与 Iced（wgpu）、egui（wgpu）最大的架构差异。GPUI 的响应式框架直接生成 GPU 指令，绕过了操作系统原生控件的包袱。

2. 虚拟列表：数十万行数据无卡顿

VirtualList 支持渲染任意高度条目的可见范围，Table 支持虚拟行+虚拟列、固定列宽可拖拽、排序和单元格选择，在 数十万行 数据量下依然流畅。

3. 代码编辑器：Tree-sitter + LSP

内置代码编辑器示例支持：

  • Tree-sitter 语法高亮
  • LSP 诊断、补全、悬停（200K 行级别稳定运行）
  • 覆盖主流语言

4. Dock 布局系统

可拖拽标签页、可调整大小面板、嵌套分割、边缘停靠，支持序列化保存布局——相当于把 VS Code 的面板系统 Rust 化了。

5. 丰富的富内容支持

  • Markdown 渲染：支持嵌入 HTML
  • HTML 渲染：基础支持
  • Chart：内置图表组件（System Monitor 示例展示实时 CPU/内存折线图）
  • 语法高亮：基于 Tree-sitter

6. 60+ 组件，覆盖生产全场景

从基础的 Button、Input、Select，到表单、导航、浮层、反馈、布局类组件一应俱全。主题支持 macOS 和 Windows 双风格，语义化 Theme API 支持完全自定义。

7. 国际化（i18n）

内置 i18n 支持，无需第三方库。

四、快速上手

依赖声明（Cargo.toml）

gpui = { git = "https://github.com/zed-industries/zed" }
gpui_platform = { git = "https://github.com/zed-industries/zed", features = ["font-kit"] }
gpui-component = { git = "https://github.com/longbridge/gpui-component" }

最小示例

use gpui::*;
use gpui_component::{button::*, *};

pub struct HelloWorld;

impl Render for HelloWorld {
    fn render(&mut self, _: &mut Window, _: &mut Context<Self>) -> impl IntoElement {
        div()
            .v_flex()
            .gap_2()
            .size_full()
            .items_center()
            .justify_center()
            .child("Hello, World!")
            .child(
                Button::new("ok")
                    .primary()
                    .label("Let's Go!")
                    .on_click(|_, _, _| println!("Clicked!")),
            )
    }
}

fn main() {
    gpui_platform::application().run(move |cx| {
        gpui_component::init(cx); // 使用组件前必须调用

        cx.spawn(async move |cx| {
            cx.open_window(WindowOptions::default(), |window, cx| {
                let view = cx.new(|_| HelloWorld);
                cx.new(|cx| Root::new(view, window, cx))
            })
            .expect("Failed to open window");
        })
        .detach();
    });
}

运行示例

# 组件 Gallery（Storybook）
cargo run

# 代码编辑器（Tree-sitter + LSP）
cargo run --example editor

# Dock 布局
cargo run --example dock

# Markdown 渲染
cargo run --example markdown

# 实时图表（System Monitor）
cargo run -p system_monitor

# 基础 Hello World
cargo run -p hello_world

图标

组件内置 Icon 元素，但不含 SVG 文件。推荐使用 Lucide 图标，将 SVG 文件按 IconName 枚举中的名称命名后放入项目即可扩展。

五、与主流 Rust UI 框架对比

GPUI Component Iced egui Qt 6
渲染核心 GPUI wgpu wgpu Qt
License Apache-2.0 MIT MIT/Apache-2.0 商业/LGPL
最小二进制 12MB 11MB 5MB 20MB+
跨平台 ✅ ✅ ✅ ✅
Web (WASM) ✅ ✅ ✅ ✅
虚拟列表 ✅ 行+列 ❌ ✅ 仅行 ✅ 行+列
Markdown ✅ 含 HTML ✅ 基础 ❌
代码编辑器 Tree-sitter 基础 基础 基础 API
Dock 布局 ✅ ✅ ✅ ✅
内置主题 ✅ macOS/Windows ❌ ❌ ❌
内置图表 ✅ ❌ ❌ ✅
CJK 支持 ✅ ✅ ❌ ✅

六、Star 趋势与社区热度

  • 2024 年 6 月 13 日仓库创建，至今约 2 年
  • 13,273 ⭐（持续增长中），794 Fork，105 个 Open Issues
  • 作为 Zed 编辑器 GPUI 生态的延伸，受益于 Zed 的高估值曝光和 Rust 社区对 GUI 的持续关注
  • 项目内置 Discussion 区，Longbridge 团队维护活跃

七、适用场景

  • 金融/行情类桌面应用：Longbridge 本身就是港美股行情交易平台，对大数据量表格、低延迟渲染有硬需求
  • 开发者工具：内置代码编辑器 + LSP + Tree-sitter，天然适合 IDE/编辑器类应用
  • 需要 Dock 布局的生产力软件：Notion、Figma 类的多面板应用
  • Rust 桌面应用：想用纯 Rust 构建现代 UI，不接受 Electron 的体积和 Node 依赖

总结

gpui-component 是目前 Rust 桌面生态中组件最完整、实战打磨最深的 GPU 加速 UI 库。它不像许多”概念验证”项目那样止步于 Demo，而是从真实的商业产品 Longbridge Pro 中提炼出来，经受了数十万用户的实际使用验证。如果你正在用 Rust 构建桌面应用，且对 UI 品质和性能有要求，这个项目值得重点关注。

评论区

0 条评论

登录后可评论。

星眸·GitHub 观察者 1551 阅读