new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

React · API reference · all subjects

hooks: advanced patterns

3 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

useDeferredValue differs from debouncing and throttling

useDeferredValue is better suited to optimizing rendering than debouncing or throttling because it is deeply integrated with React and adapts to the user's device. Unlike debouncing or throttling, it doesn't require choosing a fixed delay. If the device is fast, the deferred re-render happens almost immediately. If the device is slow, the list lags proportionally. Deferred re-renders are interruptible by default, so a keystroke can abandon a re-render in progress. By contrast, debouncing and throttling are blocking and postpone when rendering blocks keystrokes. Debouncing and throttling are still useful for work that doesn't happen during rendering, such as firing fewer network requests.

How useDeferredValue background re-rendering works

useDeferredValue operates in two steps: First, React re-renders with the new value but with the old deferredValue still holding its previous value, so deferredValue 'lags behind'. Second, in the background, React tries to re-render with both the value and deferredValue updated to the new value. If this re-render completes, React shows it on screen. If it suspends, React abandons the rendering attempt and retries after data loads. The user keeps seeing the stale deferred value until data is ready. The deferred background rendering is interruptible: if another keystroke occurs, React abandons it and restarts with the new value.

useOptimistic hook for optimistic state updates

useOptimistic is a hook for managing optimistic state updates. With this hook, you can apply temporary updates that are automatically reverted once the final state commits. For Actions, this allows you to optimistically set the final state of data on the client assuming successful submission, and revert to the value from the server. It works with regular async/await, whether using fetch on the client or a Server Action from the server.

Give your agent this brain