react changelog

Here's the latest scoop on our updates! 🚀 We've been cooking up some exciting new features and squashing pesky bugs to make everything run smoother than ever. Dive in to see what's new and improved:

• New feature: Transition Indicator Fun! 🎉 We've rolled out onDefaultTransitionIndicator to jazz up the React Fiber architecture. It's all about making transitions smoother by scheduling updates and tracking mutations. This means you'll see more accurate loading states without unnecessary indicators popping up. Plus, multiple transitions can now party together without interruption!

• Improvement: Clean Up Those Shadow Nodes! 🧹 We're tackling memory management like pros by cleaning up old shadow nodes in fiber.alternate.stateNode sooner. This fix ensures that resources, especially those image-heavy ones, aren't hogging memory longer than needed. Say goodbye to unnecessary clutter!

• New feature: Browser Spinner Magic! 🔄 Our DOM renderer now has a default transition indicator backed by the Navigation API. This means that during transitions, you'll see the browser's native loading spinner in action—at least in Chrome for now. It's all about keeping things visually consistent and smooth.

• Improvement: Async Action Indicators! ⏳ We've added a default loading indicator for those tricky async transitions that don't have an immediate root association. Now, async actions get the attention they deserve, ensuring that loading indicators behave correctly even when things get a bit tangled.

• New feature: ViewTransition Annotations! 🏷️ With the introduction of vt- prefixed attributes, <ViewTransition> elements are now more manageable. These annotations help with CSS targeting and streamline the transition process, making sure everything's in tip-top shape during those dynamic content reveals.

• New feature: Plumbing for Transition Indicators! 🚰 We've laid the groundwork for handling default transition indicators, adding options at the root level. While it doesn't do much yet, it's a crucial step towards a more integrated and seamless experience.

• New feature: Fizz Blocking Render! ⚡ Our experimental channel now supports gating rel="expect" behind enableFizzBlockingRender. It's all about enforcing critical HTML semantics to ensure smooth sailing during rendering.

• Bugfix: Noop Detection for Xplat Syncs! 🛠️ We've fixed an issue with noop detection for cross-platform syncs. By ignoring changes to eslint-plugin-react-hooks/package.json, we've streamlined the sync process and avoided unnecessary actions.

• Bugfix: Compiler Edge Cases! 🧩 We've tackled edge cases related to noEmit and module scope opt-outs in the Babel plugin. This fix ensures that the compiler behaves as expected, enhancing the overall developer experience.

• Chore: Bye-Bye Stray File! 🗑️ We found a stray file lurking in the codebase and gave it the boot. It's all part of keeping things neat and tidy around here!

And that's a wrap on our latest updates! Stay tuned for more improvements and happy coding! 🎈

Hey there, code wizards and bug squashers! 🎉 We've got some exciting updates and fixes rolling out, so buckle up and let's dive into the latest changes that will make your coding life a whole lot smoother.

New Features and Improvements

• Constant Propagation for Template Literals: The compiler now smartly inlines template literals that are made up entirely of constant values. This means those backticks are swapped for double quotes, letting expressions like "" === "" and `a${1}` equal "a1" evaluate as true. It's like magic but with fewer rabbits and more code optimization! 🪄

• TypeScript Support for MCP Plugins: We've added TypeScript support to enhance the development experience, making your code more robust and maintainable. This is part of a series of updates, ensuring a smooth transition to better code quality. 📦

• React DevTools Highlighting with Popover API: No more hiding behind top-layer elements! The highlighting in React DevTools now uses the Popover API to ensure updates are visible above everything else. It’s like giving your components the spotlight they deserve. 🌟

• Event Dispatching for Fragment Instances: Fragment instances can now dispatch events to their host parent element, simulating event bubbling. If the parent is disconnected, you'll get a heads-up with a developer warning. 🚀

• Focus Management in FragmentInstances: We've improved the focus capabilities by allowing focus and focusLast methods to work on nested host components. Now you can target deeply nested elements without breaking a sweat. 🔍

• Constant Folding for Unary Minus: The compiler now optimizes unary minus operations by folding them into constant * -1, even handling tricky cases like -0 to 0. Say goodbye to unnecessary calculations! ➖

• Event Replay Between Commits: Your controlled inputs are safe! We've introduced event replaying between commits to preserve user interactions during hydration. Your forms will thank you. 📝

• Compare Document Position for Fragments: Fragment instances can now use compareDocumentPosition to determine their relationship with other nodes, making DOM interactions even more intuitive. 📜

Bugfixes

• Emoji Handling in JSX Attributes: Fixed an issue with JSX attributes containing emojis and extended Unicode characters. Now they’re correctly wrapped in expression containers, ensuring your UI is as expressive as your emojis. 😎

• Prevent Serialized Size Leakage: We've patched a bug preventing serialized size information from leaking across requests in the React Server DOM. Your data stays where it should, no surprises! 🔒

• Mutable Range Handling in Functions: Functions capturing mutable values but not called now have their mutable ranges correctly inferred, preventing unnecessary memo scope grouping and ensuring reactive scopes are created when needed. 🔄

Chores

• ESLint Plugin for React Hooks Update: The build process now includes the eslint plugin in the fbsource output, keeping lint rules in sync with internal standards. It’s all about keeping things tidy and consistent. 🧹

That's all for now, folks! Keep coding, keep innovating, and don't forget to enjoy the little wins along the way. Happy coding! 🎈

Here's the latest scoop on the updates and improvements made to the React codebase! 🚀

• New feature: Batch Suspense Boundary Reveal with Throttle 🎉 This update brings a much-needed feature to server-side rendering (SSR) streaming by implementing throttled reveals for Suspense boundaries. This ensures smoother transitions and prevents flashing reveals, especially noticeable on dynamic sites. The changes enhance the Fizz runtime by batching reveals into single paint operations, improving performance and paving the way for future SSR View Transitions.

