React Fiber is a reimplementation of React's core rendering algorithm that was introduced with React v16.0. It introduced scheduling and incremental rendering among many other features.
Resources
Questions tagged [react-fiber]
64 questions
126
votes
6 answers
What's the difference between hydrate() and render() in React 16?
I've read the documentation, but I didn't really understand the difference between hydrate() and render() in React 16.
I know hydrate() is used to combine SSR and client-side rendering.
Can someone explain what is hydrating and then what is the…
shabenda
- 1,759
- 3
- 14
- 23
74
votes
4 answers
What is difference between React vs React Fiber?
I just heard that react-fiber is ready.
What is the big differences between react and react-fiber?
Is it worth it to learn the whole new concept for that differences ?
Hoang Trung
- 1,979
- 1
- 21
- 33
68
votes
10 answers
React 16 warning "warning.js:36 Warning: Did not expect server HTML to contain a in ."
I'm using the React 16 beta (react-fiber) with server side rendering
What I am to understand this to mean?
warning.js:36 Warning: Did not expect server HTML to contain a in .
David Furlong
- 1,343
- 1
- 12
- 15
60
votes
4 answers
Does React Native have a 'Virtual DOM'?
From ReactJS wiki page about Virtual DOM:
React creates an in-memory data structure cache, computes the
resulting differences, and then updates the browser's displayed DOM
efficiently. This allows the programmer to write code as if the
entire…
oleh.meleshko
- 4,675
- 2
- 27
- 40
11
votes
3 answers
Order of componentDidMount in React components hierarchy
I have an React application that has the following structure:
component A is composed of B and C
When the component B calls it's componentDidMount method, is this true that all component finished mounting?
Or in other words does React fire…
zmii
- 4,123
- 3
- 40
- 64
9
votes
0 answers
How do I set the "type" of a React Fiber?
I have a custom React Fiber Reconciler, which I create using the default export from the react-reconciler package.
In a ReactDOM Component, I execute
this.mountNode = CustomRenderer.createContainer(this.stage)
CustomRenderer.updateContainer(
…
Ari Lotter
- 605
- 8
- 23
8
votes
2 answers
Is React 16's Portal API meant to replace the Context API?
I noticed new feature portals do the same thing but better? I dont know much about portals but it seems to be the new way to manage nested component updates?
I knew Reacts Context API was experimental, and noticed componentDidUpdate no longer…
garrettmac
- 8,417
- 3
- 41
- 60
7
votes
2 answers
What is the purpose of a custom React renderers within a DOM host?
Prelude
We are all familiar with the default renderers that comes with React - ReactDOM.
We also have custom React renderers that can be used to interface with "hosts" that aren't the DOM environment, such as mobile devices (famously React Native),…
Chris
- 54,599
- 30
- 149
- 186
6
votes
2 answers
React scheduler's `unstable_runWithPriority` doesn't use `priority` in any way
I ran a profiler on the following code:
function App() {
const [ counter, setCounter ] = useState(0);
return
{counter}
}
Which is pretty standard,…
Uday Reddy
- 1,337
- 3
- 16
- 38
6
votes
1 answer
Server-side rendering with ReactDOM.hydrate
hydrate has landed to React 16, but its use isn't documented yet.
This article suggests that it is is supposed to be used with renderToNodeStream but doesn't give much details.
What is the expected usage of hydrate?
renderToString is synchronous.…
Estus Flask
- 206,104
- 70
- 425
- 565
5
votes
1 answer
Where exactly the Virtual DOM is stored?
I'm torturing myself for hours now and can't find an answer.
Where exactly, under what object/key, the React data are located? I found an object ReactRoot that seems to store all the information about components, but I have no idea where it sits in…
platinum_ar
- 127
- 3
- 8
5
votes
2 answers
Why cant react set initial state based on props
I have a es6 react component that I want the initial value of the state to depend on that of the passed down prop, but its value is always false:
AttachStateToProps component
Fatah
- 2,184
- 4
- 18
- 39
4
votes
2 answers
What is the difference between a fibre object in React 16 and a React Element?
Here on this link (as a lotta people referring to, for understanding React 16's architecture) it is mentioned:
Even Elements in React are plain JS objects that contains info about the component, having the following four props:
{
type,
ref,
…
UtkarshPramodGupta
- 7,486
- 7
- 30
- 54
4
votes
1 answer
how to render a component by string name
I seem to be unable to render components using name strings. I wanted to be able to dynamically generate component name strings which have existing corresponding components that can be rendered.
The array const is going to be populated via JSON…
Louis
- 1,014
- 2
- 11
- 20
4
votes
2 answers
Is it possible to retrieve a component's instance from a React Fiber?
Before v16 of React -- that is, before the introduction of React fibers -- it was possible to take a DOM element and retrieve the React component instance as follows:
const getReactComponent = dom => {
let found = false;
const keys =…
fraxture
- 5,113
- 4
- 43
- 83
."
I'm using the React 16 beta (react-fiber) with server side rendering
What I am to understand this to mean?
warning.js:36 Warning: Did not expect server HTML to contain a
in
.
David Furlong
- 1,343
- 1
- 12
- 15
60
votes
4 answers
Does React Native have a 'Virtual DOM'?
From ReactJS wiki page about Virtual DOM:
React creates an in-memory data structure cache, computes the
resulting differences, and then updates the browser's displayed DOM
efficiently. This allows the programmer to write code as if the
entire…
oleh.meleshko
- 4,675
- 2
- 27
- 40
11
votes
3 answers
Order of componentDidMount in React components hierarchy
I have an React application that has the following structure:
component A is composed of B and C
When the component B calls it's componentDidMount method, is this true that all component finished mounting?
Or in other words does React fire…
zmii
- 4,123
- 3
- 40
- 64
9
votes
0 answers
How do I set the "type" of a React Fiber?
I have a custom React Fiber Reconciler, which I create using the default export from the react-reconciler package.
In a ReactDOM Component, I execute
this.mountNode = CustomRenderer.createContainer(this.stage)
CustomRenderer.updateContainer(
…
Ari Lotter
- 605
- 8
- 23
8
votes
2 answers
Is React 16's Portal API meant to replace the Context API?
I noticed new feature portals do the same thing but better? I dont know much about portals but it seems to be the new way to manage nested component updates?
I knew Reacts Context API was experimental, and noticed componentDidUpdate no longer…
garrettmac
- 8,417
- 3
- 41
- 60
7
votes
2 answers
What is the purpose of a custom React renderers within a DOM host?
Prelude
We are all familiar with the default renderers that comes with React - ReactDOM.
We also have custom React renderers that can be used to interface with "hosts" that aren't the DOM environment, such as mobile devices (famously React Native),…
Chris
- 54,599
- 30
- 149
- 186
6
votes
2 answers
React scheduler's `unstable_runWithPriority` doesn't use `priority` in any way
I ran a profiler on the following code:
function App() {
const [ counter, setCounter ] = useState(0);
return
}
Which is pretty standard,…
{counter}
Uday Reddy
- 1,337
- 3
- 16
- 38
6
votes
1 answer
Server-side rendering with ReactDOM.hydrate
hydrate has landed to React 16, but its use isn't documented yet.
This article suggests that it is is supposed to be used with renderToNodeStream but doesn't give much details.
What is the expected usage of hydrate?
renderToString is synchronous.…
Estus Flask
- 206,104
- 70
- 425
- 565
5
votes
1 answer
Where exactly the Virtual DOM is stored?
I'm torturing myself for hours now and can't find an answer.
Where exactly, under what object/key, the React data are located? I found an object ReactRoot that seems to store all the information about components, but I have no idea where it sits in…
platinum_ar
- 127
- 3
- 8
5
votes
2 answers
Why cant react set initial state based on props
I have a es6 react component that I want the initial value of the state to depend on that of the passed down prop, but its value is always false:
AttachStateToProps component
Fatah
- 2,184
- 4
- 18
- 39
4
votes
2 answers
What is the difference between a fibre object in React 16 and a React Element?
Here on this link (as a lotta people referring to, for understanding React 16's architecture) it is mentioned:
Even Elements in React are plain JS objects that contains info about the component, having the following four props:
{
type,
ref,
…
UtkarshPramodGupta
- 7,486
- 7
- 30
- 54
4
votes
1 answer
how to render a component by string name
I seem to be unable to render components using name strings. I wanted to be able to dynamically generate component name strings which have existing corresponding components that can be rendered.
The array const is going to be populated via JSON…
Louis
- 1,014
- 2
- 11
- 20
4
votes
2 answers
Is it possible to retrieve a component's instance from a React Fiber?
Before v16 of React -- that is, before the introduction of React fibers -- it was possible to take a DOM element and retrieve the React component instance as follows:
const getReactComponent = dom => {
let found = false;
const keys =…
fraxture
- 5,113
- 4
- 43
- 83