Conditionally Render with Legacy Root API or New Root API
React 18 supports the legacy root API (render) and a new root API (createRoot). Utilize this to conditionally render based on environment, user preference, or audience sample.
Instructor: [0:00] When migrating to React 18, you may want to conditionally use the legacy API or the new Root API, depending on an environment variable or a feature flag. Let's do this in a very simplified way.
[0:14] Let's create a new constant for React 18 and set it to true. If we're in a React 18 environment, we want to use the new createRoot API. Else, we'll use the legacy root API. Let's copy this, paste it up here, and do our transformation. Take out that argument, insert createRoot, and we're good to go.
[0:40] Now, based on environment or feature flag, we can conditionally render using the legacy root API or the new Root API. To test it out, change it to false and see our warning again.
Member comments are a way for members to communicate, interact, and ask questions about a lesson.
The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io
Be on-Topic
Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.
Avoid meta-discussion
Code Problems?
Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context
Details and Context
Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!