Kousa4 Stack
ArticlesCategories
Environment & Energy

React Native 0.85: Enhanced Animation Engine and Streamlined Testing

Published 2026-05-05 08:04:43 · Environment & Energy

React Native 0.85 brings a fresh wave of improvements, with a standout new animation backend developed in collaboration with Software Mansion, plus better developer tools and a dedicated Jest package. This release also includes necessary breaking changes to keep the framework modern and performant. Below, we answer the most pressing questions about what's new and how it affects your workflow.

What is the new animation backend in React Native 0.85?

The new Shared Animation Backend is a foundational engine built jointly with Software Mansion. It centralizes how animations are applied under the hood for both the Animated and Reanimated libraries. By moving animation update logic into React Native core, Reanimated can achieve performance gains that were previously impossible, and the reconciliation process is now more robust and stable across future React Native updates. To activate this experimental feature, you need to enable the experimental channel starting from React Native 0.85.1 (coming soon). Once enabled, you can use the native driver to animate layout properties such as Flexbox and position values, which was previously restricted.

React Native 0.85: Enhanced Animation Engine and Streamlined Testing

How can I animate layout props with the new backend?

With the new animation backend, you can animate layout-related props like width, height, margin, and flex using the native driver directly in Animated. For example, you can create an expanding box by using useAnimatedValue and Animated.timing with useNativeDriver: true applied to an Animated.View. This eliminates the previous limitation that forced layout animations to run on the JavaScript thread. Here's a quick code snippet:

import { Animated, Button, View, useAnimatedValue } from 'react-native';

function MyComponent() {
  const width = useAnimatedValue(100);
  const toggle = () => {
    Animated.timing(width, {
      toValue: 300,
      duration: 500,
      useNativeDriver: true,
    }).start();
  };
  return (
    <View style={{flex: 1}}>
      <Animated.View style={{width, height: 100, backgroundColor: 'blue'}} />
      <Button title="Expand" onPress={toggle} />
    </View>
  );
}

You can find more examples in the react-native/packages/rn-tester/js/examples/AnimationBackend/ directory.

What improvements have been made to React Native DevTools?

React Native DevTools in version 0.85 include several notable enhancements:

  • Multiple CDP connections: Now supports multiple simultaneous Chrome DevTools Protocol connections, so tools like React Native DevTools, VS Code, and AI agents can connect at once without interfering with each other. This enables richer, composable development workflows.
  • Native tabs on macOS: The desktop app now compiles for macOS 26 and provides native tab management. You can merge multiple DevTools windows into one using Window > Merge All Windows.
  • Request payload previews: On Android, request body previews in the Network Panel have been restored after being temporarily disabled due to a regression.

How does Metro TLS support work in this release?

Metro, the JavaScript bundler for React Native, now accepts a TLS configuration object for the dev server. This allows you to enable HTTPS (and WSS for Fast Refresh connections) during development. By setting up TLS, you can test features that require secure contexts or mimic production-like conditions. The configuration is straightforward: you provide a TLS object with your certificate and key, and Metro will serve the development bundle over HTTPS. This is particularly useful for teams that need to test service workers, geolocation, or other secure APIs on local devices.

Why has the Jest preset been moved to a new package?

Starting with React Native 0.85, the Jest preset is no longer bundled in the core react-native package. Instead, it is published as a dedicated package called @react-native/jest-preset. This separation reduces the size of the core package and allows the testing utilities to evolve independently. To update your project, you'll need to install the new package and adjust your Jest configuration. While this is a breaking change, it streamlines the main React Native distribution and aligns with the community's trend toward modular packages. Check the migration guide in the official release notes for the exact steps.

What other breaking changes should I be aware of?

In addition to the Jest preset move, React Native 0.85 drops support for End-of-Life (EOL) Node.js versions, so you'll need Node.js 18 or newer. Also, StyleSheet.absoluteFillObject has been removed; migrate to StyleSheet.absoluteFill instead. Other minor breaking changes may affect custom native modules or third-party libraries. Always review the full changelog before upgrading. These changes, while requiring some update effort, help keep the framework secure and maintainable for the long term.