reactlisted

# React 19 ## Where state belongs Most re-render problems are placement problems, and no amount of memoization fixes one. - **Push state down.** State used by one subtree lives in that subtree. A dialog's open flag hoisted to the page re-renders the page on every toggle. - **Lift only to the closest common ancestor** of the components that actually read it — not to the nearest context, and not to a store. - **Server data is not state.** It lives in the query cache. Copying `data` into `useState` gives you two sources of truth that drift; see the `tanstack-query` skill. - **URL state is not state either.** Filters, tabs, pagination and the open entity belong in the query string when the user would expect back, refresh and a shared link to work. - **Anything computable from props or existing state is not state.** Compute it in render. - **Group state that always changes together** into one object or a reducer; split state that changes independently. Two flags updated in the same handler are one piece of state. - A `useState` whose value never triggers a render — an id, a timer handle, the previous value — is a `ref`, not state. ## Effects An effect synchronizes with something outside React. That is the whole list. - **Derived state is computed in render**, not stored in state and synced by an effect. - **Event-driven side effects go in the handler.** If it happens because the user clicked, it does not belong in an effect. - An effect that only sets state from props is alw