visualizing-recomposition-cascades

Diagnose Jetpack Compose recomposition cascades via static cascade walks and live heatmap data.

472|16|Updated Apr 29, 2026

Search Tags:#debugging #stability #visualization #compose #cascade #recomposition #heatmap

Ready to run

npx skills add https://github.com/skydoves/compose-performance-skills --skill visualizing-recomposition-cascades

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: visualizing-recomposition-cascades
Source: https://github.com/skydoves/compose-performance-skills/tree/main/stability/visualizing-recomposition-cascades
Command: npx skills add https://github.com/skydoves/compose-performance-skills --skill visualizing-recomposition-cascades

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps engineers diagnose Jetpack Compose recomposition behavior by combining a static cascade visualization with a live recomposition heatmap in the IDE, making blast radii and runtime activity easier to inspect.

Core Features & Use Cases

Visualize the static cascade from a root composable to identify potential recompositions.
Monitor live recomposition counts via inlays in the editor heatmap tab.
Validate refactors by aligning static predictions with runtime data.

Quick Start

Select a composable, run Analyze Recomposition Cascade, then enable the Recomposition Heatmap to observe live data.

Frequently Asked Questions about visualizing-recomposition-cascades

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

FAQPage Schema

How do I visualize Jetpack Compose recomposition cascades in the IDE?▼

To visualize Jetpack Compose recomposition cascades, select a composable root and run the Analyze Recomposition Cascade workflow to inspect the resulting tree of potential recompositions directly in the IDE.

What causes a recomposition cascade in Jetpack Compose?▼

A recomposition cascade occurs when a state change in a root composable triggers subsequent recompositions in child composables. Static cascade walks visualize this blast radius by mapping the dependency tree.

Do I need the Compose stability analyzer plugin to inspect recomposition heatmaps?▼

Yes, inspecting recomposition heatmaps requires the Compose stability analyzer plugin installed. The heatmap workflow uses live logcat data to monitor runtime recomposition counts via editor inlays.

How do I validate Jetpack Compose refactors to ensure they reduce recompositions?▼

Validate Compose refactors by aligning static cascade predictions with runtime heatmap data. Run sensitivity tests to confirm that your changes successfully reduce the recomposition blast radius.

Can I correlate static recomposition predictions with live runtime logcat data?▼

Yes, you can correlate static recomposition predictions with live runtime logcat data by using the Cascade and Heatmap workflows together, confirming blast radius findings directly in the IDE.

What is the best way to triage Jetpack Compose recomposition blast radii?▼

The best way to triage recomposition blast radii is performing a static cascade walk from a root composable to inspect the tree, then validating findings with live heatmap data.