[docs] Add cache to avoid unnecessary jsx dynamic import and theme ge…

…tting (#43139)
mui · Aug 19, 2024 · f62954b · f62954b
1 parent f7237d8
commit f62954b
Showing 1 changed file with 9 additions and 5 deletions.
diff --git a/docs/src/modules/components/DemoSandbox.js b/docs/src/modules/components/DemoSandbox.js
@@ -21,6 +21,8 @@ const iframeDefaultJoyTheme = extendTheme({
   cssVarPrefix: 'demo-iframe',
 });
 
+let globalInjectThemeCache;
+
 function FramedDemo(props) {
   const { children, document, usesCssVarsTheme } = props;
 
@@ -208,11 +210,13 @@ function DemoSandbox(props) {
   useEnhancedEffect(() => {
     async function setupMaterialUITheme() {
       if (typeof window.getInjectTheme === 'function') {
-        window.React = React;
-        const jsx = await import('react/jsx-runtime');
-        window.jsx = jsx;
-        const themeOptions = window.getInjectTheme();
-        setInjectTheme(themeOptions);
+        if (!globalInjectThemeCache) {
+          window.React = React;
+          const jsx = await import('react/jsx-runtime');
+          window.jsx = jsx;
+          globalInjectThemeCache = window.getInjectTheme();
+        }
+        setInjectTheme(globalInjectThemeCache);
       }
     }
     setupMaterialUITheme();