React Native 0.85: Key Updates and Migration Guide

By

React Native 0.85 has arrived with exciting enhancements, including a revamped animation engine, important deprecations, and better developer tooling. This article answers common questions about the new release, covering the new animation backend, Jest preset changes, Metro TLS support, DevTools improvements, and what you need to know about breaking changes. Whether you're upgrading an existing project or starting fresh, these insights will help you navigate the update smoothly.

What is the new animation backend in React Native 0.85 and why was it introduced?

React Native 0.85 introduces a Shared Animation Backend, developed in collaboration with Software Mansion. This new internal engine powers how animations are applied for both the Animated library and Reanimated. By moving the core animation update logic into React Native's core, Reanimated gains performance improvements that were previously impossible. The unified approach ensures that the update reconciliation process is thoroughly tested and remains stable with future React Native versions. With this backend, you can now animate layout props—such as Flexbox and position properties—using the native driver in Animated, a limitation that previously existed. To start using it, enable the experimental channel in React Native 0.85.1 (coming soon). The new backend makes animations smoother and more consistent across platforms.

React Native 0.85: Key Updates and Migration Guide

How do I animate layout props with the new backend?

With the new animation backend in React Native 0.85, animating layout props becomes straightforward. You can use the Animated API with the native driver on properties like width, height, margin, and top. For example, to animate a view's width from 100 to 300:

This removes previous restrictions where the native driver couldn't handle layout properties. The change leads to fluid, high-performance animations without JS thread bottlenecks. More examples are available in the react-native/packages/rn-tester/js/examples/AnimationBackend/ directory.

What happened to the Jest preset in React Native 0.85?

In React Native 0.85, the Jest preset has been moved to a dedicated package. This is a breaking change that requires updating your project configuration. Previously, the preset was bundled within the react-native package; now you must install the separate @react-native/jest-preset package and adjust your Jest setup accordingly. The move allows for faster iteration and versioning of testing utilities independent of React Native core. To migrate, update your package.json or jest.config.js to reference the new preset. Check the official migration guide or release notes for exact steps. This change ensures better isolation and clearer dependency management for testing tools.

What are the key improvements in React Native DevTools for 0.85?

React Native 0.85 brings several notable enhancements to the developer tools:

These improvements streamline debugging and make the development experience more efficient and flexible.

How does Metro TLS support work in React Native 0.85?

React Native 0.85 adds TLS support to the Metro dev server. You can now provide a TLS configuration object to enable HTTPS during development. This also secures WebSocket connections used for Fast Refresh (WSS). Setting up TLS is essential for testing features that require secure contexts, such as Service Workers or certain browser APIs. To configure, add a tls option in your Metro configuration file (e.g., metro.config.js). This feature improves security and aligns development environments more closely with production setups.

What other breaking changes should I be aware of when upgrading to React Native 0.85?

Beyond the Jest preset move, React Native 0.85 includes a few other breaking changes:

It's crucial to review your project for these changes during upgrade to avoid runtime errors. The React Native team provides migration guides to assist with the transition.

Tags:

Related Articles

Recommended

Discover More

AI Workloads Skyrocket Cloud Costs – But Optimization Fundamentals Remain Unchanged, Experts Warn6 Key Changes to Know About the New Mac Mini Pricing10 Ways Genetic Testing Should Become a Routine Part of HealthcareHow to Build a Thriving Design Team with Shared LeadershipSpace Force Accelerates Golden Dome Program: Orbital Missile Interceptors Targeted for 2028 Demo