Apply urgent optimistic state and schedule reconciliation.
Section: Network and Server Recipes
Optimistic UI with transition
tsx
tsx
const [isPending, startTransition] = useTransition();
function handleAdd(todo: Todo) {
setTodos(prev => [...prev, todo]);
startTransition(async () => {
await saveTodo(todo);
refreshTodos();
});
}Explanation
Transitions can keep follow-up updates non-blocking while the immediate optimistic UI stays responsive.
Learn the surrounding workflow
Compare similar commands or jump into common fixes when this command is part of a bigger troubleshooting path.
Related commands
Same sheet · prioritizing Network and Server Recipes
Focus an input on mount
Use a ref and an effect to focus an input after mount.
Mirror a prop into state only when necessary
Initialize from props, then manage locally.