Metal-GPU-Rendering
render · gpuDreifach gepufferte SDF-, Text- und Bild-Renderer; die GPU-Fertigstellung überlappt mit dem CPU-Layout.
Ein hochperformantes GPU-UI-Framework für Zig. Signals, Style-Rezepte, Flex / Grid und DevTools fühlen sich an wie im Web; Metal-Rendering und ein vollständiger Text- und IME-Pfad liefern eine native App. Eine Hello Button.app mit ReleaseSmall ist 1.7 MB groß.
Der vollständige Quelltext von examples/hello_button/main.zig und die daraus kompilierte .app. Die Fensteraufnahme stammt vom E2E-Harness, der im echten Fenster dreimal auf den Button klickt.
const std = @import("std");const ui = @import("ui");const App = @import("zenit_app").App; /// 样式表:具名纯函数 + 应用层自定义 recipe,与业务逻辑分离。const S = @import("styles.zig"); const Counter = struct { n: u32 = 0, label: ?*ui.Node = null, buf: [32]u8 = undefined, pub fn increment(self: *Counter) void { self.n += 1; const node = self.label orelse return; const content = std.fmt.bufPrint(&self.buf, "Clicked {d} times", .{self.n}) catch return; if (node.getText()) |old| { var t = old; t.content = content; node.setText(t); } node.markRenderDirty(); }}; fn mountUI(cx: *ui.Cx, scope: *ui.Scope) anyerror!*ui.Node { const allocator = cx.allocator; const counter = try cx.bindState(Counter, .{}); const click = cx.on(Counter, counter, Counter.increment); const root = try ui.boxStyled(cx, S.root, .{}); try root.appendChild(allocator, try ui.textStyled(cx, S.title, "Hello, zenit!")); try root.appendChild(allocator, try ui.widgets.Button(.{ .label = "Click me", .variant = .primary, .size = .md, .on_click = click, }).mount(scope, cx)); // 应用层自定义 recipe(styles.zig 的 PanelRecipe)包住计数文本 const panel = try ui.boxStyled(cx, S.panel(.highlight), .{}); const label = try ui.textStyled(cx, S.counterLabel, "Clicked 0 times"); try panel.appendChild(allocator, label); try root.appendChild(allocator, panel); counter.label = label; return root;} pub fn main() !void { var gpa = std.heap.GeneralPurposeAllocator(.{}){}; defer _ = gpa.deinit(); const app = try App.init(gpa.allocator(), .{ .window = .{ .width = 640, .height = 480, .title = "Hello Button" }, }); defer app.deinit(); try app.runWith(mountUI);}zenit-ui-dev ist ein Agent Skill, destilliert aus dem zenit-Framework selbst und der Entwicklungsgeschichte eines produktiven macOS-Editors, der darauf aufbaut: Komponentenwahl, die drei Styling-Ebenen, Signals, native Integration, Selbstprüfung per Screenshot und Dutzende Einträge nach dem Muster Falle, Ursache, Lösung. Legen Sie ihn in ~/.claude/skills ab, und Ihr Agent lädt ihn, sobald er zenit-Code schreibt.
~/.claude/skills/zenit-ui-dev/
Pencilpen.devWir empfehlen, in Pencil zu entwerfen und den Agenten mit diesem Skill bauen zu lassen. Flex-Layout, Abstände, Radien, Schriftgrößen und lucide-Icons einer .pen-Datei liegen nah am Modell von zenit; der Skill enthält eine Feldzuordnung und ein design_diff-Tool, damit der Agent nach Zahlen statt nach Augenmaß umsetzt.
Kein WebView, kein virtuelles DOM. Der UI-Baum erzeugt eine flache DisplayItem-Liste, die die Metal-Renderer direkt verarbeiten.
render · gpuDreifach gepufferte SDF-, Text- und Bild-Renderer; die GPU-Fertigstellung überlappt mit dem CPU-Layout.
Signal · Memo · createEffectKein Neuaufbau des Baums, kein Diffing. Eine Abhängigkeit erreicht genau die Nodes, die sie lesen.
text · text_coreUnicode 17, UAX #9 Bidi, UAX #29 Graphemgrenzen und durchgängiges preedit / commit.
ui.devtools · harnessSemantische Locators, ein virtueller Cursor, Retina-Screenshots und MP4 direkt vom Drawable. DevTools inklusive.

