# Visualizing Recomposition Cascades

Use this skill to drive the active investigation features of the...

- Repository: https://github.com/skydoves/compose-performance-skills (524 stars)
- Category: Mobile
- License: Apache-2.0
- Last updated: 2026-06-16
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add skydoves/compose-performance-skills --skill visualizing-recomposition-cascades -g -a claude-code -y`
Codex: `npx skills add skydoves/compose-performance-skills --skill visualizing-recomposition-cascades -g -a codex -y`
Cursor: `npx skills add skydoves/compose-performance-skills --skill visualizing-recomposition-cascades -g -a cursor -y`
Gemini CLI: `npx skills add skydoves/compose-performance-skills --skill visualizing-recomposition-cascades -g -a gemini-cli -y`

## Description

Use this skill to drive the active investigation features of the `skydoves/compose-stability-analyzer` IntelliJ / Android Studio plugin: the static Recomposition Cascade visualizer that walks the call graph from a root `@Composable`, and the live Recomposition Heatmap that streams `D/Recomposition` events from a connected device''s logcat into block inlays above each instrumented composable. Covers the `Compose Stability Analyzer` tool window''s three tabs (Explorer, Cascade, Heatmap), the cascade analyzer''s static PSI walk with depth cap and cycle detection, the ADB logcat command the heatmap consumes, and the toggle/clear actions. Use when the user asks "what gets dragged in if I change this composable", "how many times did this recompose during that scroll", "what is the blast radius of this state change", or mentions the cascade tab, the heatmap tab, the recomposition inlays, or `Toggle Recomposition Heatmap`.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Visualizing Recomposition Cascades, static blast radius and live heatmap inside the IDE

Passive gutter icons answer "is this composable skippable" (covered by `../using-stability-analyzer-ide-plugin/SKILL.md`). The active investigation tools answer two harder questions. The Cascade visualizer walks the static call graph from a root `@Composable` and shows what else might recompose if the root recomposes. The Live Heatmap subscribes to the device's logcat and renders the actual recomposition counts as block inlays above each instrumented composable in the editor. Together they close the loop between static analysis and runtime evidence.

Both features live inside the same IntelliJ plugin and surface through the right-anchored **Compose Stability Analyzer** tool window, which has three tabs: **Explorer**, **Cascade**, and **Heatmap**.

## When to use this skill

- The developer asks "what gets dragged in if I change this composable", use the Cascade tab.
- The developer asks "how many times did this recompose during that scroll" or "which composable is hot during this animation", use the Heatmap tab.
- Triaging a recomposition spike surfaced by `../../recomposition/debugging-recompositions/SKILL.md` and needing the call-site context.
- Preparing a refactor and wanting the blast radius before touching a shared composable.
- The user mentions the Cascade tab, the Heatmap tab, recomposition inlays, **Analyze Recomposition Cascade**, **Toggle Recomposition Heatmap**, or **Clear Recomposition Data**.

## When NOT to use this skill

The rest: https://github.com/skydoves/compose-performance-skills/blob/HEAD/stability/visualizing-recomposition-cascades/SKILL.md