Last Updated: November 21, 2025
SolidJS
Fast reactive JavaScript framework
Core Concepts
| Item | Description |
|---|---|
Signal
|
Reactive primitive for state |
Effect
|
Side effect that tracks dependencies |
Memo
|
Cached computed value |
Store
|
Nested reactive data structure |
JSX
|
Template syntax (like React) |
Fine-grained
|
Only updates what changes |
Reactive Primitives
| Item | Description |
|---|---|
createSignal()
|
Create reactive state |
createEffect()
|
Run side effects |
createMemo()
|
Create computed value |
createResource()
|
Async data fetching |
createStore()
|
Nested reactive object |
Component Example
import { createSignal, createEffect } from "solid-js";
function Counter() {
const [count, setCount] = createSignal(0);
createEffect(() => {
console.log("Count:", count());
});
return (
<div>
<p>Count: {count()}</p>
<button onClick={() => setCount(count() + 1)}>
Increment
</button>
</div>
);
}Best Practices
- Use signals for reactive state
- Effects automatically track dependencies
- No virtual DOM - direct DOM updates
- Use createMemo for expensive computations
💡 Pro Tips
Quick Reference
SolidJS is faster than React due to no virtual DOM