Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 9 additions & 6 deletions website/blog/2024-10-23-release-0.76-new-architecture.md
Original file line number Diff line number Diff line change
Expand Up @@ -38,14 +38,17 @@ This change is a milestone in the evolution of React Native, and we invite you t

![React Native DevTools front-end](../static/blog/assets/0.76-react-native-devtools.jpg)

We're releasing the first stable version of React Native DevTools, a reliable and familiar debugging tool. Key features include:
We're releasing the first stable version of React Native DevTools, our new default debugging experience.

• **Familiar, web-aligned tooling**: A fully featured debugger based on Chrome DevTools with reliable breakpoints, watch values, step-through debugging, stack inspection, and a rich JavaScript console.
• **Improved and integrated React DevTools**: The built-in React Components Inspector and Profiler work seamlessly, with faster and more reliable component highlighting.
• **Improved UX**: A new Paused in Debugger overlay, summary warnings in LogBox, and fixed reconnection behavior.
• **Instant launch**: React Native DevTools is ready by default with zero config, and can be opened from the in-app Dev Menu or via <kbd>j</kbd> to debug in the CLI server.
We want the tooling you use to debug React across all platforms to be reliable, familiar, simple, and cohesive. React Native DevTools delivers on these principles — browser-aligned developer tools that are deeply integrated with React Native. Key features include:

This new debugging experience is fundamentally different from previous options and [has changed](https://github.com/react-native-community/discussions-and-proposals/discussions/819#:~:text=announcement%20talk%20%F0%9F%8E%AC.-,Compatibility,-React%20Native%20DevTools) compatibility. It's built on a new backend debugging stack, rebuilt from the ground up, and will support future feature additions like Performance and Network panels.
- **Familiar, web-aligned tooling** — A fully featured debugger based on Chrome DevTools with reliable breakpoints, watch values, step-through debugging, stack inspection, and a rich JavaScript console. These core features now work reliably and across reloads.
- **Improved and integrated React DevTools** — The built-in React Components Inspector and Profiler work seamlessly, with faster and more reliable component highlighting.
- **Improved UX** — See a new _Paused in Debugger_ overlay, making it clear when your app is paused on a breakpoint. Warnings in LogBox are now displayed as a summary, and hidden when DevTools is attached.
- **Fixed reconnection behaviour** — JavaScript breakpoints now work reliably across reloads and when DevTools is disconnected and reattached. DevTools can even reconnect to the same app after a native rebuild.
- **Instant launch** — React Native DevTools is ready by default with zero config. Open it from the in-app Dev Menu or via <kbd>j</kbd> to debug in the CLI server, which now supports multiple emulators and devices.

React Native DevTools is fundamentally different from our previous debugging options, including being different from the Experimental Debugger experience first shipped in 0.73. It switches to a new backend debugging stack that we’ve rebuilt over the last year. This means that compatibility with previous tooling [has changed](https://github.com/react-native-community/discussions-and-proposals/discussions/819#:~:text=announcement%20talk%20%F0%9F%8E%AC.-,Compatibility,-React%20Native%20DevTools), and you should also expect a much more reliable experience end-to-end. We intend to build upon this new stack to allow us to reliably implement more features in future, such as the Performance and Network panels.

#### Phasing out logs in Metro

Expand Down