10 lessons I've learned about handling React state over the last 7 years...
(thread)
#react #reactjs
#1: Know the 8 ways to handle state, and when to consider each.
#2: Class components are dead to me.
#3: “Normalize” state by deriving on render.
#4: Understand when React renders, and how to avoid it.
#5: Most state is remote state. Streamline remote state via a custom "useApi" hook, react-query, or swr.
The result? WAY less code.
react-query/swr add:
✅Caching
✅Invalidates & refetches stale data
✅Dedupes requests
✅Auto retries
✅Refetch on refocus/reconnect
#6: Start local, then lift. Global is a last resort. Prop drilling is no biggie.
#7: Wrap each context in a single file.
✅Streamlines call sites
✅Provides useful error if context is consumed without the provider in a parent.
#8: You don’t need LoDash, Underscore, Ramda. Embrace immutable JS features.
#9: You don’t need a form library. You need a pattern.
#10: State Enums are 🔥. With simple state enums, you likely don’t need XState and state charts (though they are nice).
Was this useful? This is a little taste of all the React state tips I cover in "Managing React State" on @pluralsight.
Free trial: pluralsight.com/pricing/free-t…
Full course: app.pluralsight.com/library/course…
Share this Scrolly Tale with your friends.
A Scrolly Tale is a new way to read Twitter threads with a more visually immersive experience.
Discover more beautiful Scrolly Tales like this.