react changelog

Hey there, fellow React enthusiasts! We've got a fantastic set of updates for you. From new features to important bugfixes, here's what's new and improved in our latest release:

New Features 🎉

• Custom fbt-like Macro Functions in Compiler: The compiler now supports custom fbt-like macro functions! This means you can define and use custom macros similar to fbt, enhancing your application's capabilities. We've updated the Environment configuration schema to include a customMacros field and made necessary changes across various files to support this feature.

• CaptureOwnerStack API in DEV Builds: Introducing captureOwnerStack, a new API available only in development builds. This allows you to implement similar functionality to console.error in user space. Note that this API does not include the current stack from new Error().stack, so you'll need to add that yourself.

• Method-call Version of Macro Functions: The compiler now supports macro.namespace(...) style invocations, adding more flexibility to how you use macros. We've tested various scenarios to ensure everything works smoothly and fixed a few bugs along the way.

• React Native 0.75 Feature Flags: We're prepping for React Native 0.75 with updated feature flags. This ensures a smooth transition to React 19, improving performance and compatibility.

Improvements 🚀

• React DevTools 5.3.0: The latest version of React DevTools brings several enhancements. We've improved console argument formatting, unified console patching, made source maps URL relative, and fixed various inspection and error reporting issues. Plus, component badges are now visible in light mode!

• Treat Ref-like Named Objects as Refs: The compiler now treats objects named ref or ending with Ref, and containing a property named current, as React refs. This update addresses false positives in analysis when using custom hooks.

Bugfixes 🐛

• Non-reactive Dispatch Function from useActionState: The dispatch function from useActionState is now considered non-reactive, ensuring better performance and fewer unnecessary re-renders.

• Dynamic Feature Flag Removal and Revert: We initially removed the dynamic feature flag enableSchedulingProfiler but then reverted this change based on feedback. This ensures the dynamic control of the scheduling profiler remains intact.

• Console Patching Unification: By default, React DevTools will now use ANSI escape symbols for dimming, ensuring consistency across terminals and browser consoles. For Firefox, which doesn't support ANSI escape symbols, we fallback to CSS properties.

Enjoy these updates and happy coding! 🚀

Here's the latest and greatest update on our project! 🎉 Check out the new features, improvements, and bug fixes we've rolled out:

### New Features
- **Support for Custom fbt-like Macro Functions**: The compiler now supports custom fbt-like macro functions! This allows developers to specify functions that compile as macros, enhancing the flexibility and power of the compiler. 🚀
- **MetaProperty Support**: We've added support for MetaProperty expressions in the compiler, allowing for more versatile coding scenarios. This includes updates to handle MetaProperty expressions and necessary test fixtures.
- **Pruned-Scope Terminal in HIR**: Introducing the PrunedScopeTerminal to the Higher-level Intermediate Representation (HIR) in the compiler. This new terminal type allows for scope-pruning passes to operate on HIR, paving the way for future optimizations.
- **HIR-based FlattenReactiveLoops**: We've implemented an HIR-based version of FlattenReactiveLoops, progressing towards HIR-everywhere. This change prunes reactive scopes within loops to simplify reconciliation.

### Improvements
- **Errored/Blocked Direct References Handling**: Errored or blocked direct references now turn the nearest element lazy, letting the nearest Suspense/Error Boundary handle it. This improvement enhances error tracking and handling during serialization of properties.
- **Nearest Parent of Errored Promise as Owner**: The nearest parent of an errored promise is now considered its owner/task, ensuring accurate error handling, especially with Server Components.

### Bugfixes
- **Treat Pruned Scope Outputs as Reactive**: Outputs of pruned reactive scopes are now treated as reactive, addressing inconsistencies where downstream scopes could depend on non-memoized values.
- **Remove Warning Prefix and toString on Console Arguments**: We've removed the 'Warning: ' prefix and automatic toString conversion on console.error and console.warn, allowing for richer and clearer logging.
- **Revert Bad Push**: Reverted a previous bad push to correct workflow and artifact handling issues.

### Chore
- **Remove Unused Scripts**: Cleaned up the compiler's package.json file by removing unused scripts, making the codebase cleaner and more efficient.

That's all for now! Keep coding and stay awesome! 😎💻

Welcome to the latest updates! We've been hard at work squashing bugs, adding new features, and making improvements. Here's the scoop on what's new and improved:

New Features

• Shallow Prop Diffing Experiment: Added the enableShallowPropDiffing feature flag to test simplifying object prop comparisons with === instead of deep diffing. This aims to reduce JS-side computation while sending more data to native. 🚀

• Non-Reactive useReducer Dispatch: Updated the dispatch function from useReducer to be stable and non-reactive. This ensures better performance and stability when using useReducer. 🛠️

Improvements

• Async Scheduling in Flight and Fizz: Updated non-legacy uses to be asynchronous using the best available macrotask scheduler. The browser now uses postMessage, Bun uses setTimeout, and the FB build also uses setTimeout. This change improves the efficiency of work scheduling. ⏳

• Abort During Render in React Flight: Enhanced abort logic to mark currently rendering tasks as aborted, allowing the current render to emit a partially serialized model with an error reference. This prevents the entire model from being replaced by an aborted error. 🛑

• Enhanced Stack Frames in Console Logs: Improved visibility of stack frames in console logs by prefixing owner stacks with the current stack at the console call. This helps in better debugging by showing the most important frames, like the name of the current component. 🔍

Bugfixes

• ip Dependency Update: Addressed CVE-2024-29415 by updating the ip dependency to version 2.0.1. This improves the application's security. 🔒

• Host Fiber Flavor Change Error: Added an error for when a hoistable component goes from an instance to a resource, specifically for <link> elements. This ensures smoother transitions between different types of host components. ⚠️

• Fixed readTestFilter Call: Resolved an issue where yarn snap --watch was calling readTestFilter even when the filter option was not enabled. This fix ensures the command runs smoothly. 🛠️

Chores

• Migrated to internal-ip: Upgraded from ip to internal-ip due to security concerns with ip version 2.0.1. This change ensures better security and compatibility. 🔄

That's all for now! Keep coding and stay awesome! 😎👨‍💻👩‍💻

Here's the latest and greatest from our codebase. We've been busy squashing bugs and adding improvements to make everything smoother and more efficient. Check out the highlights below! 🚀

Bugfixes