• New feature: Emit link rel="expect" to block render before the shell has fully loaded 🚀 React now uses a <link rel="expect"> tag to control rendering behavior in SSR applications, ensuring that content outside Suspense boundaries doesn't display until fully unsuspended. This prevents content "popping" and leverages the new Chromium API for view transitions, improving rendering control, particularly in multi-page applications.

• Improvement: Restore all Transitions for Tree updates 🌳 React DevTools gets a boost with reintroduced transition animations for tree updates, thanks to a new hook, useChangeOwnerAction. This enhancement ensures smoother user interactions and maintains transition continuity during tree updates, offering a more responsive and visually appealing experience.

• New feature: Add Fragment Refs to Fabric with intersection observer support 🧩 React Native (RN) now supports Fragment Refs through the Fabric configuration, enhancing how fragments interact with intersection observers. This feature, validated in the Catalyst app, adds dynamic UI behaviors and includes a test suite to ensure functionality.

• New feature: Initial experiment for adding a performance tool 🚀 Introducing a performance measurement tool for React code! This experimental feature, review-react-runtime, helps evaluate runtime performance by collecting metrics like render time and web vitals. It’s a step towards better understanding and optimizing React code performance.

• Bugfix: Patch for reactive refs in inferred effect dependencies 🐛 A fix for the React compiler that ensures stable-typed value blocks are correctly inferred as reactive. This patch enhances the accuracy of dependency inference, particularly in complex scenarios involving conditional logic.

• Improvement: Outline if a boundary would add too many bytes to the next completion 📏 Enhancements to the Fizz server heuristic prevent excessive inlining of small boundaries, improving document streaming capabilities. This update introduces a size limit to ensure content is worth outlining, addressing potential rendering order issues.

• Bugfix: Reset Instructions on ResumableState 🔄 This fix addresses incomplete state handling in the React shell by resetting the ResumableState, ensuring it reflects the current status of the flushing process and maintains accurate instruction state.

• Bugfix: Expand StoreContext to const / let / function variants 🛠️ A bugfix in the React compiler improves the handling of hoisted context variables, preventing duplicate declarations and preserving variable type information. Extensive testing ensures the correctness of the compiler's behavior in various scenarios.

These updates bring exciting improvements and fixes, enhancing performance, user experience, and developer tools in the React ecosystem! 🎉

Here's the latest scoop on all the exciting updates and fixes we've rolled out! 🚀

• New feature: First-Class Support for Thenables
  We've jazzed up the React DevTools by introducing first-class support for Thenables! Now, Promise-like objects are treated with the respect they deserve during hydration, with their status (fulfilled, rejected, or pending) clearly displayed. This means you can now inspect these objects more effectively, with previews that match each status. Plus, we've got comprehensive tests in place to ensure everything runs smoothly with subclassed promises and deeply nested objects. 🎉

• New feature: AutoDepsDecoration Event
  Say hello to AutoDepsDecoration, a new event that enhances logging capabilities by capturing and logging the locations of dependencies used in effect hooks. This gives developers better insights into dependency management within their components, making debugging a breeze! 🔍

• New feature: Remove Dependency Arrays with Ease
  We've added a snazzy new code action feature that lets you remove dependency arrays when editing code within functions eligible for automatic dependency tracking. This means quick fixes and streamlined editing for developers, all thanks to the new AutoDepsEligibleEvent. 💡

• New feature: Partial Hydration for Activity
  Activity boundaries now act independently, just like Suspense boundaries. This lets you hydrate outer content first and then move on to content in an Offscreen lane. It's all about prioritizing hydration when props flow or interactions happen. Plus, we've made sure <Activity mode="hidden"> content is deferred for later client rendering. Neat, right? 🤓

• Improvement: Version Name in Publish Script
  We've spiced up the publish script by allowing an optional tagVersion parameter. This means you can now append a tag version to the version name, like 19.1.0-rc.1, for a more detailed versioning format. Version clarity, here we come! 📦

• New feature: Build react-server-dom-webpack for CodeSandbox
  Testing Flight changes just got easier with the ability to build react-server-dom-webpack for CodeSandbox. Now you can test and demonstrate server component features in a sandbox environment. 🛠️

• Improvement: Add Changelog
  We've added a shiny new CHANGELOG.md file documenting changes from 19.0.0-beta-9ee70a1-20241017 to 19.1.0-rc.1. This comprehensive list highlights updates, improvements, and bug fixes across various components. 📜

• Bugfix: Handle Rejected Promises Gracefully
  No more hanging! We've fixed an issue in the React Server DOM where rejected promises during prerendering could cause indefinite hangs. Now, errors are caught and processed correctly, ensuring the prerendering flow continues smoothly. 🐛

• Improvement: Docs Resource as a Tool
  The docs resource in the React MCP server now functions as a tool, returning plaintext instead of Markdown. This change enhances usability and streamlines the response format for documentation queries. 📚

• Bugfix: Suspense Boundary Visibility
  We've resolved a quirky edge case with dehydrated Suspense boundaries, ensuring proper hiding and unhiding of content when the parent boundary resuspends. This fix enhances the robustness of React's handling of complex rendering scenarios. 🎭

• Bugfix: Fix Copyright Script
  Our copyright script got a little smarter! It now avoids trying to open directories, preventing errors during execution. 📝

• Chore: Remove Compiler Weekly Release
  We've discontinued the weekly release process for the compiler, streamlining our continuous integration process for better efficiency. 🗓️

And that's a wrap! Keep an eye out for more updates and happy coding! 🎈

