React Native 0.83: What’s New with React 19.2, DevTools, and More
<p>React Native 0.83 has arrived, bringing exciting updates for mobile developers. This release integrates React 19.2, introduces new DevTools features, and adds support for Web Performance APIs and Intersection Observer (Canary). Notably, it's the first React Native release without any breaking changes for users. Dive into our Q&A to explore the key highlights and how they can enhance your development workflow.</p>
<h2 id="what-are-the-key-highlights">What are the key highlights of React Native 0.83?</h2>
<p>React Native 0.83 is packed with improvements across three main areas: a core React upgrade, enhanced debugging tools, and new API support. It includes <strong>React 19.2</strong>, which brings the <code><Activity></code> component and the <code>useEffectEvent</code> hook. For debugging, <strong>React Native DevTools</strong> now feature <em>Network inspection</em> and <em>Performance tracing</em> panels, allowing you to monitor requests and profile app performance directly. Additionally, the <strong>Web Performance APIs</strong> are now stable, and <strong>Intersection Observer</strong> is available as a Canary feature. A standout aspect is that this release introduces zero user-facing breaking changes, making it easier to upgrade. For more details, check the sections on <a href="#react-19-2-features">React 19.2 features</a> and <a href="#new-devtools-features">DevTools features</a>.</p><figure style="margin:20px 0"><img src="https://picsum.photos/seed/834536734/800/450" alt="React Native 0.83: What’s New with React 19.2, DevTools, and More" style="width:100%;height:auto;border-radius:8px" loading="lazy"><figcaption style="font-size:12px;color:#666;margin-top:5px"></figcaption></figure>
<h2 id="react-19-2-features">What new APIs does React 19.2 bring to React Native?</h2>
<p>React 19.2 introduces two powerful APIs: <code><Activity></code> and <code>useEffectEvent</code>. The <code><Activity></code> component lets you split your UI into <strong>activities</strong> with controlled rendering priorities—supporting modes like <em>'visible'</em> and <em>'hidden'</em>. Hidden trees preserve state and defer updates, improving performance. The <code>useEffectEvent</code> hook solves a common pain point in <code>useEffect</code>: notifying external systems without causing the effect to re-run on every dependency change. It separates event logic from effect logic, keeping dependencies accurate and avoiding stale closures. Both APIs are documented in the React docs and are ready for production use. For more on <code><Activity></code>, see <a href="#activity-component">the dedicated section</a>.</p>
<h2 id="cve-2025-55182">Is React Native affected by the recent React Server Components vulnerability (CVE-2025-55182)?</h2>
<p><strong>No, React Native itself is not directly impacted</strong> by CVE-2025-55182. This security flaw affects React Server Components packages like <code>react-server-dom-webpack</code>, <code>react-server-dom-parcel</code>, and <code>react-server-dom-turbopack</code>—none of which are used in React Native. However, if you manage a monorepo that includes these packages (for example, a project with both web and mobile apps), you should upgrade them immediately. The React Native team plans to update the dependency to React 19.2.1 in the next patch release (0.83.1) for extra safety. Always verify your dependency tree to ensure no vulnerable packages are present.</p>
<h2 id="activity-component">How does the new <code><Activity></code> component work?</h2>
<p>The <code><Activity></code> component enables you to define parts of your app as <strong>activities</strong> that can be hidden or shown while preserving their state. It supports two modes: <em>'visible'</em> (normal rendering) and <em>'hidden'</em>. When set to hidden, React unmounts effects and defers all updates until the main thread is idle—but the component's state (like scroll position or input values) is preserved. This makes it ideal for tab switching, modals, or off-screen content. For example, a search results list hidden with <code><Activity mode='hidden'></code> will retain its selection and scroll position when re-shown. It's a cleaner alternative to conditional rendering with <code>display: none</code> or manual state management.</p>
<h2 id="useeffectevent">What problem does <code>useEffectEvent</code> solve?</h2>
<p>A typical <code>useEffect</code> pattern involves notifying some external system (e.g., analytics, logging) about events that occur during rendering. Developers often add these event callbacks as dependencies, causing the effect to re-run unnecessarily when the event logic changes. Alternatively, they disable lint rules and omit dependencies, risking stale closures. <code>useEffectEvent</code> solves this by letting you extract the <strong>event part</strong> of the effect into a separate function that doesn't need to be listed as a dependency. The effect itself stays clean, and the event function always uses the latest props and state without triggering re-execution. This improves both correctness and performance, especially in complex components.</p>
<h2 id="new-devtools-features">What new DevTools features are available in React Native 0.83?</h2>
<p>React Native DevTools gains two major panels: <strong>Network</strong> and <strong>Performance</strong>. The <em>Network panel</em> shows all HTTP requests made by your app, including headers, payloads, and timing—similar to browser dev tools. The <em>Performance panel</em> lets you record and analyze traces of your app's rendering, scripting, and layout phases. These features work out of the box for all React Native apps without additional setup. They are especially useful for debugging slow load times, excessive network calls, or UI jank. Together, they bring React Native debugging closer to the web development experience. Future updates will likely add more advanced profiling capabilities.</p>
<h2 id="breaking-changes-and-more">Are there any breaking changes in React Native 0.83?</h2>
<p><strong>No breaking changes for end users</strong>—this is the first React Native release with zero user-facing breaking changes. That means you can upgrade to 0.83 without modifying your existing JavaScript code or configuration files. However, internal package changes (like dependency updates) may affect advanced monorepo setups or native module authors. The team also added stable support for <strong>Web Performance APIs</strong> (e.g., <code>performance.mark()</code> and <code>performance.measure()</code>) and a Canary version of <strong>Intersection Observer</strong>. These new APIs are opt-in and don't affect existing behavior. For a smooth upgrade, simply follow the standard migration guide—no major code rewrites needed.</p>