Skip to main content

ReactDOM API ↔ core react library to render VDOM

react-dom/client​

React 18+ Package to render App

Source: reactjs.org/docs/react

react-dom/server​

Package to import ReactDOMServer object for access to render components to static markup

Escape Hatch​

(mech) to express logic outside React model - to direct manipulate DOM

createPortal()​

ReactDOM API Escape Hatch fn to render child Element to any container Element other than parent

flushSync()

render()​

replace by createRoot(). ReactDOM API function to render element to DOM API inside container - for Client Component only

hydrate()​

replace by hydrateRoot() ReactDOM API function to Hydrate container render by ReactDOMServer

findDOMNode()​

deprecated ReactDOM API Escape Hatch to access DOM API Node

unmountComponentAtNode()​

replace by root.unmount()

Hydrate​

(process) to update content in static HTML

renderer for browser & client-side renderin

render()​

to create & manages component

split from core react library

References​

  1. render() ↔ replace by createRoot(). ReactDOM API function to render element to DOM API inside container - for Client Component only

  2. hydrate() ↔ replace by hydrateRoot() ReactDOM API function to Hydrate container render by ReactDOMServer

  3. ReactDOMServer ↔ ReactDOM API Interface Object to render FC to static HTML

  4. Portal ↔ ReactDOM API Escape Hatch to render children outside Component Hierarchy of Parent Component

  5. createPortal() ↔ ReactDOM API Escape Hatch fn to render child Element to any container Element other than parent

  6. findDOMNode() ↔ deprecated ReactDOM API Escape Hatch to access DOM API Node