Here's the latest scoop on what's been cooking in our code kitchen! We've got some sizzling new features, spicy improvements, and a few bug fixes that are all set to make your development experience smoother and more delightful. Let's dive into the details! 🌟

New Features

• Profiler Tab Gets a Makeover: The Profiler tab in DevTools now shows the names of changed hooks! With the new HookChangeSummary component, you can toggle between compact tooltips and detailed views to see what's cooking with your hooks. This nifty feature respects your settings and shares hook name data across tabs for a seamless experience. 🎉

• MCP Server Debugging Made Easy: Introducing an inspection script for the MCP server! Now you can inspect and debug with ease using the yarn workspace react-mcp-server dev command, launching the inspector at http://127.0.0.1:6274. This addition streamlines the development workflow, making it a breeze to keep an eye on the server. 🔍

• React MCP Server Initialization: We've initiated a playful experiment with a new React MCP server, featuring one assistant prompt and two capabilities. It's all in the spirit of fun, so stay tuned for what this might evolve into! 🎈

Improvements

• Prompt Refinement for MCP: The React expert assistant within the MCP server now has a more structured prompt, guiding you on best practices for writing efficient React code. It's all about making your code sleek, optimized, and ready for concurrency. 🚀

• Node.js Upgrade: We've upgraded to Node.js 20 LTS, ensuring compatibility with the latest features and security updates. This change keeps our project robust and future-proof. ⬆️

• Bailout Message Clarity: Bailout messages in the MCP server now emit even without a specific location, improving error reporting and making debugging a tad less mysterious. 🕵️‍♂️

Bugfixes

• Correcting Bailout Locations: Fixed an issue where bailout messages were showing [Object:object] instead of actual line numbers. Now, error messages are clear and accurate, helping you pinpoint issues quickly. 🛠️

• Offscreen Hydration Bug Squashed: Resolved a bug where hidden Offscreen components were triggering hydration errors. The logic has been moved to the Activity boundary, ensuring smooth sailing during SSR. 🌊

• GitHub Actions Workflow Fix: Addressed a bug in the check_access job, ensuring it correctly checks user access status in our CI/CD processes. It's all about keeping things running smoothly! ⚙️

• Efficient PR Labeling: PRs now get labeled only when they're first opened, not on every update. This change makes the workflow more efficient and less cluttered. 🏷️

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

In this update, we've introduced several exciting new features and improvements to enhance your React experience. From enabling direct object support in media elements to enhancing automated notifications and improving component tracking, these changes aim to streamline development and optimize performance. Let's dive into the details! 🎉

• New Feature: Pass Blob/File/MediaSource/MediaStream to Media Elements 🎥🎵

  • You can now pass Blob, File, MediaSource, or MediaStream objects directly to the src attribute of <img>, <video>, and <audio> elements. This is under the enableSrcObject flag, offering a more convenient and declarative API style.

• New Feature: Suspensey Images Behind a Flag 🖼️⏳

  • Images now wait to render until decoded, with a 500ms timeout, enhancing the handling of images in React. This applies to various transitions and can be opted out with certain attributes.

• Improvement: Component Lifecycle Logging 📝

  • We've added logging for mount, unmount, reconnect, and disconnect events in components, making it easier to track lifecycle events across various phases.

• New Feature: Discord Notifications for Publish Failures 🔔

  • If an automated publish fails, a notification will be sent to a Discord channel, improving communication within the development team.

• New Feature: Enable Suspensey Images in <ViewTransition> 🌟

  • Suspensey Images are now enabled within <ViewTransition> subtrees, even if the flag is off, enhancing view transitions.

• New Feature: unstable_Activity in Server Entrypoint 🚀

  • unstable_Activity can now be imported and rendered from a Server Component, similar to other component types like Suspense and ViewTransition.

• Improvement: Fabric Priorities Mapping 📊

  • We've expanded the mapping of event priorities between Fabric and the React reconciler to include a broader range of priorities.

• Improvement: Inline Preamble Contribution 📜

  • Preamble contributions are now emitted earlier in the render phase, enhancing rendering efficiency.

• Bugfix: Correct Type in getTypeSymbol 🐛

  • The getTypeSymbol function now correctly includes string as a return type, improving type handling.

• Bugfix: Fix measure Error in Performance API ⏲️

  • Addressed an error in the measure function related to startTime, preventing incorrect logging during component rendering.

• Bugfix: Safari display: inline Workaround 🐞

  • Introduced a workaround for a Safari bug involving view-transition-name, with automatic style adjustments to prevent duplicate name errors.

These updates are set to make your React development smoother and more efficient, while also enhancing the performance and compatibility of your applications. Happy coding! 🚀

Hey there, React enthusiasts! We've got some exciting updates and fixes coming your way. Here's a rundown of the latest and greatest changes to keep your development experience smooth and your apps running like a dream. Check it out! 🚀

• New feature: Added support for the satisfies operator in the babel-plugin-react-compiler. This enhancement boosts TypeScript capabilities, making it easier to handle type annotations and expressions. 🎉

• New feature: Updated the changelog for version 19.1.0, featuring the shiny new "Owner Stack" for better debugging and error overlays. This is a game-changer for understanding component relationships during development. 🛠️

• Improvement: Introduced logging for component lifecycle events like mounting, unmounting, reconnecting, and disconnecting. This makes tracking performance across various React lifecycle phases a breeze. 🌟

• New feature: Say hello to startGestureTransition, a new API replacing useSwipeTransition. It offers a more flexible and unified approach to handling gestures and transitions. Swipe away! 👋

• New feature: React DevTools now displays native tags for Native Host components. Hover over a badge to see the magic and identify native components with ease. 🔍

• Bugfix: Fixed an issue during snapshotting when errors occurred due to duplicate names in the "old" state. Now, the system continues through phases to maintain consistency. 🐛

