🎬 SuspenseList Updates
The new
• A tail="collapsed" option.
• A warning, when single items are used.
• And various other optimizations.
The new
<SuspenseList /> component to coordinate the loading sequence of nested suspense boundaries now comes with:• A tail="collapsed" option.
• A warning, when single items are used.
• And various other optimizations.
⏳ Scheduler: Allow Inferring Priority from Stack
To help finding out at what priority level specific tasks are enqueued, the call stack now wraps every priority inside an additional function call.
https://github.com/facebook/react/pull/16105
To help finding out at what priority level specific tasks are enqueued, the call stack now wraps every priority inside an additional function call.
https://github.com/facebook/react/pull/16105
🧪 Allow Nested
Multiple renders can now operate inside a single
https://github.com/facebook/react/pull/16039
act()s from Different RenderersMultiple renders can now operate inside a single
act() scope. This allows for e.g. using ReactDOM.render inside another component tree.https://github.com/facebook/react/pull/16039
🎇 React Flare Updates
• Capture Phase Flare events were removed.
• Support for currentTarget was added and later changed to responderTarget.
• Press events now include a button type.
• The Scroll responder now has more functionality.
• Capture Phase Flare events were removed.
• Support for currentTarget was added and later changed to responderTarget.
• Press events now include a button type.
• The Scroll responder now has more functionality.
🧯 Remove React Fire Fork
The unused React Fire fork was removed. Instead, the team is focusing on React Flare. Check out Dan’s reply to the React Fire announcement for more information.
https://github.com/facebook/react/pull/16046
The unused React Fire fork was removed. Instead, the team is focusing on React Flare. Check out Dan’s reply to the React Fire announcement for more information.
https://github.com/facebook/react/pull/16046
👚 Fabric: Add
The Fabric React Native renderer now has a
https://github.com/facebook/react/pull/16085
dispatchCommandThe Fabric React Native renderer now has a
dispatchCommand export.https://github.com/facebook/react/pull/16085
⚠️ Change Warning for Unacted Effects
A warning is now only issued for unacted effects inside strict and non-sync modes.
https://github.com/facebook/react/pull/16041
A warning is now only issued for unacted effects inside strict and non-sync modes.
https://github.com/facebook/react/pull/16041
How using component-based design helps us build faster
This post breaks down how using a component-based design (which includes React) has helped Twitter build across all platforms.
This post breaks down how using a component-based design (which includes React) has helped Twitter build across all platforms.
How I ruined my application performances by using React context instead of Redux
Georges used React contexts instead of Redux for centralized states. Without a selector system, his components where getting lots of data as props, some of them were often changing and not necessary to build the view. This post is how he fixed it.
Georges used React contexts instead of Redux for centralized states. Without a selector system, his components where getting lots of data as props, some of them were often changing and not necessary to build the view. This post is how he fixed it.
Concurrent Mode explained
Is Concurrent Mode just a workaround for “virtual DOM diffing” overhead? In this Twitter thread, Dan breaks it down.
Is Concurrent Mode just a workaround for “virtual DOM diffing” overhead? In this Twitter thread, Dan breaks it down.
Authenticated Routing with React, React Router, Redux & TypeScript
In this post, Fred shares how they went about authentication at Octopus Wealth utilising react-router-dom, react-redux & TypeScript.
In this post, Fred shares how they went about authentication at Octopus Wealth utilising react-router-dom, react-redux & TypeScript.
Build your own React
How does React really work? In this talk, you'll find out. You'll write a simplified version of React from scratch, based on the real source code, including: jsx, fibers, reconciliation, hooks, and more.
How does React really work? In this talk, you'll find out. You'll write a simplified version of React from scratch, based on the real source code, including: jsx, fibers, reconciliation, hooks, and more.
A Deep Dive into React-Redux
Redux and React are frequently used together, and many people are familiar with the "Provider" and "connect" APIs from React-Redux. But how does React-Redux work, and why do we even need it in the first place? Join Redux maintainer Mark Erikson on a journey through the history and internals of React-Redux.
Redux and React are frequently used together, and many people are familiar with the "Provider" and "connect" APIs from React-Redux. But how does React-Redux work, and why do we even need it in the first place? Join Redux maintainer Mark Erikson on a journey through the history and internals of React-Redux.
📌 useSubnoscription Hook
Similar to the
https://github.com/facebook/react/pull/15022
Similar to the
createSubnoscription helper, the React team now maintains a useSubnoscription hook.https://github.com/facebook/react/pull/15022
🎇 React Flare Updates
• 🔥 Redesign Core Event System
• Keyboard Responder
• Input Responder
• FocusWithin Responder
• 🔥 Redesign Core Event System
• Keyboard Responder
• Input Responder
• FocusWithin Responder
🎬 SuspenseList: tail="hidden"
A new
https://github.com/facebook/react/pull/16024
A new
tail="hidden" option was added to SuspenseList that hides all rows in the tail.https://github.com/facebook/react/pull/16024
🛠 DevTools: Automatic Component Stacks
The upcoming DevTools v4 release will add an option to append a component stack when warnings or errors are logged.
https://twitter.com/brian_d_vaughn/status/1151552058731847680
The upcoming DevTools v4 release will add an option to append a component stack when warnings or errors are logged.
https://twitter.com/brian_d_vaughn/status/1151552058731847680
🦄 Unify Deprecated/Unsafe Lifecycle Warnings
This PR reworks some of the messages behind the deprecated or unsafe lifecycle warnings.
https://github.com/facebook/react/pull/16103
This PR reworks some of the messages behind the deprecated or unsafe lifecycle warnings.
https://github.com/facebook/react/pull/16103
🌀 Add suspenseCallback for Runtime Tracing of Loading States
When the new feature flag is enabled, the
https://github.com/facebook/react/pull/16134
When the new feature flag is enabled, the
suspenseCallback property on a suspense boundary will be called during the commit phase.https://github.com/facebook/react/pull/16134
⚠️ Warn When Using DefaultProps on Function Component
This change adds a warning when using
https://github.com/facebook/react/pull/16210
This change adds a warning when using
defaultProps on a function component as part of the createElement changes.https://github.com/facebook/react/pull/16210