When to Use Stores vs Local State
Choose between component state and stores based on sharing and lifetime needs.
When to Use Stores vs Local State is a free Sveltejs Academy lesson on CoddyKit — lesson 3 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Sveltejs Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.
Local State
Use let in a component when the data belongs only to that component.
Component Props
Use export let for inputs from a parent. The parent owns the state.
Stores
Use stores when multiple unrelated components need to share or react to the same data.
Examples for Stores
Current user, theme, cart contents, notifications — anything global.
Examples for Local
Form inputs, toggles, hover state, animation timers — confined to one component.
Context API
For data shared down a subtree but not globally, use setContext/getContext.
Avoid Premature Stores
Start with local state; promote to a store when sharing requirements grow.
Testability
Local state is easiest to test. Stores need mocking or wrapping.
Persistence
Wrap stores in localStorage sync for persisted state.
Refactoring
Moving from local to store is a small refactor: replace let with the store, swap x for $x.
Anti-Pattern: Everything in Stores
Putting all state in stores creates implicit coupling. Prefer local until necessary.
Quick Check
When is a store the right choice?
Recap
Default to local let; promote to stores or context when sharing needs grow.
Frequently asked questions
Is the “When to Use Stores vs Local State” lesson free?
Yes — the full text of “When to Use Stores vs Local State” is free to read here on the web, and the Sveltejs Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Sveltejs Academy course, upgrade to CoddyKit PRO.
What will I learn in “When to Use Stores vs Local State”?
Choose between component state and stores based on sharing and lifetime needs. You practise Sveltejs Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start Sveltejs Academy?
No prior experience is required. Sveltejs Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 3 of 4, so you can start here or from the beginning and move at your own pace.
How long does the “When to Use Stores vs Local State” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this Sveltejs Academy lesson?
Yes. Every Sveltejs Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.
All lessons in this course
- Reactive Statements: $: block
- Reactive Dependencies and Ordering
- When to Use Stores vs Local State
- Avoiding Stale Closures