🎉 Create React App 2.0
This week, Create React App 2.0 was released bringing a year’s worth of improvements with it. Most notably support for SASS and Babel 7.
https://github.com/reactjs/reactjs.org/pull/1215
This week, Create React App 2.0 was released bringing a year’s worth of improvements with it. Most notably support for SASS and Babel 7.
https://github.com/reactjs/reactjs.org/pull/1215
GitHub
Create React App v2 Blog Post by Timer · Pull Request #1215 · reactjs/reactjs.org
Adds a blog post summarizing the changes and improvements made in Create React App v2.
👀 React Conf Speaker Update
React Conf 2018 is only three weeks ahead. This week, the final list of speakers was released! If you don’t have the chance to attend, join me in watching the live stream.
https://conf.reactjs.org/speakers.html
React Conf 2018 is only three weeks ahead. This week, the final list of speakers was released! If you don’t have the chance to attend, join me in watching the live stream.
https://conf.reactjs.org/speakers.html
conf.reactjs.org
Speakers / React Conf 2019
This year's conference features fresh faces and experienced presenters.
🃏 A Jest Helper for Concurrent Tests
The React team discovered a couple of repeating patterns while improving test harness of concurrent React. To make it easier for you, test helpers will be made public as the jest-react package.
https://github.com/facebook/react/pull/13751
The React team discovered a couple of repeating patterns while improving test harness of concurrent React. To make it easier for you, test helpers will be made public as the jest-react package.
https://github.com/facebook/react/pull/13751
GitHub
Jest + test renderer helpers for concurrent mode by acdlite · Pull Request #13751 · facebook/react
Most of our concurrent React tests use the noop renderer. But most of those tests don't test the renderer API, and could instead be written with the test renderer. We should switch to using the...
📝 Making React Docs Even Better
Special shout-out to Dustin Schau (DSchau) for landing multiple commits that are improving the official React documentation. A great documentation is vital to us and we are more than happy for the help.
https://github.com/reactjs/reactjs.org/commits?author=DSchau
Special shout-out to Dustin Schau (DSchau) for landing multiple commits that are improving the official React documentation. A great documentation is vital to us and we are more than happy for the help.
https://github.com/reactjs/reactjs.org/commits?author=DSchau
GitHub
Commits · reactjs/react.dev
The React documentation website. Contribute to reactjs/react.dev development by creating an account on GitHub.
🤙 Functional → Function Component
Earlier this year Kyle Simpson (getify) started to raise concerns about the terminology used for functional components. To avoid further confusion, we’ll refer to them as function components from now on.
https://github.com/reactjs/reactjs.org/pull/863
Earlier this year Kyle Simpson (getify) started to raise concerns about the terminology used for functional components. To avoid further confusion, we’ll refer to them as function components from now on.
https://github.com/reactjs/reactjs.org/pull/863
GitHub
Rename "functional component" to "function component" by gaearon · Pull Request #863 · reactjs/reactjs.org
Related to discussion in https://mobile.twitter.com/getify/status/993127777057550336
Yay or nay?
Yay or nay?
📚 React Cache
We’re soon able to release the simple-cache-provider API as react-cache. Thanks to Marzio Superina (msuperina) for handing over the npm package. This API will be helpful when working with React Suspense.
https://github.com/facebook/react/pull/13755
We’re soon able to release the simple-cache-provider API as react-cache. Thanks to Marzio Superina (msuperina) for handing over the npm package. This API will be helpful when working with React Suspense.
https://github.com/facebook/react/pull/13755
GitHub
Rename simple-cache-provider to react-cache by acdlite · Pull Request #13755 · facebook/react
Thanks @msuperina for letting us have the name!
🎉 Enable Suspense
Suspense is no longer behind a feature flag and will likely be part of the next release. Additional changes also include updated API names.
https://github.com/facebook/react/pull/13799
Suspense is no longer behind a feature flag and will likely be part of the next release. Additional changes also include updated API names.
https://github.com/facebook/react/pull/13799
GitHub
Enable Suspense + rename Placeholder by gaearon · Pull Request #13799 · facebook/react
Removes client Suspense feature flag, it's now always on.
Renames now-exposed to .
Updates the fixture.
No whitespace:...
Renames now-exposed to .
Updates the fixture.
No whitespace:...
➡️ React.pure() Automatically Forwards Ref
React.pure(), a new HOC to enable PureComponent behavior on function components that was recently merged, now comes with forwardRef support built-in.
https://github.com/facebook/react/pull/13822
React.pure(), a new HOC to enable PureComponent behavior on function components that was recently merged, now comes with forwardRef support built-in.
https://github.com/facebook/react/pull/13822
GitHub
React.pure automatically forwards ref by sophiebits · Pull Request #13822 · facebook/react
We're not planning to encourage legacy context, and without this change, it's difficult to use pure+forwardRef together. We could special-case pure(forwardRef(...)) but this is hopefully si...
📱 Don’t Add onclick Listener to React Root
Thanks to an excellent bug report by Alexey Mikitevich (amikitevich) we were made aware of a recent regression in React DOM. If you’re into iOS Safari touch oddities, the bugfix PR is an interesting read.
https://github.com/facebook/react/pull/13778
Thanks to an excellent bug report by Alexey Mikitevich (amikitevich) we were made aware of a recent regression in React DOM. If you’re into iOS Safari touch oddities, the bugfix PR is an interesting read.
https://github.com/facebook/react/pull/13778
GitHub
Don’t add onclick listener to React root by philipp-spiess · Pull Request #13778 · facebook/react
Fixes #13777
As part of #11927 we introduced a regression by adding onclick handler to the React root. This causes the whole React tree to flash when tapped on iOS devices (for reasons I outlined i...
As part of #11927 we introduced a regression by adding onclick handler to the React root. This causes the whole React tree to flash when tapped on iOS devices (for reasons I outlined i...
⏱ Eagerly Schedule rAF at Beginning of Frame
The core team is working on perfecting the scheduler - one of the building blocks of React’s upcoming concurrent mode. It’s fascinating to see how the Scheduler improves over time.
https://github.com/facebook/react/pull/13785
The core team is working on perfecting the scheduler - one of the building blocks of React’s upcoming concurrent mode. It’s fascinating to see how the Scheduler improves over time.
https://github.com/facebook/react/pull/13785
GitHub
[scheduler] Eagerly schedule rAF at beginning of frame by acdlite · Pull Request #13785 · facebook/react
Eagerly schedule the next animation callback at the beginning of the frame. If the scheduler queue is not empty at the end of the frame, it will continue flushing inside that callback. If the queue...
🚫 Error Boundaries
In a recent Twitter discussion, the Core team shed some light on why it might be useful to rely on error boundaries even for the error handling of your non-React APIs.
https://twitter.com/sebmarkbage/status/1048574466282983424
In a recent Twitter discussion, the Core team shed some light on why it might be useful to rely on error boundaries even for the error handling of your non-React APIs.
https://twitter.com/sebmarkbage/status/1048574466282983424
Twitter
Sebastian Markbåge
@kentcdodds @ryanflorence @dan_abramov @MilosDzepina I bet if only half the APIs relies on error boundaries, you need to handle it with error boundaries anyway. Then double handling it will feel like a pain so the natural direction is for everything to converge…
🔥 RFC: React.pure()
The Core team filed an RFC for
https://github.com/reactjs/rfcs/pull/63
The Core team filed an RFC for
React.pure - an API that lets you bail out of updates from a function component, similar to React.PureComponent for classes.https://github.com/reactjs/rfcs/pull/63
GitHub
React.memo() by gaearon · Pull Request #63 · reactjs/rfcs
View formatted RFC
Note: I just wrote up the RFC. The semantics are designed by @sebmarkbage and @acdlite.
Note: I just wrote up the RFC. The semantics are designed by @sebmarkbage and @acdlite.
💥 RFC: React.lazy()
To make it easier to code split individual components in React, the new
https://github.com/reactjs/rfcs/pull/64
To make it easier to code split individual components in React, the new
React.lazy() API adds first-class support by embracing dynamic imports.https://github.com/reactjs/rfcs/pull/64
GitHub
React.lazy() by gaearon · Pull Request #64 · reactjs/rfcs
View formatted RFC
Note: I just wrote up the RFC. The semantics are designed by @sebmarkbage and @acdlite.
Note: I just wrote up the RFC. The semantics are designed by @sebmarkbage and @acdlite.
🚀 RFC: Static contextType
The address some of the problems with render props for the new Context API, the Core team is working on
https://github.com/reactjs/rfcs/pull/65
The address some of the problems with render props for the new Context API, the Core team is working on
static contextType as a new consuming mechanism. You can also look at the [preliminary documentation PR](https://github.com/reactjs/reactjs.org/pull/1265).https://github.com/reactjs/rfcs/pull/65
GitHub
Document class contextType as the primary consuming mechanism by sebmarkbage · Pull Request #1265 · reactjs/reactjs.org
facebook/react#13728
This documents the Class.contextType API.
The intention here is to document this as the primary way to consume a Context from a class, and since classes are still the mainstrea...
This documents the Class.contextType API.
The intention here is to document this as the primary way to consume a Context from a class, and since classes are still the mainstrea...
⚡️ RFC: shouldComponentRemount
Alex Krolick ([alexkrolick](https://github.com/alexkrolick)) published an RFC for
https://github.com/reactjs/rfcs/pull/62
Alex Krolick ([alexkrolick](https://github.com/alexkrolick)) published an RFC for
shouldComponentRemount, a new lifecycle method to control when React mounts and unmounts a component.https://github.com/reactjs/rfcs/pull/62
GitHub
alexkrolick - Overview
alexkrolick has 126 repositories available. Follow their code on GitHub.
⏱ Rename Priority Levels
The Core team also made small changes to some of the API names for the scheduler - one of the building blocks of React’s upcoming concurrent mode. The API is not final and we can expect an RFC soon.
https://github.com/facebook/react/pull/13842
The Core team also made small changes to some of the API names for the scheduler - one of the building blocks of React’s upcoming concurrent mode. The API is not final and we can expect an RFC soon.
https://github.com/facebook/react/pull/13842
GitHub
[scheduler] Rename priority levels by acdlite · Pull Request #13842 · facebook/react
"Interactive" -> "User-blocking"
"Whenever" -> "Idle"
These are the terms used by @spanicker in their main-thread scheduling proposal: https://github....
"Whenever" -> "Idle"
These are the terms used by @spanicker in their main-thread scheduling proposal: https://github....
🕵️♀️ Deprecate findDOMNode in StrictMode
In an attempt to make React applications easier to maintain, the Core team considers deprecating
https://github.com/facebook/react/pull/13841
In an attempt to make React applications easier to maintain, the Core team considers deprecating
findDOMNode. The current API is breaking abstraction levels which leads to refactoring hazard.https://github.com/facebook/react/pull/13841
GitHub
Deprecate findDOMNode in StrictMode by sebmarkbage · Pull Request #13841 · facebook/react
Motivation
The main motivation is that findDOMNode is breaking abstraction levels but allowing a parent to reason about what kind of children a component might render. It creates a refactoring haza...
The main motivation is that findDOMNode is breaking abstraction levels but allowing a parent to reason about what kind of children a component might render. It creates a refactoring haza...
⏪ Revert: React.pure() Automatically Forwards Ref
Last week we were covering a PR that added
https://github.com/facebook/react/pull/13887
Last week we were covering a PR that added
forwardRef behavior to React.pure() by default. The PR was since reverted while the Core team is working on the future of ref forwarding.https://github.com/facebook/react/pull/13887
GitHub
Revert "React.pure automatically forwards ref" by sophiebits · Pull Request #13887 · facebook/react
Reverts #13822. We're not sure we want to do this.
🔥 RFC: React Hooks
The React team announced Hooks - A new and backwards-compatible Component API. In addition to the RFC, the team also launched [a complete set of documentation](https://reactjs.org/docs/hooks-intro.html). You can play around with React Hooks today by using the v16.7.0-alpha release on npm.
https://github.com/reactjs/rfcs/pull/68
The React team announced Hooks - A new and backwards-compatible Component API. In addition to the RFC, the team also launched [a complete set of documentation](https://reactjs.org/docs/hooks-intro.html). You can play around with React Hooks today by using the v16.7.0-alpha release on npm.
https://github.com/reactjs/rfcs/pull/68
legacy.reactjs.org
Introducing Hooks – React
A JavaScript library for building user interfaces
🎉 React v16.6.0: lazy, memo and contextType
This week also marks the release of the stable v16.6. This not only adds the lazy, memo, contextType, and getDerivedStateFromError APIs that we covered in previous issues, but is also the first public build where Suspense is no longer behind a feature flag and not marked unstable.
https://reactjs.org/blog/2018/10/23/react-v-16-6.html
This week also marks the release of the stable v16.6. This not only adds the lazy, memo, contextType, and getDerivedStateFromError APIs that we covered in previous issues, but is also the first public build where Suspense is no longer behind a feature flag and not marked unstable.
https://reactjs.org/blog/2018/10/23/react-v-16-6.html
legacy.reactjs.org
React v16.6.0: lazy, memo and contextType – React Blog
This blog site has been archived. Go to react.dev/blog to see the recent posts. Today we’re releasing React 16.6 with a few new convenient features. A form of PureComponent/shouldComponentUpdate for function components, a way to do code splitting using Suspense…
⏱ Enable concurrent APIs flag for 16.7
Concurrent APIs (ReactDOM.createRoot and <ConcurrentMode/>) will no longer be unstable in the upcoming v16.7.0 release.
https://github.com/facebook/react/pull/13928
Concurrent APIs (ReactDOM.createRoot and <ConcurrentMode/>) will no longer be unstable in the upcoming v16.7.0 release.
https://github.com/facebook/react/pull/13928
GitHub
Enable stable concurrent APIs flag for 16.7 alpha by bvaughn · Pull Request #13928 · facebook/react
These APIs will no longer be "unstable" in the upcoming 16.7 release. Rename them behind a feature flag though, in case we need to publish a 16.6 minor release in the meanwhile.