I’ve been a software engineer for 10 years. For a long time, I viewed "application state" as just a collection of variables and logic. I was effective, but I felt like I was missing the underlying structure of why state becomes messy.
Recently, I started studying linear algebra (Axler’s "Linear Algebra Done Right"). It opened a "third eye" for me. I realized that redundant state in a React app is essentially "linear dependence." If two or more state variables always update in perfect sync, they aren't adding new information-they are just redundant dimensions in your application's state space.
I spent my holiday break building react-state-basis. It’s a real-time architectural auditor that monitors your state transitions as vectors to find these redundancies.
What the tool does:
Redundancy Detection: It identifies state variables that move in perfect synchronization (collinear) and suggests refactoring them into a single source of truth or a derived value (useMemo).
Causality Tracking: It traces useEffect chains to find "Double Render Cycles" where one state update unnecessarily triggers another.
Infinite Loop Protection: It includes a "Circuit Breaker" that detects high-speed oscillations and halts execution before the browser thread locks up.
System Health Score: It analyzes your entire state architecture to give you an efficiency score based on how many variables are actually independent.
I built a Babel plugin to handle automatic labeling, so you don't have to manually name your states. It’s designed as a development-time tool—you can easily swap back to standard React imports for your production build.
I’m a solo dev and this is my first open-source project. I’d love to hear what you think about this approach to state auditing.
Hi HN,
I’ve been a software engineer for 10 years. For a long time, I viewed "application state" as just a collection of variables and logic. I was effective, but I felt like I was missing the underlying structure of why state becomes messy.
Recently, I started studying linear algebra (Axler’s "Linear Algebra Done Right"). It opened a "third eye" for me. I realized that redundant state in a React app is essentially "linear dependence." If two or more state variables always update in perfect sync, they aren't adding new information-they are just redundant dimensions in your application's state space.
I spent my holiday break building react-state-basis. It’s a real-time architectural auditor that monitors your state transitions as vectors to find these redundancies.
What the tool does:
Redundancy Detection: It identifies state variables that move in perfect synchronization (collinear) and suggests refactoring them into a single source of truth or a derived value (useMemo).
Causality Tracking: It traces useEffect chains to find "Double Render Cycles" where one state update unnecessarily triggers another.
Infinite Loop Protection: It includes a "Circuit Breaker" that detects high-speed oscillations and halts execution before the browser thread locks up.
System Health Score: It analyzes your entire state architecture to give you an efficiency score based on how many variables are actually independent.
I built a Babel plugin to handle automatic labeling, so you don't have to manually name your states. It’s designed as a development-time tool—you can easily swap back to standard React imports for your production build.
I’m a solo dev and this is my first open-source project. I’d love to hear what you think about this approach to state auditing.
https://github.com/liovic/react-state-basis