team-gryff/react-monocle

Health v2 · maintenance only

Flags: no_releases archived

Adoption not part of the score

2437 stars · 74 forks observed · 2026-08-28

What it is AI-extracted, prompt v1, taxonomy v1, 2026-08-30, confidence not recorded

React Monocle is a CLI developer tool that parses React source files and generates a visual tree graph of the app's component hierarchy, displayed alongside a live copy of the application. It injects wrappers around setState calls in an un-minified bundle to show real-time state changes and data flow, with Redux syncing the tree to component state.

Use cases

• visualize my react app's component hierarchy
• see how state flows through react components in real time
• generate a component tree diagram from react source files
• debug react state changes with a visual tree
• understand a large react codebase's structure
• view redux state changes reflected in a component graph

When to choose

• you work on a React (with Redux) app and want a visual map of components and state flow
• you have access to an un-minified bundle file and can run a CLI tool
• you're exploring or onboarding onto an unfamiliar React codebase

When to avoid

• your bundle is minified/mangled, since the tool requires un-minified bundles
• you use a modern React stack without Redux or with hooks-era patterns the 2017-era tool doesn't support
• you need an actively maintained tool - the last release was in 2017
• you prefer a browser DevTools extension over a CLI-launched visualization

Facets

cli-tool · maturity abandoned

developer-tools data-visualization parser frontend web-development developer-tools data-visualization cli cross-platform react component-hierarchy redux ast-parsing d3 state-visualization nodejs

Member repositories

For agents

markdown · JSON · MCP: product_card(name="team-gryff/react-monocle")