---
title: SolidJS Best Practices
type: agent/instruction
tags: [solidjs, reactivity]
---

{{h1}}SolidJS

{{h2}}Reactivity
- Signals are getters: `count()` not `count`
- Memos cache derived values
- Effects for side effects only
- Reactivity tracks within scopes

{{h2}}Components
- Run once, not reactive
- Return JSX directly
- Use `splitProps` for prop separation
- Props are reactive, destructure carefully

{{h2}}Control Flow
- `<Show>` over `&&`
- `<For>` over `.map()`
- `<Switch>/<Match>` for conditions
- `<Index>` for primitive items

{{h2}}Stores
- `createStore` for nested objects
- Property-level tracking
- `produce` for immutable updates

{{h2}}Patterns
- `createResource` for async data
- `createMemo` for expensive computations
- `on` helper for explicit dependencies

{{h2}}Avoid
- Don't destructure props at top level
- Don't wrap JSX in functions
- Don't use effects for derived state
