perf

Profile and fix performance bottlenecks in the Puree engine.

20|2|Updated Oct 5, 2025

Search Tags:#performance #debugging #layout #optimization #profiling #engine #render

Ready to run

npx skills add https://github.com/nicolaiprodromov/puree --skill perf-nicolaiprodromov

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: perf
Source: https://github.com/nicolaiprodromov/puree/tree/main/.agents/skills/perf
Command: npx skills add https://github.com/nicolaiprodromov/puree --skill perf-nicolaiprodromov

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill profiles and optimizes the Puree engine's performance, focusing on reducing render bottlenecks, improving frame timing, and streamlining layout and resource handling across the pipeline.

Core Features & Use Cases

Identify bottlenecks across phases such as SCSS compilation, YAML parsing, CSS cascade, layout with Stretchable, script execution, buffer packing, GPU upload, compute shaders, and text rendering.
Measure, analyze, and guide targeted optimizations to improve frame rates and responsiveness in complex UI layouts.
Real-world scenario: diagnose why a scene with many containers causes frame drops and implement changes to stabilize frame timings.

Quick Start

Run the perf skill to profile and fix performance bottlenecks in the Puree engine.

Frequently Asked Questions about perf

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I profile and fix rendering bottlenecks in the Puree engine?▼

To profile rendering bottlenecks in the Puree engine, you measure frame timings and identify slowdowns across the pipeline, including SCSS compilation, CSS cascade, layout, and GPU upload. This skill provides structured measurement guidance to diagnose and fix these performance issues.

Why does my UI layout cause frame drops during rendering?▼

UI layout frame drops during rendering often stem from bottlenecks in layout processing, script execution, or buffer packing. Profiling frame timings helps identify the specific phase causing the drop, allowing you to apply targeted optimizations to stabilize responsiveness.

What is the best way to optimize text rendering and shader performance?▼

Optimizing text rendering and shader performance involves measuring frame timings to pinpoint compute shader and text rendering bottlenecks. You can then apply structured optimizations within a reproducible workflow to streamline resource handling and improve frame rates.

Can I use this skill to diagnose YAML parsing and SCSS compilation slowdowns?▼

Yes, you can diagnose YAML parsing and SCSS compilation slowdowns. The skill identifies bottlenecks across these specific phases, measuring their impact on overall frame timing to guide targeted optimizations within the engine pipeline.

How do I measure frame timings to identify resource packing bottlenecks?▼

You measure frame timings by following a structured profiling workflow that isolates resource packing and GPU upload phases. This measurement process identifies the exact bottlenecks causing frame instability, enabling you to implement reproducible optimizations.