React Native 0.85 Arrives: Enhanced Animation Engine, DevTools Upgrades, and More

By • min read
<h2>Overview of React Native 0.85</h2> <p>The React Native team has officially launched version 0.85, bringing a host of powerful enhancements and essential fixes. This release introduces a completely revamped animation system, relocates the Jest preset to its own package, and delivers several other improvements designed to streamline development workflows. Below, we break down the most significant updates and changes you need to know.</p><figure style="margin:20px 0"><img src="https://picsum.photos/seed/2681407643/800/450" alt="React Native 0.85 Arrives: Enhanced Animation Engine, DevTools Upgrades, 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="new-animation-backend">A New Animation Backend for Smoother Interactions</h2> <p>One of the standout features in React Native 0.85 is the introduction of a <strong>Shared Animation Backend</strong>, developed in close partnership with <em>Software Mansion</em>. This new internal engine fundamentally changes how animations are processed by both the <code>Animated</code> library and the <code>Reanimated</code> library. By centralizing the animation update logic into React Native's core, the new backend enables performance optimizations that were previously unattainable. Additionally, it ensures that the reconciliation process is thoroughly tested and remains stable across future React Native releases.</p> <h3>Animating Layout Properties with Native Driver</h3> <p>With this update, you can now animate Flexbox and positional properties using the native driver in <code>Animated</code> — a capability that was previously restricted. This means smoother animations for layout changes without compromising on performance. The example below demonstrates how to animate a view's width using the native driver:</p> <pre><code>import { Animated, Button, View, useAnimatedValue } from 'react-native'; function MyComponent() { const width = useAnimatedValue(100); const toggle = () =&gt; { Animated.timing(width, { toValue: 300, duration: 500, useNativeDriver: true, }).start(); }; return ( &lt;View style={{flex: 1}}&gt; &lt;Animated.View style={{width, height: 100, backgroundColor: 'blue'}} /&gt; &lt;Button title='Expand' onPress={toggle} /&gt; &lt;/View&gt; ); } </code></pre> <p>To try the new backend, you need to opt in by enabling the experimental channel of React Native as described on the <a href='https://reactnative.dev/docs/experimental'>experimental page</a>. Note: This feature will only be available starting from React Native 0.85.1, which is expected shortly.</p> <h2 id="devtools-improvements">React Native DevTools Enhancements</h2> <p>The DevTools experience also receives a significant upgrade in version 0.85, with improvements aimed at boosting developer productivity and debugging capabilities.</p> <h3>Multiple CDP Connections</h3> <p>One of the most requested features now lands: support for multiple simultaneous Chrome DevTools Protocol (CDP) connections. This means you can now connect React Native DevTools, VS Code, and even AI-driven agents at the same time without ending any active session. The result is a more flexible and composable debugging environment that lets you use the best tools for each task.</p> <h3>Native Tabs on macOS</h3> <p>For macOS users, the desktop app has been recompiled to target macOS 26, and now includes system-level tab handling. You can merge multiple DevTools windows into a single window with tabs via <em>Window &gt; Merge All Windows</em>, making it easier to organize your debugging sessions.</p> <h3>Request Payload Previews Restored</h3> <p>After a regression that disabled request body previews in the Network panel, Android users can once again inspect request payloads — a crucial feature for debugging network calls.</p> <h2 id="metro-tls-support">Metro Dev Server Now Supports TLS</h2> <p>Developers can now configure the Metro development server to accept a TLS object, enabling HTTPS for the dev server and WSS for Fast Refresh during development. This is particularly useful for teams that need to test secure features locally or work in environments requiring encrypted connections.</p> <h2 id="breaking-changes">Breaking Changes in React Native 0.85</h2> <p>As with any major release, React Native 0.85 includes some breaking changes that require attention when upgrading.</p> <h3>Jest Preset Moved to a Dedicated Package</h3> <p>To simplify dependency management, the Jest preset has been extracted into its own package. If your project relies on the bundled Jest configuration, you will need to install the new preset package separately. Refer to the <a href='https://reactnative.dev/docs/testing'>testing documentation</a> for migration steps.</p> <h3>Dropped Support for End-of-Life Node.js Versions</h3> <p>React Native 0.85 no longer supports Node.js versions that have reached their end of life. Make sure your development environment uses a supported Node.js version (v18 or later recommended) to avoid issues.</p> <h3>StyleSheet.absoluteFillObject Removed</h3> <p>The utility <code>StyleSheet.absoluteFillObject</code> has been removed. Use <code>StyleSheet.absoluteFill</code> or manually define the style object with <code>position: 'absolute', left: 0, right: 0, top: 0, bottom: 0</code> instead.</p> <h3>Other Breaking Changes</h3> <p>Additional minor breaking changes may affect some projects. Be sure to review the full <a href='https://github.com/facebook/react-native/releases/tag/v0.85.0'>release notes</a> for a complete list.</p> <h2>Conclusion</h2> <p>React Native 0.85 represents a meaningful step forward for the framework, particularly with the new animation backend that promises smoother and more reliable animations. Combined with improved DevTools, TLS support for Metro, and necessary cleanup of outdated features, this release gives developers a more robust and modern toolkit. Upgrade today to take advantage of these new capabilities.</p>