• Improvement: Enhanced handling of host instances in persistent mode by releasing old instances and acquiring new ones when clones are created. This boosts the reliability and performance of React DevTools. ⚙️

• Improvement: Adjusted animation ranges in View Transitions based on duration and delay, ensuring smoother synchronization and a better user experience. 🎥

• Bugfix: Resolved bugs in performance tracking for effects, ensuring accurate logging of component effects even when children are involved. 📈

• Bugfix: Fixed test filter and watch mode issues by updating the file watcher to monitor the correct directory. Testing just got smoother! 🧪

• Chore: Tidied up the changelog by ensuring consistent spelling of "Owner Stack" and "Component Stack". Keeping it clean and professional! 📝

That's all for now, folks! Keep coding, keep creating, and stay tuned for more updates. Happy Reacting! 🌈

Hey there, awesome devs! 🎉 We've been busy making some cool changes to enhance your coding experience. Here's a fun rundown of the latest updates and fixes we've rolled out. Dive in and see what's new! 🚀

• New Feature: We've introduced an "auto" class in React's ViewTransition system. This lets you specify that the built-in animation should be used for transitions. Now, you can set <ViewTransition default="foo" enter="auto"> for more flexible transition control. 🎨

• New Feature: Say hello to getRootNode(options) for fragment instances! This nifty method now lets fragments return the root node of their parent, making DOM interactions smoother and more intuitive. 🌳

• New Feature: Need to grab some styles? The getComputedStyle helper is now part of the ViewTransitionPseudoElement class. It's perfect for accessing styles without animations getting in the way. 💅

• New Feature: We've added artifact integrity verification to our download process. This ensures that the artifacts you download match the build attestations, keeping everything secure and reliable. 🔒

• New Feature: Introducing Effect.ConditionallyMutateIterator to our compiler! It captures known arrays, maps, and sets, while allowing mutations for other values, improving performance and correctness. 🔄

• Improvement: Our compiler now recognizes function constructors with an isConstructor: boolean property. Plus, Map and Set globals are now built-in, enhancing type handling and performance. 🛠️

• Improvement: We've scoped permissions for all workflows, ensuring they only operate with necessary permissions. This boosts security and clarity in our CI/CD pipeline. 🔐

• Bugfix: Fixed a bug in the React compiler that optimizes components with arrow functions and implicit returns. This resolves issues with return type identification, enhancing compilation efficiency. 🐞

• Improvement: Now, when there's an "enter" animation, shouldStartViewTransition is marked as true. This ensures those cool transitions animate even without other updates. ✨

• Bugfix: We've fixed the hoisting of let declarations in the React compiler, preventing duplicate declarations and errors. Your code stays clean and error-free! 🧹

• Bugfix: Notifications and labels for forks are now working smoothly in PRs. We've ensured these actions run safely from the target repository. 🔔

• Chore: Added missing permissions to runtime_commit_artifacts.yml, allowing write access to contents. This keeps our artifact commits running smoothly. 📦

That's all for now, folks! Keep coding, keep creating, and stay awesome! 😎

Hey there, React enthusiasts! We've got a bunch of exciting updates and some nifty bug fixes to share with you. Let's dive into the latest changes that are sure to enhance your development experience. 🚀

• New feature: We've added focusLast() and blur() to fragment instances, along with extending the existing focus() method to accept options. This means you can now manage focus more effectively within fragment instances, focusing on the first or last focusable element or blurring an element if it's currently focused. 🎯

• Improvement: We've separated the Activity element type from Offscreen to allow better boundary semantics during hydration. This change enhances the performance and user experience without affecting Offscreen behavior in suspended children. 🎨

• New feature: A new validation feature has been introduced to prevent dynamic component creation during render, helping you avoid unintended state resets. This validation is off by default but aims to catch obvious mistakes, ensuring your components are stable and predictable. 🔍

• New feature: The getClientRects() method is now available for fragment instances, allowing you to retrieve bounding boxes of child elements, making it easier to interact with fragments. 📏

• Improvement: We've updated the React compiler to support numeric literals as valid object property keys, expanding the flexibility of property key handling. 🔢

• New feature: Fragment refs are now enabled in an experimental capacity, allowing for testing in the Next.js router when other experimental features are active. 🧪

• New feature: The GitHub Actions workflow now supports parameterizing branch cleanup with a PR number input, making cache management more flexible and efficient. 🧹

• Improvement: We've improved security by replacing third-party actions with direct Git commands in our CI/CD pipeline. A dry_run option has been added for testing workflows without pushing changes. 🔒

• Bugfix: We've fixed ID duplication issues in ViewTransition components, ensuring unique identifiers for nested transitions, preventing naming conflicts. 🛠️

• Chore: The Discord webhook action in our workflows is now pinned to a specific commit SHA, providing more stability and reliability. 📌

• Bugfix: The COMMIT_SHA artifact in GitHub Actions is now set to reflect the original commit SHA, improving the accuracy of sizebot links. 🔗

• Bugfix: We've corrected the component name handling for Portals and added tests for built-in components using React.lazy, ensuring accurate error messages and better functionality. 🧩

We hope these updates make your React development journey a bit smoother and more enjoyable. Keep building awesome stuff! 🎉

This update brings a bunch of exciting enhancements and fixes to keep your React projects running smoothly and efficiently! 🎉 Here's a rundown of what's new and improved:

• New Feature: Merging React Compiler Rule
  We've merged the react-compiler rule into the eslint-plugin-react-hooks, keeping commit history intact while adding new dependencies. This is a major change, so keep an eye out for the next big release! 🚀

