Track
React
Review component boundaries, state, effects, and rendering decisions.
- 01
Props component boundaries
Keep presentational components focused by passing the data they need explicitly.
componentspropsboundaries - 02
Stable keys in lists
Use stable item identities as keys so React can preserve the right state.
listskeysidentity - 03
Derived state
Compute values from current props and state instead of syncing duplicates.
staterenderingeffects - 04
Updating state from previous state
Use functional state updates when the next value depends on the current value.
stateeventsupdates - 05
Controlled form inputs
Keep form values in React state when the UI needs validation, reset, or submit logic.
formsstateevents - 06
Effect dependencies
List every effect dependency and clean up async work when inputs change.
effectsasyncstate - 07
Async effect cleanup
Guard async effects so stale responses cannot update the current screen.
effectsasynccleanup - 08
Context boundaries
Use context for shared ambient data, not as a shortcut around component boundaries.
contextcomponentsstate - 09
Memoization when it helps
Use memoization for repeated expensive work with correct dependencies, not as decoration.
memoizationperformancerendering - 10
Composition over prop flags
Prefer flexible component slots over growing boolean prop combinations.
compositioncomponentsprops