Add portals, error boundaries and fiber architecture

pull/1657/head
Kamran Ahmed 2 years ago
parent 6160ad973d
commit 5e5ee249ea
  1. 7
      content/roadmaps/103-react/content/101-react-advanced-topics/105-portals.md
  2. 9
      content/roadmaps/103-react/content/101-react-advanced-topics/106-error-boundaries.md
  3. 10
      content/roadmaps/103-react/content/101-react-advanced-topics/107-fiber-architecture.md

@ -1 +1,6 @@
# Portals # Portals
Portals provide a first-class way to render children into a DOM node that exists outside the DOM hierarchy of the parent component.
<ResourceGroupTitle>Free Content</ResourceGroupTitle>
<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://reactjs.org/docs/portals.html'>Portals in React</BadgeLink>

@ -1 +1,8 @@
# Error boundaries # Error Boundaries
In the past, JavaScript errors inside components used to corrupt React’s internal state and cause it to emit cryptic errors on next renders. These errors were always caused by an earlier error in the application code, but React did not provide a way to handle them gracefully in components, and could not recover from them.
Error boundaries are React components that catch JavaScript errors anywhere in their child component tree, log those errors, and display a fallback UI instead of the component tree that crashed. Error boundaries catch errors during rendering, in lifecycle methods, and in constructors of the whole tree below them.
<ResourceGroupTitle>Free Content</ResourceGroupTitle>
<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://reactjs.org/docs/error-boundaries.html'>Error Boundaries in React</BadgeLink>

@ -1 +1,9 @@
# Fiber architecture # Fiber Architecture
React 16.0 was released with an update to the React core algorithm. This new core architecture is named “Fiber.” Facebook has completely rewritten the internals of React from the ground-up while keeping the public API essentially unchanged; in simple terms, it means only changing the engine of a running car.
<ResourceGroupTitle>Free Content</ResourceGroupTitle>
<BadgeLink colorScheme='yellow' badgeText='Read' href='https://github.com/acdlite/react-fiber-architecture'>React Fiber Architecture</BadgeLink>
<BadgeLink colorScheme='yellow' badgeText='Read' href='https://dzone.com/articles/understanding-of-react-fiber-architecture'>Understanding React Fiber Architecture</BadgeLink>

Loading…
Cancel
Save