Plattform, Rendering und Text liegen darunter. Die Grenze wird beim Build erzwungen: Ein verbotener Import kompiliert nicht.
Das Ziel im Debug-Build für grundlegende Interaktionen, einschließlich Scrollen, Cursorbewegung und Tippen in virtuellen Listen mit Zehntausenden Zeilen. Apple Silicon der M-Serie.
layout_isolation-Grenzen stoppen Dirty-Kaskadengit clone https://github.com/version-next/zenit.git cp -R zenit/templates/minimal-app ./myapp
Enthält build.zig, build.zig.zon und src/main.zig.
zenit.attach(zenit_dep, exe);
Ein Aufruf bindet ui, zenit_app, die nativen Bridges und Frameworks ein.
zig build run zig build app
Direkt starten oder eine per Doppelklick startbare macOS-.app erzeugen.
0.1.0 ist das erste öffentliche Release, aber die API kann sich vor 1.0 noch ändern. Pinnen Sie eine exakte Version; jeder Breaking Change ist in MIGRATION dokumentiert.
Der Großteil von zenits Code, Dokumentation und Tests wird mit KI-Coding-Agents geschrieben. Architektur, Review und Abnahme übernimmt ein Mensch. Deshalb gilt „kompiliert und sieht richtig aus“ bei uns nicht als Beleg. Die CI führt rund 2.700 deterministische Tests aus, eine Allokationsfehler-Kampagne, die jede Allokation der Reihe nach fehlschlagen lässt, Tests auf einem echten Metal-Gerät, E2E-Tests in echten Fenstern mit Pixelvergleich sowie Prüfungen der Modulgrenzen. Wenn Sie einen Bug oder ein Designproblem finden, eröffnen Sie bitte ein Issue: Konkrete Berichte sind das Nützlichste, was Sie uns schicken können.
Bestehende Projekte aus der Community, in echten Fenstern aufgenommen.
0:18CommunityCode-IDE (nativ)Angebunden an einen echten TypeScript-Language-Server: Vervollständigung beim Tippen, Signaturhilfe und Hover-Doku. Vervollständigungsliste, Popovers, Editor und Minimap zeichnet zenit komplett auf der GPU.
1:09CommunityWYSIWYG-Markdown-EditorEin vollständiger nativer Dokumenteditor: Listen, Checklisten, Zitate und mehrstufige Nummerierung entstehen beim Tippen, und Tabellen, Flussdiagramme, Codeblöcke und Screenshots leben im selben Dokument. Kein Electron, kein WebView: Jedes Pixel zeichnet zenit.
2:22CommunitySynthese-Kurs & Piano-Roll (nativ)Synthese lernen, während Sie Klänge gestalten: Ein eingebauter Kurs erklärt Filter Schritt für Schritt, und jeder Regler bewegt Filterkurve, Hüllkurven und Spektrum live. Danach entsteht der Song in einer Piano-Roll mit 7 Spuren. Jeder Ton kommt vom eigenen Synthesizer der App. Klicken Sie, um es mit Ton anzusehen.Partner bauen bereits ein Designtool mit unendlicher Leinwand, eine Code-Editor-IDE, einen Video-Downloader … Ein Satz Nodes, Styles und nativer Fähigkeiten trägt ganz unterschiedliche Produkte.
Zoomen, Ziehen und Mehrfachauswahl auf der GPU, mit Liquid-Glass-Panels über der Leinwand.
Virtualisierte große Dateien, ein vollständiger IME-Pfad, Paletten über mehrere Fenster und native Menüs.
Hintergrundjobs mit Live-Fortschritt, fertige Dateien direkt in den Finder ziehen.
Das Framework ist offen für alles. Beginnen Sie mit einem Fenster und bauen Sie die Mac-App, die Ihnen vorschwebt.
LoslegenOb Designer oder Entwickler: Wenn Sie ein verlorener Frame, ein um einen Tick verspäteter Cursor oder eine unstimmige Easing-Kurve stört, sind Sie genau die Person, die wir suchen. Helfen Sie uns, zenit schneller und angenehmer in der Nutzung zu machen.