levien_skill

Overview

This skill teaches how to build native UIs in the style of Raph Levien, emphasizing declarative reactive architecture, synchronized tree transformations, GPU-accelerated rendering, and idiomatic Rust patterns. It distills practical patterns like view/widget/render trees, adapt nodes for state slicing, id-path event routing, and memoized incremental updates. Use it to design responsive, accessible, and high-performance native UIs or 2D graphics systems.

How this skill works

The skill frames UI as a pipeline of tree transformations: an ephemeral view tree describes intent, a retained widget tree holds state, and a render tree computes layout and paint. It recommends diffing the view tree to mutate the widget tree incrementally, routing events by id-path with mutable access at each level, and uploading compact scene descriptions to the GPU for massively parallel rendering. Composition uses adapt nodes to slice state and memoization to avoid unnecessary rebuilds.

When to use it

• Building a native app or 2D graphics renderer that must scale in complexity and performance
• Designing UI architectures in Rust where ownership and borrow rules constrain shared mutability
• Creating accessible interfaces that require stable identity and retained structure
• Implementing virtualized lists or interfaces with tens of thousands of items
• Optimizing rendering by offloading rasterization and tiling to the GPU

Best practices

• Model UI as view → widget → render pipeline and keep responsibilities distinct
• Prefer declarative view descriptions and avoid global shared mutable state
• Use adapt nodes to give components only the state they need
• Memoize and diff sparsely; rebuild only changed subtrees using stable ids
• Describe scenes on the CPU but push heavy work (flattening, rasterization) to GPU compute shaders
• Design ids and state lifetimes for accessibility and deterministic event routing

Example use cases

• A document editor that maintains rich widget state while producing GPU-accelerated previews
• A virtualized file browser with 100k items using sparse collection diffing and memoized rows
• A custom UI toolkit in Rust that needs ergonomic typesafe views and retained widget state
• A vector renderer that encodes scenes on CPU and executes path flattening and rasterization on the GPU
• An accessible application where stable ids enable screen reader traversal and precise event handling