• New Feature: DOM Fixture for Fragment Refs
  Test Fragment References with our new DOM fixture page! Check out how addEventListener and removeEventListener work with Fragments and get those event listeners dancing. 🕺

• New Feature: Ref Support for Fragments
  Fragments just got cooler! Now they can accept a ref prop, allowing you to attach event listeners and manage groups of elements with ease. This experimental feature is ready for your feedback. 🌟

• Improvement: Dynamic renameElementSymbol
  We've made renameElementSymbol more dynamic for native Facebook, improving the flexibility of feature management. No more static declarations! 🔄

• Bugfix: Child Node Checks for moveBefore
  Fixed a critical issue with moveBefore by ensuring nodes are connected before moving them. This prevents errors during initial insertions. ⚠️

• Improvement: Enhanced Error Logging
  We've improved error handling for startViewTransition, providing clearer insights into errors during development while keeping production logs clean. 🛠️

• Bugfix: Server Reference and .bind() Compatibility
  Ensured registerServerReference works seamlessly with .bind(), maintaining compatibility and preventing errors. 🔗

• New Feature: Prebuild Commands with Rollup
  Introducing a prebuild option for Rollup, allowing you to run commands before building your bundle. Perfect for complex build requirements! 🛠️

• New Feature: Experimental moveBefore
  We've enabled moveBefore in experimental releases, letting you test this feature while we gather feedback. 🧪

• Bugfix: Canceling Animations in View Transitions
  Prevent pesky animation flashes by manually canceling finished view transition animations. Safari users, rejoice! 🎬

• Improvement: Compiler Migration to tsup
  We've migrated our compiler packages to tsup, improving build performance and enabling type declaration generation. Fast and efficient! ⚡

• Chore: Prettier Formatting
  Ran Prettier on eslint-plugin-react-compiler/src/types for cleaner, more consistent code. Because neat code is happy code! ✨

These updates are designed to enhance your development experience and keep your projects in tip-top shape. Dive in and explore the new features and improvements! 🌟

Hey there, code enthusiasts! Here's the latest scoop on what's been cooking in the React kitchen. 🍳 From swipe-tastic transitions to server reference wizardry, we've got some nifty updates to make your coding journey smoother and more exciting. Let's dive into the changelog! 🚀

New Features & Improvements

• Swipe Gesture Magic: We've enhanced the useSwipeTransition feature to keep your current state live during swipe gestures. This means you can keep watching that cat video while swiping! 🐱✨ By rendering a clone offscreen and animating it onscreen, we ensure smooth transitions without flickering. Perfect for those TikTok-like experiences!

• Server Reference Sorcery: Introducing registerServerReference for client builds in React Flight. This nifty function lets you register server references seamlessly, even when using the serverModuleMap option. Now your server references can travel back and forth like seasoned jet-setters! 🌍✈️

• Node.js Version Upgrade: Heads up! The eslint-plugin-react-hooks now requires Node.js version 18 or higher. This change preps us for merging the compiler plugin and marks a breaking change for users on older Node versions. Time to upgrade for smoother sailing! ⛵️

• Dialog Event Support: We've added support for beforetoggle and toggle events in dialog elements. This means more interactive and responsive dialog components, enhancing user experience! 💬🔄

• Safari ScrollEnd Polyfill: Safari users, rejoice! We've polyfilled the onScrollEnd event to work like a charm in Safari, ensuring consistent behavior across browsers. Now you can scroll to your heart's content without missing a beat! 🍃

• Dynamic Feature Flags: We've made the enableScrollEndPolyfill flag dynamic, allowing for easier testing and deployment of experimental features. Flexibility is key! 🔑

• View-Transition Build Shorthand: For those frequently testing the view-transition fixture, we've added a shorthand command to speed up the build process. Less waiting, more coding! ⏩

• Flat Config for ESLint: The recommended config now points to the flat config in eslint-plugin-react-hooks, simplifying your setup. The legacy config is still available, but the future is flat! 📚

Bug Fixes & Chores

• CI Workflow Accuracy: Fixed an issue where failures were being marked as successes in GitHub Actions. Now, failures will be reported correctly, ensuring accurate test results. No more false positives! ✔️

• Discord Notification Tweak: Improved the Discord notification title in our CI workflow to ensure clarity and accuracy. Your notifications just got a little more precise! 🎯

• Cleanup: We've removed an unused netlify.toml file, keeping our codebase tidy and clutter-free. Less is more! 🧹

That's all for now, folks! Keep coding, stay curious, and enjoy these updates. Until next time, happy hacking! 💻✨

Hey there, fellow React enthusiasts! 🎉 We've got some exciting updates and fixes coming your way. From improvements in rendering and bundling to new features for React Native, here's a rundown of what's new and improved in our latest update. Let's dive in!

• New Feature: React Native Document Instances 📝 We've added support for Document instances in React Native, known as ReactNativeDocument instances. This change enhances the React Fabric renderer to manage these instances, making it easier for React Native to access them using container or root tags. It's a step forward in integrating document instances within the React Native framework.

• Improvement: Suspense Boundaries in Fiber 🚀 Suspense boundaries can now be rendered at any level within a react-dom application, thanks to an update to Fiber. This enhancement treats the document body as the default render scope, offering more flexibility in rendering Suspense components. Note that hydration isn't supported yet, so Fizz and Fiber aren't fully unified just yet.

• Improvement: Import Maps in React Flight Parcel 📦 We've enhanced the React Flight Parcel bundler by enabling import maps to be passed through client references. This update addresses the limitations of native import maps in client-side navigation scenarios, improving caching strategies and optimizing the performance of React applications using Parcel.

• Improvement: Parallel DevTools Builds ⚙️ Our CI process just got a speed boost! We've parallelized the build process for React DevTools, reducing the CI job runtime. By building DevTools simultaneously for Chrome, Firefox, and Edge, we're streamlining development and getting faster feedback cycles.

