3 ways to store variables in React

3 ways to store variables in React, and why you shouldn't sleep on useRef
4 minutes by Rachel Kaufman

React offers three ways to store variables. Plain variables reset on every render and work best for temporary calculations. State persists across renders and updates the UI when changed. Refs persist across renders but do not trigger UI updates, making them useful for data you want to track without affecting what users see, like timers or buffered data streams.

Webinar: AI Observability - How to Trace and Debug AI Systems With Confidence
sponsored by Progress Telerik

AI agents require a different observability model than traditional APM. Claim your free spot to get a clear, engineering-first approach to AI observability and start debugging AI systems with confidence.

Async React: Building non-blocking UIs with useTransition and useActionState
10 minutes by Deepanshu RanaShare

React 19 introduces new tools to handle async operations more cleanly. useTransition hook now tracks pending states for the full duration of an async task, keeping the UI responsive without manual loading flags. useActionState hook goes further by bundling state, errors, and pending status into one place, and it guarantees that rapid actions run in order rather than causing race conditions. Together, they replace messy manual state tracking with simpler, more reliable patterns.

React Flow tips that actually matter in production
6 minutes by Roman Fedytskyi

React Flow is easy to start with but gets messy fast once diagrams become core product features. Keep nodes simple and stateless, move editing to a sidebar, and validate connections early to prevent broken states. Treat the diagram as system state, not just UI, and add persistence and logging from the start. Small structural decisions made early determine whether the tool stays maintainable as complexity grows.

Build your own shimmer skeleton that never goes out of sync
14 minutes by Neciu Dan

Skeleton screens show placeholder shapes while content loads, which feels better than a blank page. Most teams build separate skeleton components that must be manually kept in sync with the real ones, which becomes a maintenance problem. Neciu suggests a smarter approach renders the real component with fake data, measures where each element sits using the browser's own layout engine, then draws shimmer blocks exactly on top. The skeleton stays accurate automatically because it comes from the actual component, not a hand-built copy.

How React streams UI out of order and still manages to keep order
7 minutes by Sankalpa Acharya

React streams UI by sending placeholder markers for slow components right away, then swapping them with real content once the data resolves. Fast components like a navbar appear instantly while slow ones show a loading state. This is done through hidden divs, template elements, and small script tags that trigger DOM swaps. Wrapping components in Suspense boundaries is all you need to enable this behavior.

webdev

• The Prompt API
• The end of responsive images
• Scroll-Driven Animations
• Six levels of dark mode
• Making your site visible to LLMs

And the most popular article from the last issue was:

• React compiler at eighteen months