diff --git a/CHANGELOG.md b/CHANGELOG.md
index f72da63d..c7d9b607 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -23,6 +23,8 @@
 
 - Fix incorrect handing of network error response (#944)
 - Show an error when adding a layer with a duplicate ID
+- Replace deprecated `ReactDOM.render` usage with `createRoot` and drop the
+  `DOMNodeRemoved` cleanup hack
 - _...Add new stuff here..._
 
 ## 2.1.1
diff --git a/src/components/MapMaplibreGl.tsx b/src/components/MapMaplibreGl.tsx
index 93d0cfdd..1c909646 100644
--- a/src/components/MapMaplibreGl.tsx
+++ b/src/components/MapMaplibreGl.tsx
@@ -1,5 +1,5 @@
 import React, {type JSX} from 'react'
-import ReactDOM from 'react-dom'
+import {createRoot} from 'react-dom/client'
 import MapLibreGl, {LayerSpecification, LngLat, Map, MapOptions, SourceSpecification, StyleSpecification} from 'maplibre-gl'
 import MaplibreInspect from '@maplibre/maplibre-gl-inspect'
 import colors from '@maplibre/maplibre-gl-inspect/lib/colors'
@@ -17,8 +17,14 @@ import { withTranslation, WithTranslation } from 'react-i18next'
 import i18next from 'i18next'
 import { Protocol } from "pmtiles";
 
-function renderPopup(popup: JSX.Element, mountNode: ReactDOM.Container): HTMLElement {
-  ReactDOM.render(popup, mountNode);
+function renderPopup(
+  popupElement: JSX.Element,
+  mountNode: HTMLElement,
+  popup: MapLibreGl.Popup
+): HTMLElement {
+  const root = createRoot(mountNode);
+  popup.once('close', () => root.unmount());
+  root.render(popupElement);
   return mountNode as HTMLElement;
 }
 
@@ -174,10 +180,12 @@ class MapMaplibreGlInternal extends React.Component<MapMaplibreGlInternalProps,
 
     const tmpNode = document.createElement('div');
 
+    const inspectPopup = new MapLibreGl.Popup({
+      closeOnClick: false
+    });
+
     const inspect = new MaplibreInspect({
-      popup: new MapLibreGl.Popup({
-        closeOnClick: false
-      }),
+      popup: inspectPopup,
       showMapPopup: true,
       showMapPopupOnHover: false,
       showInspectMapPopupOnHover: true,
@@ -189,9 +197,21 @@ class MapMaplibreGlInternal extends React.Component<MapMaplibreGlInternalProps,
       buildInspectStyle: (originalMapStyle: StyleSpecification, coloredLayers: HighlightedLayer[]) => buildInspectStyle(originalMapStyle, coloredLayers, this.props.highlightedLayer),
       renderPopup: (features: InspectFeature[]) => {
         if(this.props.inspectModeEnabled) {
-          return renderPopup(<MapMaplibreGlFeaturePropertyPopup features={features} />, tmpNode);
+          return renderPopup(
+            <MapMaplibreGlFeaturePropertyPopup features={features} />,
+            tmpNode,
+            inspectPopup
+          );
         } else {
-          return renderPopup(<MapMaplibreGlLayerPopup features={features} onLayerSelect={this.onLayerSelectById} zoom={this.state.zoom} />, tmpNode);
+          return renderPopup(
+            <MapMaplibreGlLayerPopup
+              features={features}
+              onLayerSelect={this.onLayerSelectById}
+              zoom={this.state.zoom}
+            />,
+            tmpNode,
+            inspectPopup
+          );
         }
       }
     })