CtrlK
BlogDocsLog inGet started
Tessl Logo

state-management

Implement state management patterns for frontend applications. Use when managing global state, handling complex data flows, or coordinating state across components. Handles React Context, Redux, Zustand, Recoil, and state management best practices.

Install with Tessl CLI

npx tessl i github:supercent-io/skills-template --skill state-management
What are skills?

83

1.00x

Quality

77%

Does it follow best practices?

Impact

96%

1.00x

Average score across 3 eval scenarios

Optimize this skill with Tessl

npx tessl skill review --optimize ./.agent-skills/state-management/SKILL.md
SKILL.md
Review
Evals

Evaluation results

100%

Persistent Shopping Cart State Layer

Zustand store with middleware

Criteria
Without context
With context

Uses Zustand

100%

100%

devtools middleware

100%

100%

persist middleware

100%

100%

persist name property

100%

100%

Selective subscription

100%

100%

TypeScript interfaces

100%

100%

No direct mutation

100%

100%

Derived values not stored

100%

100%

Descriptive action names

100%

100%

Duplicate item handling

100%

100%

Without context: $0.5209 · 1m 58s · 26 turns · 32 in / 8,920 out tokens

With context: $0.5656 · 1m 41s · 26 turns · 31 in / 6,353 out tokens

100%

2%

Team Task Board — State Layer

Redux Toolkit async state slice

Criteria
Without context
With context

Uses Redux Toolkit

100%

100%

configureStore usage

100%

100%

createAsyncThunk used

100%

100%

extraReducers builder pattern

100%

100%

All three async states

100%

100%

RootState exported

100%

100%

AppDispatch exported

100%

100%

useSelector and useDispatch

100%

100%

Provider wraps app

100%

100%

No direct mutation in reducers

100%

100%

Status field in state

80%

100%

Without context: $0.4613 · 1m 42s · 30 turns · 166 in / 6,237 out tokens

With context: $0.8054 · 1m 38s · 30 turns · 464 in / 7,052 out tokens

90%

User Profile Dashboard

React Query server state + Context API

Criteria
Without context
With context

React Query for server data

100%

100%

queryKey is array

100%

100%

staleTime configured

0%

0%

useMutation for updates

100%

100%

invalidateQueries on success

100%

100%

useQueryClient used

100%

100%

Context API for simple global state

100%

100%

Custom hook with guard

100%

100%

QueryClientProvider wraps app

100%

100%

isLoading and error handled

100%

100%

Without context: $0.6551 · 3m 8s · 29 turns · 35 in / 11,253 out tokens

With context: $0.9155 · 3m 11s · 37 turns · 40 in / 11,573 out tokens

Evaluated
Agent
Claude Code
Model
Claude Sonnet 4.6

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.