• Bugfix: React Compiler Healthcheck Script 🐞 We've fixed an issue with the react-compiler-healthcheck script by adding a shebang. This resolves execution problems with npx, allowing the script to run smoothly and compile components without a hitch.

• Bugfix: Removal of Unused Rust Port 🛠️ We've cleaned up by removing an unused experimental Rust port of the React Compiler. While the experiment showed promise, we're sticking with JavaScript for the React Compiler, focusing on lightweight native wrappers and collaboration with the Hermes team.

• Chore: Maintainers Update 🔧 Our MAINTAINERS file got a refresh! We've added a new maintainer, "unstubbable," and removed some old entries. This update keeps our contributor list accurate and up-to-date.

• Bugfix: Typo Correction in CI ✏️ A small typo in the GitHub Actions workflow file has been fixed, ensuring error messages are clear and correctly formatted.

We hope these updates make your React experience even better! Keep building, and stay tuned for more improvements. Happy coding! 🌟

Here's a delightful update on the latest changes and improvements that have been made:

• New feature: Transition Types 🎉 - We've rolled out an isomorphic API for adding Transition Types, primarily for enhancing View Transitions. This allows you to specify transition causes, making animations even cooler and more context-aware. You can now use CSS, class-based styling, or event callbacks to control animations based on transition types. Future updates might even let you use these types with useEffect for even broader applications.

• Bugfix: JSXText with Brackets 🐛🔧 - We've squashed a bug in the React compiler where JSXText was misbehaving with brackets. The fix ensures that JSX text is correctly rendered, even when it includes {pageNumber} within a JSX element. LlamaIndex users, rejoice! Your product is no longer blocked.

• Improvement: DevTools and Experimental Hooks 🔍 - DevTools now supports the experimental_useEffectEvent hook, making it easier for developers to inspect this experimental feature. Plus, we've streamlined the handling of the experimental prefix, replacing the old unstable_ prefix.

• Bugfix: Array.map Type Annotation 🔄 - We've corrected the type annotation for Array.map in the React compiler. The update ensures that mutating effects of functions are correctly handled, leading to more reliable outcomes in React apps.

• Improvement: ESLint Flat Plugin Syntax 📏 - Our eslint-plugin-react-compiler now supports the flat plugin syntax for ESLint 8+, aligning with the latest ESLint configuration styles. This makes it easier to configure and use, with updated documentation to guide you along.

• Bugfix: JSX Escape Sequences in Babel 🧙‍♂️ - We've improved the handling of JSX escape sequences in the Babel generator. Strings with potential escape characters are now correctly parsed, enhancing the robustness of JSX code generation.

• New feature: Impure Function Validation 🚫 - A new validation feature has been added to reject calls to impure functions during rendering. While initially off by default, this is a step towards ensuring cleaner, more predictable code.

• Chore: Test Organization 📂 - We've tidied up by moving effect dependency inference tests to a dedicated directory. This makes it easier to see related tests and improves project organization.

These updates are sure to enhance your React development experience, making your applications smoother, more efficient, and easier to debug. Keep pushing those boundaries! 🚀

Here's a rundown of the latest updates and improvements. Get ready to dive into some exciting new features and essential fixes! 🚀

New Features:

