React Native 0.85: Enhanced Animation Engine and Streamlined Testing

By

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:

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.

Related Articles

Recommended

Discover More

Revitalizing User Experience in Aging Software: A Practical GuideHow to Strengthen Your Network Resilience: Lessons from Cloudflare’s Code Orange InitiativeRevolutionary Voice Typing App for Linux Uses OpenAI's Whisper: Speed and Accuracy Finally HereTesla Ordered to Pay $10,600 Over Misleading FSD Claims — But Automaker Refuses to SettleLicense Plate Readers Used for Stalking: 14 Cases Expose Police Misuse