solidjs-reactivity

SolidJS reactivity relies on signals, memos, and effects where components run once and updates are fine-grained. Unlike React, components do not re-run on state changes; instead, reactive primitives automatically update only the specific DOM nodes that depend on the changed state.

Prop destructuring breaks SolidJS reactivity by losing the tracking context. When you destructure props, you evaluate the reactive signal immediately, separating it from the fine-grained update mechanism and preventing automatic DOM updates when the underlying value changes.

To handle async operations in SolidJS without breaking tracking scope, you must access signals and props before entering the asynchronous callback. Reading reactive state inside an async function after an await breaks the tracking context and prevents effects from subscribing to changes.

The best way to handle conditional logic outside JSX in SolidJS is using memos or reactive expressions. Because components only execute once, wrapping conditional state in a memo ensures the logic re-evaluates automatically when dependencies change, maintaining fine-grained reactivity.

You should use memos instead of signals in SolidJS when you need to compute derived state. Memos cache the result of a reactive expression and only recalculate when their dependencies change, preventing redundant computations and ensuring efficient fine-grained updates.