What Developers Are Saying About React 19: Pros and Cons

React 19 shipped. I've used it. I've talked to other developers about it. Here's what actually matters.

What changed

• Concurrent rendering improvements — better handling of large component trees without blocking the main thread.
• Server Components — render on the server, hydrate on the client. Less JavaScript shipped to the browser.
• Stricter Strict Mode — catches more bugs during development.
• Automatic batching — state updates inside timeouts, promises, and native event handlers are now batched by default.

The good

Performance gains are real. Concurrent rendering makes complex UIs feel snappier. Lazy loading with Suspense works better out of the box:

import React, { useState, Suspense } from 'react';

const LazyComponent = React.lazy(() => import('./LazyComponent'));

export default function App() {
    const [count, setCount] = useState(0);
    return (
        <div>
            <h1>Concurrent Rendering Example</h1>
            <button onClick={() => setCount(count + 1)}>Increment</button>
            <Suspense fallback={<div>Loading...</div>}>
                <LazyComponent count={count} />
            </Suspense>
        </div>
    );
}

Server Components reduce client bundle size. Heavy data-fetching logic stays on the server. The client only gets what it needs to render:

import { renderToPipeableStream } from 'react-dom/server';
import App from './App';

export default function handler(req, res) {
    const { pipe } = renderToPipeableStream(<App />, {
        onCompleteShell() {
            res.statusCode = 200;
            res.setHeader('Content-Type', 'text/html');
            pipe(res);
        },
    });
}

Better dev tooling. The enhanced Strict Mode catches issues earlier. Less time debugging in production.

The bad

Steeper learning curve. Server Components and concurrent rendering require understanding React's internals more deeply. If your team just got comfortable with hooks, this is another jump.

Library compatibility. Not every library supports React 19's new patterns yet. I've hit issues with older component libraries that assume synchronous rendering.

Automatic batching has surprises. State updates are batched more aggressively. If you depend on reading state immediately after setting it, the behavior might not match what you expect:

import React, { useState } from 'react';

export default function Counter() {
    const [count, setCount] = useState(0);
    const [flag, setFlag] = useState(false);

    function handleClick() {
        setCount((prev) => prev + 1);
        setFlag((prev) => !prev);
        // both updates are batched — you won't see intermediate renders
    }

    return (
        <div>
            <p>Count: {count}</p>
            <button onClick={handleClick}>Update</button>
        </div>
    );
}

Should you upgrade?

Yes, if you're starting a new project or your current one needs better performance at scale.

Wait, if your project relies on libraries that haven't updated yet, or your team doesn't have bandwidth to learn the new mental models.

React 19 is a solid release. But "new" doesn't mean "upgrade immediately." Evaluate your specific constraints first.