Issue Number #3
React Native 0.76 has finally landed, and it’s a major release that’s been six years in the making. The New Architecture is now enabled by default for all new projects. Okay, so if you don’t know what the new architecture is, then Patrick Star is properly also your room mate, I’m kidding but it’s basically a several long years refactor of the React Native internals to unlock performance boosts and new features, you can read About the New Architecture 👈 well.. there.
Unlike the older asynchronous bridge, the New Architecture replaces this with a direct communication path between JavaScript and native code via the JavaScript Interface (JSI). This approach allows for real-time (synchronous) interactions:
For anyone hearing about the asynchronous bridge for the first time. The asynchronous bridge was the core mechanism React Native used to communicate between JavaScript (JS) and native code in iOS or Android. It worked by creating a queue of messages, which allowed JavaScript to send data to native modules and vice versa without blocking the main thread. This setup made sure the UI stayed responsive, but the process wasn’t instantaneous—it introduced a slight delay due to the time required to pass data back and forth asynchronously.
In contrast, the JavaScript Interface (JSI), part of the New Architecture, enables direct, synchronous communication between JavaScript and native code. Instead of waiting for messages to move back and forth on the bridge, JSI provides real-time access to native modules, allowing functions to be called and data exchanged on-demand and immediately, boosting performance and responsiveness.
With React Native’s new concurrent renderer and updated Event Loop, your app can now prioritise essential interactions like button clicks over background tasks. This means faster responses to user actions, with less “jank” during complex updates. The Event Loop now enables synchronous and asynchronous processing, allowing React Native to pause low-priority updates to handle high-priority tasks instantly.
For a full dive into the new architecture, check out New Architecture is here.
React Native 0.76 brings major speed improvements to Metro. Metro is the tool that gathers and bundles all the JavaScript in your app. Metro’s job is to quickly find and package all the code modules your app needs, but this process has sometimes been slow. With this update, Metro can now find these modules 15x faster. I guess build times are no longer an excuse for those Candy Crush breaks my boss has been asking about…
React Native 0.76 also introduces two new styling properties—boxShadow and filter—making it easier to create shadows and graphical effects directly in your app, similar to what’s possible on the web.
boxShadow: This property lets you add a shadow to any element, with options to control the shadow’s position, colour, size, and blur effect. You can use the web-style syntax (e.g., "5px 5px 5px rgba(0, 0, 0, 0.5)") or a JavaScript object. This makes shadows more versatile, especially on Android, where earlier shadow options were limited.
filter: The filter property allows you to apply visual effects, like adjusting brightness, blurring, or inverting colours. It can take either a single string or an array of objects, giving you flexibility with effects like grayscale, saturation, and blurring.
These properties may have some limitations on older Android devices (they only work on Android 12+), and certain effects may appear differently across platforms. For more on each property, check out the MDN documentation on boxShadow and filter.
In addition, React Native DevTools has officially launched (we talked about it in issue #2), bringing a simplified debugging experience in line with Chrome DevTools. The goal here is a more consistent, reliable debugging environment across devices and reloads, with familiar features like breakpoints and component inspection.
Check out the full release notes here.
If you’ve been anywhere on the internet lately, you’ve probably heard everyone talking about One. When I first did, I grabbed my guitar and sandals, ready to make the pilgrimage to Wrocław, Poland to sing Hallelujah with Mike Grabowski and the Callstack team.
Unfortunately, my plans for spiritual ascension were cut short when I learned that One is, in fact, a new React/React Native framework by Nate, Pokai, and Jon. It uses a whole different stack of tools, likely unfamiliar to most React Native developers.
One is built to enable mobile and web apps within the same codebase—the Holy Grail that the React and React Native communities have been chasing across the seas for generations: Code Once, Run Everywhere.
So, what makes One so different? It’s built on Vite (instead of Metro), which means blazing-fast development, file-based routing, and multiple rendering modes (Static Site Generation, Server Side Rendering, and Single Page App). Plus, it offers a local-first development approach through its integration with Zero Sync i.e. offline first applications.
It uses React Native and Expo under the hood to power mobile development on iOS and Android. Think of One as a framework on top of frameworks; it sits above React and Expo to provide a unified development experience for native and web. This is achieved through Tamagui, a component library also built by the One team, offering cross-platform components like buttons, text, and form controls, that adapt seamlessly to mobile and web.
With tools like One, Expo Router, and Expo DOM Components, we’re slowly edging closer to the ideal of code once, run everywhere. Hopefully, we’ll reach it before we can simply prompt an AI to make us an app and cook us dinner.
You can learn more about One here.
Detox, the popular end-to-end testing framework for React Native, just received a massive upgrade: Detox Copilot. Currently in beta, this new feature introduces AI-powered testing through human-readable commands.
Imagine being able to type commands like “click the login button” or “assert the element is visible” and have Detox take care of the heavy lifting. Detox Copilot uses multimodal LLMs to handle visual analysis and action assertion.
With zero config and natural language prompts, you can learn more about Detox Copilot here.
Maybe Expo EAS will have second thoughts about Maestro being its new favourite for testing.
Expo Speech Recognition enables native voice recognition directly into React Native, letting you add functionality like voice commands and voice search. Whether you’re enhancing accessibility or creating voice-activated UIs, this tool makes integrating these features into your app more seamless.
You can check it out at expo-speech-recognition.
Optimising app size is easier with Expo Import Cost, a new VSCode extension that shows the size of each import in your codebase. By identifying heavy modules, you can reduce your app’s bundle size for a faster, leaner app experience.
Perfect for keeping your code efficient, expo-import-cost is available here.
With Android 15’s upcoming release, apps targeting SDK 35 will now be required to support edge-to-edge content by default. This means your app’s content will flow beneath system bars for a fully immersive experience. If you don’t handle insets properly, parts of your UI might get obscured by the status bar or navigation gestures. This is particularly important for apps updating to Android 15 or later, as Google will likely enforce this starting August 31, 2025.
To get ahead of the changes, the React Native Edge to Edge library helps ensure your app is ready to provide seamless fullscreen experiences on Android 15+ devices.
Check it out react-native-edge-to-edge here.
Storybook is a tool that helps developers build, test, and showcase UI components in isolation, promoting component-first development. It’s used widely in web development, ensuring each component works perfectly before being integrated into an app.
But for anyone who’s been near Storybook, you also know that the React Native version has always lagged behind its web counterpart. With the release of React Native Storybook 8, that gap has finally been closed.
This new version brings a mobile-friendly UI, improved hot-reloading, a widescreen layout for tablet and web apps, and a simplified Metro config. Most importantly, React Native Storybook is now fully in sync with the web version, meaning no more version delays or mismatched features.
Check out the full details on Storybook 8 here.
The React Native London Conference 2024 is happening November 14th - 15th, and if you’re anything like me, you’ll realise this is the perfect time for a React Native drinking game!
Every time you hear “New Architecture”, take a sip. If someone says “bridgeless” or mentions JSI, that’s a double. And if anyone dares to talk about concurrent rendering, well… finish your drink!
This conference will bring together speakers such as Dan Abramov (our React prophet), Charlie Cheever (founder of Expo), Mike Grabowski (Co-founder of Callstack) and many more.
CodePush is a tool that enables developers to over-the-air (OTA) updates directly to users’ devices—bypassing app store approvals for changes like JavaScript, HTML, or image updates. With Microsoft shutting down App Center by March 31, 2025, CodePush has been open-sourced to ensure continued use independently from App Center.
While there’s no official support for the New Architecture yet, some developers have managed to find workarounds. If you’re currently relying on CodePush, now might be a good time to explore alternatives like EAS Update for a more seamless integration—just use Expo, bro.
Learn more about the deprecation and how to migrate here.
As noted in Issue #2, React Native 0.76 has updated its minimum platform requirements: iOS now requires version 15.1 (up from 13.4), and Android requires SDK 24 (Android 7). These updates align React Native with modern platform capabilities, so double-check your app’s compatibility if you haven’t upgraded yet.