• View Transition Refs (#32038): We've introduced ViewTransitionRef objects, giving developers more control over animations. These refs allow you to programmatically manage animations for view transitions, offering an alternative to CSS-based animations. While it doesn't yet support SSR, this feature is a big step toward more dynamic transitions. 🎥

• View Transition Events (#32041): Say hello to five new events for <ViewTransition>. These events (onEnter, onExit, onLayout, onShare, onUpdate) provide hooks for specific moments in the transition lifecycle, allowing for more precise animation control. Each event receives a ViewTransitionInstance, so you can animate without needing a ref. 🎉

• View Transition Class Names (#32050): Now you can apply specific class names based on the transition event kind. This update adds five props (enter, exit, layout, share, update) to <ViewTransition>, making it easier to tailor animations to your needs. Plus, the "none" value lets you opt-out of certain transitions for finer control. 🎨

• ESLint Plugin React Hooks Enhancement (#30774): We've added support for flat configuration in eslint-plugin-react-hooks, making it easier to integrate with ESLint 9.0.0 and above. This update simplifies configuration and maintains compatibility with older ESLint versions. 🔧

• Automatic PR Labeling (#32100): Introducing a MAINTAINERS file to document core team members and automatically label PRs from them, improving workflow and transparency. 🏷️

Improvements:

• Restore useMemoCache (#32067): We've enhanced caching capabilities by restoring useMemoCache in renderers that support Client APIs, boosting performance and efficiency. 🛠️

• Reduce Nullable Hooks Risk (#32068): Enhancements to the Dispatcher ensure certain hooks are non-nullable, reducing potential runtime errors and improving type safety. 🔒

• Console Forks Removal Flag (#32058): A new feature flag allows for the removal of console-related warnings and errors, enhancing the developer experience by reducing noise during development. 📉

Bug Fixes:

• DevTools Profiling Sessions (#32066): Fixed an issue causing DevTools to freeze during consecutive profiling sessions by clearing existing profiling data before starting a new session. No more infinite loops! 🔄

• Compiler Edge Case (#32055): Resolved an edge case in the React compiler related to object methods, ensuring smoother compilation with compilationMode: infer. 🛠️

• DevTools useResourceEffect Support (#32088): Added missing support for the useResourceEffect hook in React DevTools, preventing errors and improving stability. 📈

Chores:

• Remove batchedUpdate Usage (#32074): Refactored DevTools to eliminate the now no-op batchedUpdates function, streamlining code for concurrent mode. 🧹

Stay tuned for more updates, and enjoy these new capabilities and improvements! 🌟

Hey there, React fans! We've been busy making some exciting updates and improvements to the React framework. Check out the latest changes that are sure to enhance your development experience and bring some extra pizzazz to your projects! 🚀✨

• New feature: The React Fiber architecture now supports View Transitions v2, with a focus on using View Transition Classes and Types. This ensures that animations are only triggered if the browser supports the necessary features, providing a more consistent user experience across different platforms. 🌟

• New feature: Navigation support has been added to the View Transition fixture, utilizing both history.pushState/popstate and the Navigation API. This enhances the synchronization of navigation transitions and scroll restoration, improving the overall user experience. 🧭

• New feature: Introducing the <ViewTransition> component! This nifty addition allows you to animate changes between UI states during asynchronous updates, making your apps look smooth and delightful. 🎨

• New feature: You can now style your View Transitions using the className prop on the <ViewTransition> component, enabling reusable and composable styling. CSS Modules are fully compatible, making it easy to maintain unique namespaces for your transition styles. 🎨

• New feature: A new GitHub Actions workflow has been introduced to send notifications to Discord when a pull request is labeled with "React Core Team," ensuring important updates don't go unnoticed. 🔔

• Improvement: The React DOM testing framework has been enhanced with more assert helpers, improving the consistency and effectiveness of testing practices across various components. 🛠️

• Improvement: The RefStatic and LayoutStatic flags in the React reconciler have been unified, simplifying the handling of offscreen content and enhancing the efficiency of the rendering process. ⚡

• Chore: The display of component names during tracing in React DevTools is now enabled by default, making debugging more informative and straightforward. 🕵️‍♂️

• New feature: The ViewTransitionComponent has been added to React DevTools, ensuring it is recognized and can be visually distinguished within the development tools. 🔍

• Bugfix: Fixed a scrolling issue in the React DevTools tree view, ensuring scrolling to an item only occurs when the components panel is visible, improving the user experience. 🐛

• Bugfix: Addressed a warning issue related to empty string href attributes during hydration, streamlining attribute handling for various HTML elements. 🔧

• Bugfix: The react-compiler-runtime package now consistently outputs in CommonJS format, enhancing compatibility and simplifying module handling for developers. 📦

Stay tuned for more updates as we continue to improve and expand React's capabilities. Happy coding! 🎉

Here's the latest scoop on the updates and improvements made to our codebase! We've been busy enhancing performance, fixing bugs, and streamlining processes to make everything run smoother and faster. Let's dive into the details of the most significant changes:

New Feature: Profiler Mode for Fixtures 🎉

We've simplified the component-level profiling process by adding a Profiler mode to fixtures, no longer requiring React DevTools installation. This change resolves previous inconsistencies and lets developers easily access performance insights by wrapping main application components within a Profiler component in the hydrateRoot calls. Say goodbye to confusion and hello to a streamlined profiling setup!

Improvement: Parcel Flight Client Enhancement 🚀

The Parcel Flight client now includes the prepareDestinationForModule function, ensuring components dynamically imported during rendering are preloaded effectively. The <Resources> component now inserts only <link> elements for stylesheets, leaving scripts to React. This change helps prevent Flash of Unstyled Content (FOUC) and opens up discussions for future improvements in resource management.

Improvement: Compiler Bundler Switch to esbuild 🛠️

We've switched the compiler's bundler from Rollup to esbuild, drastically reducing build times from 75 seconds to under 10 seconds! This change optimizes the build process for Node.js environments, making our development workflow more efficient. Out with the old, in with the new—esbuild is here to stay!

New Feature: Yield Every Other Frame for Transition/Retry Work 🎨

To improve performance during transitions and retries, we've introduced a new scheduling mechanism that yields every 25ms. This change helps prevent animations from hogging CPU time, ensuring smoother transitions and a more responsive user interface. While currently disabled by default, this feature represents a strategic move towards optimizing React's rendering performance.

Bugfix: DevTools Compiler Integration Test 🐛

We've fixed a pesky bug in the DevTools integration test related to version handling, specifically addressing a TypeError: Invalid Version: 19. The updated version condition in our script now correctly processes the version range, allowing the integration tests to run smoothly without any version validation hiccups.

Chore: ReactDOMFloat Test Refactor 🧹

We've split the ReactDOMFloat testing into its own pull request to better manage its complexity. This refactor enhances the clarity and maintainability of our tests, allowing for more focused reviews and discussions. It's all about keeping things organized and efficient!

These updates reflect our ongoing commitment to improving performance, enhancing user experience, and maintaining high-quality code standards. Stay tuned for more exciting developments!

Hey there, code wizards! We've been busy brewing up some magical improvements and fixes in the React compiler. Here's what's new and improved in our latest update! 🚀✨

• New Feature: Magical Fire Imports 🔥
  We've added an experimental feature that automatically sprinkles in import { useFire } from 'react' whenever you use the mystical "fire" syntax. This is still in the cauldron, bubbling away, and might not make it to the final potion, but it’s a step towards making your coding spells more powerful!

• Improvement: Cast Those Types Like a Pro! 🪄
  The compiler now gracefully handles type cast expressions with references, eliminating those pesky false positives when a ref-accessing function is placed inside a type-cast array. Your type-casting magic just got a whole lot smoother!

• Improvement: Keep Your Fires Inside! 🔥🏠
  We've tightened the rules to ensure that all fire calls are safely tucked inside effect lambdas. This prevents any rogue fires from causing chaos in your code. Plus, we've corrected the import path to keep everything neat and tidy.

• Improvement: Rewriting the Rules of Fire 🔄
  When using fire in effect dependency arrays, we now ensure they’re literal arrays. This rewrite ensures your spells are precise and error-free, giving you clear feedback if things go astray.

• Bugfix: Fixing the Fire Snap 🔧🔥
  We’ve fixed a broken snapshot related to the fire function, ensuring your useEffect hooks are structured correctly and work like a charm. No more compilation errors to worry about!

• Bugfix: Yielding No More 🚫🛠️
  The enableYieldingBeforePassive feature has been turned off in internal test renderers, due to some hiccups on the React Native side. This is a temporary fix, ensuring smooth sailing while we iron out the kinks.

• Chore: Cleaning Up the Unused Spells 🧹
  We’ve removed the unused toWarnDev function from the testing fixtures. It was just gathering dust, so we’ve tidied up to keep our codebase sparkling clean.

That’s it for now, folks! Keep coding, keep creating, and may your React adventures be nothing short of magical! 🧙‍♂️✨

Hey there, React fans! 🎉 We've got some exciting updates that are sure to make your hydration processes smoother than ever. Let's dive into what's new:

• New Feature: Hydration Lanes in Action 🚀
  We've revamped how hydration work is scheduled by using Hydration Lanes instead of raw update lanes. This means no more random hydration mixing with other updates! Now, when you initiate root hydration or use unstable_scheduleHydration, it's all handled through the right lanes. This change prevents unnecessary client rendering during hydration, ensuring a smoother and more efficient process.

• Bugfix: No More Unwanted Client Rendering 🐛
  Updating a root while it's still hydrating used to cause some hiccups, like triggering client rendering when it wasn't needed. With our new approach, updates apply after hydration, sidestepping any potential mix-ups and keeping things running like a well-oiled machine.

• Performance Boost: Streamlined Hydration and Updates ⚡
  We've tackled potential performance issues by ensuring that unstable_scheduleHydration doesn't get tangled with updates that might force a rewind. Now, hydration starts cleanly without unnecessary updates, making your app snappier and more reliable.

• Safety First: Feature Flag Added 🔒
  We've introduced a kill switch, enableHydrationLaneScheduling, for those who love to experiment but want a safety net. It's all about giving you control while keeping things safe, especially since these scenarios are pretty rare.

With these improvements, your React apps are set to hydrate like never before. Happy coding! 🌟

Hey there, code adventurers! We've got some exciting updates and bug squashes in our latest changelog. Dive in to see what's new and improved in the world of React! 🚀

• New feature: Say hello to the react-server-dom-parcel-package! This shiny new package integrates React Server Components (RSC) with the Parcel bundler, making your life easier by combining client and server modules into a single graph. No more separate manifest files, and CSS gets combined automatically! Plus, a special <Resources> component is generated to handle scripts and stylesheets. 🎉

• Improvement: We've enhanced the scheduling of hydration work by using Hydration Lanes. This ensures hydration tasks don't mix with other updates, preventing unnecessary client rendering. A new feature flag, enableHydrationLaneScheduling, lets you experiment with this approach safely. 💧

• Improvement: The enableOwnerStacks feature is now dynamic! This means you can toggle it on or off during development, giving you more control over captureOwnerStack behavior. We've updated tests to reflect this change, ensuring accurate console error messages based on the flag's state. 🔄

• Improvement: Our compiler now supports non-declaration initializations in for...of and for...in loops. This enhancement allows for more complex patterns without hitting error states, making your code more flexible and robust. 🛠️

• Bugfix: Fixed a pesky issue where refs were being dropped when using spread properties in JSX. Now, both the ref and spread properties are combined correctly in the output, ensuring your components work as intended. 🐛

• New feature: The react-server-dom-parcel package is going public! We've removed the "private" attribute, paving the way for broader access and integration into meta-frameworks. 🌐

• Bugfix: We've fixed the canary version strings by reverting the canaryChannelLabel back to 'canary'. This ensures correct version names and tags after the stable release of version 19. 📦

• Chore: Updated version numbers for prerelease channels, including canary and experimental versions. This keeps everything in sync and up-to-date with the latest improvements and fixes. 🔢

That's all for now, folks! Keep coding and stay tuned for more awesome updates. Happy hacking! 💻✨

Welcome to the latest React updates, where we've been busy making things smoother, faster, and just all-around better! 🚀 Let's dive into the highlights:

New feature

• Meta Magic! We've added a shiny new target option, target: 'donotuse_meta_internal', specifically for Meta bundles. This allows for direct imports of useMemoCache from the react package, making life easier for Meta applications by ensuring compatibility and up-to-date React features. 🎉

Improvement

• Suspense No More! We've tackled an issue with Suspense boundaries during server-side rendering (SSR). Now, if the server stream is incomplete, React will schedule client renders for any unfinished Suspense boundaries once the document fully loads. This ensures your app doesn't get stuck in a fallback state. 🛠️

• Default Imports Delight: The React compiler now supports default imports in the autodependency config. This means you can smoothly import functions like import useWrapperEffect from 'useWrapperEffect', making dependency management a breeze. 🌬️

• Refine those Refs: We've improved the React compiler by skipping .current field accesses in inferred dependency arrays. This change helps avoid incorrect dependency tracking, enhancing the reliability of your effect hooks. 🔧

Bugfix

• Typo Tidy-Up: We've fixed a couple of typos in the CHANGELOG.md, ensuring clarity and professionalism in our documentation. Because every letter counts! 📝

• Back to Basics: A previous update to eslint-plugin-react-compiler has been reverted due to compatibility issues with older Babel versions. This ensures that older codebases can continue to function without hiccups. 🔄

These updates reflect our ongoing commitment to improving React's performance and developer experience. Keep coding, and enjoy the new features and fixes! 🎈