React 19.3 проти React 18: що реально змінилось для продуктової команди

React 19.3 вийшов 9 вересня 2026. Більшість релізних постів читаються як список фіч; я читаю їх як список коду, який можна видалити. Якщо порівнювати з React 18 - на ньому досі сидить багато продакшен-застосунків - лінійка 19 не стільки про новий синтаксис, скільки про те, щоб прибрати обхідні шляхи, які кожна команда писала сама: стейт-машини форм, обгортки forwardRef, memo всюди й перевірки typeof window.

React 19.0 заклав основу. Actions і useActionState замінили саморобну трійку isPending / error / data на кожній формі. useOptimistic зробив оптимістичний UI хуком, а не редюсером. use() читає проміс або контекст прямо в рендері, навіть умовно. ref став звичайним пропом, тож forwardRef - легасі; <Context> сам працює як провайдер; <title> і <meta> піднімаються в head з будь-якого компонента. Ціна теж була реальна: string refs, legacy context, ReactDOM.render і propTypes у функціональних компонентах прибрали, тож застосунок на 18 зі старими залежностями потребує справжнього апгрейду, а не зміни версії.

React 19.2 і React Compiler 1.0 змінили відчуття від застосунку. <Activity mode="hidden"> тримає вкладку чи наступну сторінку змонтованою зі станом, поки її ефекти на паузі - те, що ми раніше імітували через display: none і надію. useEffectEvent завершує війну з правилом exhaustive-deps: ефект реагує на roomId, а колбек просто читає останню theme. Partial pre-rendering (prerender, потім resume) дає віддати статичний shell з CDN, поки динамічна частина догружається стрімом. А Compiler зробив більшість ручних useMemo, useCallback і React.memo непотрібними - лишаю їх там, де бібліотеці потрібна референсна ідентичність, але це вже не рефлекс.

React 19.3 - про рух і краї DOM. <ViewTransition> тепер стабільний: обгортаєте елемент, позначаєте оновлення через startTransition, і браузер анімує появу, зникнення та спільні елементи; addTransitionType дає «next» і «previous» їхати в різні боки від одного й того ж оновлення стану. Fragment refs дають focus(), observeUsing() для IntersectionObserver і вимірювання для групи сусідніх елементів без зайвого div-обгортки. use(browser()) з react-dom замінює перевірку typeof window !== "undefined": компонент суспендиться на сервері, показує fallback від Suspense і рендериться на клієнті після гідрації. Server Components можуть рендерити <Context value> напряму, без окремого файлу-провайдера з «use client», а react-dom тепер пропускає об’єкти Trusted Types без приведення до рядка, тож суворий CSP з require-trusted-types-for працює з React.

Якщо поставити поруч, різниця видна в імпортах. У 18 форма зі станом очікування, оптимістичним оновленням і анімованим списком - це три бібліотеки й кастомний хук; у 19.3 це useActionState, useOptimistic і <ViewTransition>, усе з самого react. У 18 «рендерити лише на клієнті» означало прапорець mounted і стрибок верстки; тепер це один рядок і межа Suspense. У 18 продуктивність - це дисципліна memo; тепер це Compiler плюс React Performance Tracks у Chrome DevTools, щоб побачити, що реально заблокувало кадр.

Чого я б не робив - стрибати з 18 на 19.3 одним пул-реквестом на продукті, де ходять гроші. Мій шлях навмисно нудний: спершу 18.3, щоб побачити попередження про застаріле, потім 19 з офіційними codemod-ами, потім Compiler на одному роуті за прапорцем, і лише потім нові API - там, де вони видаляють код. Сам 19.3 адитивний - у релізному пості немає breaking changes - але безпекові advisory по Server Components з грудня 2025 нагадують, що патч-версії важать не менше за мажорні. Якщо ваш застосунок досі на 18 - надішліть package.json і три екрани, які для вас найважливіші. Відповім порядком апгрейду і списком коду, який він дозволить видалити.