• Import correct prod version of jsx-dev-runtime for react-server (#28939)

  • Fixed an issue where the incorrect production version of jsx-dev-runtime was being imported for react-server. Now, the correct version is used based on the environment, ensuring consistency and efficiency in production builds.

• DevTools: Fix inspecting components with multiple reads of the same Context in React 17 (#28974)

  • Addressed a bug in DevTools where inspecting components with multiple reads of the same Context in React 17 wasn't working properly. Now, the context dependencies are handled correctly, and the values are accurately displayed in DevTools.

• fix: add react-server condition for react/jsx-dev-runtime (#28921)

  • Added a react-server condition for react/jsx-dev-runtime. This involved updating the package.json and bundles.js scripts to include the necessary files and configurations for the react-server condition.

Improvements

• Update compiled-rn destination paths to vendor/react (#28989)

  • Updated the destination paths in fbsource from vendor/* to vendor/react/*. This change streamlines the file structure, making it more organized and consistent within the repository. 🎉

• Use undici polyfill for tests in old Node versions (#28887)

  • Introduced the undici polyfill library for testing FormData/File dependent features in older Node.js versions. This update ensures that our tests are more reliable and compatible with older Node.js versions.

• Move useMemoCache hook to react/compiler-runtime (#28954)

  • Moved the useMemoCache hook to react/compiler-runtime for Meta-internal purposes. This reorganization helps keep the export on react itself to reduce churn while ensuring proper access to the hook across the codebase.

Stay tuned for more updates, and happy coding! 😎

Here's a detailed breakdown of the recent changes and improvements. We've been busy making things smoother, faster, and more awesome! 🚀

New Features

• Async Dispatcher for Current Owner and Cache: We've moved the current owner and cache to an Async Dispatcher in React. This significant change ensures better handling and synchronization, reducing the risk of lost updates. Various files were updated to implement this, including ReactSharedInternals and ReactFiberCurrentOwner.

• Support for (Async) Generator Server Components: React now supports rendering (Async) Generator Server Components. This allows the use of generator functions in Server Components, making it easier and more efficient to handle async operations.

• React 19 Issue Template: A new issue template for React 19 beta has been added. This template will streamline the process of reporting issues, ensuring that all necessary information is provided for quick resolution.

• Changelog for Version 18.3.1: Added a detailed changelog for version 18.3.1, highlighting specific changes like the export of act from react.

Improvements

• Ref Cleanup Function for Imperative Handle Refs: Introduced support for a ref cleanup function for imperative handle refs. This enhancement allows developers to define cleanup functions for these refs, ensuring proper handling during updates and unmounting.

• Update Canary Channel Label to "Beta": During the beta period, canaries will be published and tagged as beta when released to npm. This ensures clear versioning and labeling during the beta phase.

Bugfixes

• Remove Automatic Fetch Cache Instrumentation: Removed the automatic patching of the global fetch function in Server Components environments. This decision was made to avoid controversy and objections from some RSC framework maintainers.

• Remove Warning for Ref Cleanup Function: Cleaned up the warning related to the cleanup function for refs in React. This warning has been active since version 18.0.0 and is now removed for version 19.

• Unrevert "Support Writing to this.refs from Userspace": Reverted a previous change to support writing to this.refs from userspace again. The regression cause was identified and addressed, allowing this feature to be re-implemented.

Chore

• Cleanup of replayFailedUnitOfWorkWithInvokeGuardedCallback and enableProfilerNestedUpdateScheduledHook: Streamlined the code by removing unnecessary flags, ensuring the codebase is clean and focused on essential features.

We hope you enjoy these updates and improvements! Keep coding and stay awesome! 😎✨

Hey there, awesome devs! We've got some exciting updates and fixes to share with you. Here's the latest and greatest from our changelog:

New feature: React DevTools 5.0.2 -> 5.1.0 🎉

We've upgraded React DevTools with a bunch of cool new features and improvements! Some highlights include:

• Support for a theme option in devtools-fusebox.
• Added a method for connecting the backend with a custom messaging protocol.
• Source maps for content scripts.
• Displaying the actual pending state when inspecting useTransition.
• And much more!

Bugfix: Improved <style> textContent escaping in Fizz 🛠️

We've fixed an issue where style text content was being escaped as HTML, which was a bit of a mess. Now, style text content is properly escaped to prevent early tag closure. This is done by encoding "s" and "S" as hexadecimal unicode representations within sequences like </style>. No more dangerouslySetInnerHTML shenanigans!

Bugfix: <script> textContent escaping similar to bootstrapScript 🛡️

Inline script children are now properly escaped to avoid breaking script parsing. This update extends the escaping functionality used for bootstrapScripts and importMaps to any inline script. We escape 's' or 'S' with the appropriate unicode code point if found within a <script> or </script> sequence. This ensures minimal escaping for readability while maintaining full JS parsing capabilities.

Improvement: CircleCI workflows converted to GitHub Actions 🚀

We've moved our devtools_regression_tests workflow from CircleCI to GitHub Actions. This change makes our CI process more integrated with GitHub, and we've tested it thoroughly in a forked repo to ensure everything runs smoothly.

Improvement: Promoted ASYNC_ITERATOR symbol to React Symbols 🔄

The ASYNC_ITERATOR symbol is now part of React Symbols, making it easier to refer to in multiple places within the codebase. This change streamlines the usage of ASYNC_ITERATOR and ensures consistency across the board.

Improvement: Added support for useFormStatus in DevTools 🧩

DevTools now supports the useFormStatus hook! We've added a new function useHostTransitionStatus and updated the Dispatcher object. This enhancement improves debugging capabilities by providing support for the useFormStatus hook and adding tests to ensure its correct functionality.

Bugfix: Removed renderToStaticNodeStream 🚫

We've removed the renderToStaticNodeStream method from React. You can now replicate its semantics using renderToPipeableStream with onAllReady or renderToReadableStream with await stream.allready. This change simplifies the codebase and aligns with our modern streaming implementation for SSR.

Chore: Removed ReactFlightFB bundles 🧹

We've cleaned up the project by removing the ReactFlightFB bundles. This change simplifies the project structure and eliminates unnecessary code related to these specific bundles, making the codebase more focused and easier to maintain.

That's all for now! Keep coding, stay awesome, and enjoy these updates! 🚀✨

Hey there, fellow developers! Here's a rundown of the latest and greatest changes we've made. We've packed in some awesome new features, improvements, and bug fixes to make your experience even better. Check out the details below! 🚀✨

New Features

• Fusebox Integration for DevTools: We've added a shiny new package called react-devtools-fusebox, which serves as the entry point for the React DevTools Frontend in Chrome DevTools. This package builds scripts in ESM format and includes styles in a separate .css file, ensuring everything loads smoothly. 🎉

• Custom Messaging Protocol for DevTools: The RDT backend now has a method called connectWithCustomMessagingProtocol, allowing for custom messaging protocols between the frontend and backend. This is a game-changer for non-browser RDT integrations! 🌐

• Theme Support in DevTools Fusebox: You can now propagate themes from Chrome DevTools frontend to React DevTools Fusebox. The theme field is optional, and future improvements will allow DevTools to listen to theme changes and update automatically. 🎨

• Promise as a Child Test in Flight Fixture: We've added a Promise as a child test to the Flight fixture, demonstrating the use of asynchronous behavior in UI rendering. This ensures that the Promise as a child hydrates without errors. 🔄

• Scaffolding for requestFormReset API: We've laid the groundwork for the requestFormReset API by introducing a new ReactDOM export and setting up the internal dispatcher method. Stay tuned for the full implementation! 🏗️

Improvements

• Hydration Scheduling with Event Priority: Hydration scheduling now uses real event priority instead of the reconciler's update priority when no explicit update priority is set. This change ensures more accurate and efficient hydration scheduling. 📈

• Limited Test Utils Builds: We've introduced a flag to disable test-utils in many builds and removed test-utils implementations from unsupported builds. This ensures proper functionality with tests in different build configurations. 🧪

• Shortened ReactDOMCurrentDispatcher Method Names: We've optimized method names in ReactDOMCurrentDispatcher by shortening them to align with hint codes used in Flight. This makes the code more concise and easier to understand. ✂️

Bug Fixes

• Backwards Compatibility for String Refs on WWW: We've fixed errors with undefined string ref values when syncing, ensuring smooth functioning and compatibility with string refs in React components. 🛠️

• Assertions Flushed Before act in Tests: We've fixed cases where assertions were not flushed before the act function in tests. This prevents blocking issues and improves the testing environment. ✅

• No Preloading Images Inside <noscript>: We've updated the <noscript> scope check to prevent preloading images inside <noscript> tags, addressing the issue raised in #27910. 🖼️

That's all for now! Keep coding and enjoy the new features and improvements. Happy developing! 😄👩‍💻👨‍💻

Here's the latest and greatest from our development team! 🚀

New Features

• Enable feature flags for v19: We've turned on the feature flags for version 19 (v19) in the canary channel. This update includes enabling various experimental features like enableRefAsProp, disableStringRefs, and enableBigIntSupport. Get ready to experiment! 🎉 (#28647)

Improvements

• Remove IndeterminateComponent: We've streamlined the React codebase by removing the deprecated IndeterminateComponent. Say hello to IncompleteFunctionComponent for supporting Suspense in legacy mode. This change simplifies our code and removes outdated features. 🧹 (#28681)

• Move string ref coercion to JSX runtime: The string ref implementation has been shifted from Fiber to the JSX runtime. This subtle change converts string refs to callback refs during element creation, affecting only Meta since string refs are disabled in open source. 📦 (#28473)

• Make class prop resolution faster: We've optimized class prop resolution by removing the ref prop before handling default props, eliminating the need to clone the object twice. This makes the process faster and more efficient. ⚡ (#28766)

Bugfixes

• Emit Server Error Prefix in the .stack Property Too: Fixed an issue where the prefix of a server error wasn't displayed in the console when using V8. Now, the error message will be properly displayed, improving the debugging experience. 🐛 (#28738)

• Fix: Class components should "consume" ref prop: Addressed the issue where class components did not automatically attach the class instance to the ref's current property. Now, the ref is removed from the props object before passing it to lifecycle methods, ensuring existing code doesn't break. 🛠️ (#28719)

• Hardcode enableLegacyFBSupport flag: Simplified the configuration by hardcoding the enableLegacyFBSupport flag to true, ensuring legacy Fiber support is always enabled. 🔧 (#28701)

Chores

• Cleanup enableBigIntSupport flag: Cleaned up the enableBigIntSupport flag by removing its usage and imports across various files. 🧼 (#28711)

That's all for now, folks! Keep coding and stay awesome! ✨