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

performance & transitions

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

Offscreen API deprioritizes hidden content

Offscreen is a low-level capability that allows hiding UI visually while deprioritizing its content rendering. When content is hidden, React can defer rendering work until the app is idle or until content becomes visible again. This is similar to the CSS content-visibility property. Offscreen unlocks high-level features like instant transitions, reusable state across route/tab navigation, virtualized list rendering, and backgrounded content deprioritization.

Transition Tracing API replaces Interaction Tracing API

A new Transition Tracing API (initiated via startTransition) is being developed to track specific interactions like button clicks, initial loads, or page navigation. It solves fundamental design flaws in the previous Interaction Tracing API that reduced accuracy in tracking why interactions were slow and sometimes resulted in interactions never ending.

Offscreen rendering use cases

Offscreen rendering enables several use cases: routers can prerender screens in background for instant availability on navigation, tab switching components can preserve state of hidden tabs, virtualized list components can prerender rows above and below the visible window, and modals can put the rest of the app into background mode to disable events and updates for non-modal content.

Offscreen rendering mounting behavior

When a component is rendered offscreen, it does not actually mount until it becomes visible, and its effects are not fired. When toggling visibility of a component offscreen, the component state is preserved. When a component goes offscreen, its effects are unmounted.

Offscreen rendering with Suspense

Suspending inside an offscreen tree does not trigger Suspense fallbacks.

Offscreen rendering integration approach

Offscreen rendering is integrated into routers and UI libraries, and developers who use those libraries benefit automatically without additional work. Most React developers will not interact with offscreen APIs directly. The idea is to render any React tree offscreen without changing component authoring.

Transition Tracing API purpose

The Transition Tracing API lets you detect when React Transitions become slower and investigate why they may be slow. It will be particularly useful with routers built on top of React Transitions.

Transition Tracing API status

The Transition Tracing API initial design is complete and an RFC has been published. Basic capabilities have been implemented. The project is currently on hold pending community feedback.

Actions are submitted within a transition by default

By default, Actions are submitted within a transition, keeping the current page interactive while the action is processing. Since Actions support async functions, async/await can be used in transitions to show pending UI with the isPending state when an async request starts and all the way through the update being applied.

Offscreen renamed to Activity based on research findings

Since the previous update, the capability initially called 'Offscreen' has been renamed to 'Activity'. The name 'Offscreen' implied it only applied to parts of the app that were not visible, but research showed that parts of the app can be visible and inactive, such as content behind a modal. The new name more closely reflects marking certain parts of the app as 'active' or 'inactive'.

Activity feature is still under research with deprioritized work

Activity (formerly Offscreen) is still under research with remaining work to finalize the primitives exposed to library developers. This area has been deprioritized while focusing on shipping more complete features.

Give your agent this brain