Back to Skills

gpui-performance

verified

Performance optimization techniques for GPUI including rendering optimization, layout performance, memory management, and profiling strategies. Use when user needs to optimize GPUI application performance or debug performance issues.

View on GitHub

Marketplace

geoffjay-claude-plugins

geoffjay/claude-plugins

Plugin

rust-gpui-developer

languages

Repository

geoffjay/claude-plugins
7stars

plugins/rust-gpui-developer/skills/gpui-performance/SKILL.md

Last Verified

January 20, 2026

Install Skill

Select agents to install to:

Scope:
npx add-skill https://github.com/geoffjay/claude-plugins/blob/main/plugins/rust-gpui-developer/skills/gpui-performance/SKILL.md -a claude-code --skill gpui-performance

Installation paths:

Claude
.claude/skills/gpui-performance/
Powered by add-skill CLI

Instructions

# GPUI Performance Optimization

## Metadata

This skill provides comprehensive guidance on optimizing GPUI applications for rendering performance, memory efficiency, and overall runtime speed.

## Instructions

### Rendering Optimization

#### Understanding the Render Cycle

```
State Change → cx.notify() → Render → Layout → Paint → Display
```

**Key Points**:
- Only call `cx.notify()` when state actually changes
- Minimize work in `render()` method
- Cache expensive computations
- Reduce element count and nesting

#### Avoiding Unnecessary Renders

```rust
// BAD: Renders on every frame
impl MyComponent {
    fn start_animation(&mut self, cx: &mut ViewContext<Self>) {
        cx.spawn(|this, mut cx| async move {
            loop {
                cx.update(|_, cx| cx.notify()).ok();  // Forces rerender!
                Timer::after(Duration::from_millis(16)).await;
            }
        }).detach();
    }
}

// GOOD: Only render when state changes
impl MyComponent {
    fn update_value(&mut self, new_value: i32, cx: &mut ViewContext<Self>) {
        if self.value != new_value {
            self.value = new_value;
            cx.notify();  // Only notify on actual change
        }
    }
}
```

#### Optimize Subscription Updates

```rust
// BAD: Always rerenders on model change
let _subscription = cx.observe(&model, |_, _, cx| {
    cx.notify();  // Rerenders even if nothing relevant changed
});

// GOOD: Selective updates
let _subscription = cx.observe(&model, |this, model, cx| {
    let data = model.read(cx);

    // Only rerender if relevant field changed
    if data.relevant_field != this.cached_field {
        this.cached_field = data.relevant_field.clone();
        cx.notify();
    }
});
```

#### Memoization Pattern

```rust
use std::cell::RefCell;
use std::collections::hash_map::DefaultHasher;
use std::hash::{Hash, Hasher};

struct MemoizedComponent {
    model: Model<Data>,
    cached_result: RefCell<Option<(u64, String)>>,  // (hash, result)
}

impl Memoi

Validation Details

Front Matter
Required Fields
Valid Name Format
Valid Description
Has Sections
Allowed Tools
Instruction Length:
11649 chars