jupyterlab/docs/source/developer/virtualdom.md

Virtual DOM and React

JupyterLab is based on PhosphorJS, which provides a flexible Widget class that handles the following:

• Resize events that propagate down the Widget heirarchy.
• Lifecycle events (onBeforeDetach, onAfterAttach, etc.).
• Both CSS-based and absolutely postioned layouts.

In situations where these feature are needed, we recommend using Phosphor's Widget class directly.

The idea of virtual DOM rendering, which became popular in the React community, is a very elegant and efficient way of rendering and updating DOM content in response to model/state changes.

Phosphor's Widget class integrates well with ReactJS and we are now using React in JupyterLab to render leaf content when the above capabilities are not needed.

An example of using React with Phosphor can be found in the launcher of JupyterLab.