Home

5 Layers of State Management in React Applications

edit ✏️

One of the challenges with state management in React is coming to terms and deciding as a team how you will categorize the layers of state in your application. It's variable and often nuanced to describe the layers but framing them in a simple hierarchy is an excellent tool for communicating with your team.

a stack of blocks labeled components, application, remote, router, and meta

One way to frame these layers of states is using the 5 Layers of State that Jed Watson proposed in his excellent talk A Treatise on State.

State management is about coordination and communication and each layer of state relies on mutual agreement at both the code and often more importantly human to human level. Most applications start with local component state and layer on the rest as needed. Research, documentation, and experience will help guide decisions as complexity increases with the needs of the application.

There are no silver bullets.