diff --git a/website/src/components/playground-component/playground.tsx b/website/src/components/playground-component/playground.tsx
index 6544c1ac7c1..5fcc1b3588e 100644
--- a/website/src/components/playground-component/playground.tsx
+++ b/website/src/components/playground-component/playground.tsx
@@ -28,9 +28,14 @@ export const WebsitePlayground = ({ versionData }: WebsitePlaygroundProps) => {
   }, [theme]);
 
   const importItem = useImportCommandBarItem();
-  const imports = Object.keys(versionData.importMap.imports).filter(
-    (x) => (x.match(/\//g) || []).length < 2, // Don't include sub imports as libraries.
+  const imports = useMemo(
+    () =>
+      Object.keys(versionData.importMap.imports).filter(
+        (x) => (x.match(/\//g) || []).length < 2, // Don't include sub imports as libraries.
+      ),
+    [versionData.importMap.imports],
   );
+  const importConfig = useMemo(() => ({ useShim: true }), []);
   return (
     <StandalonePlayground
       {...TypeSpecPlaygroundConfig}
@@ -40,7 +45,7 @@ export const WebsitePlayground = ({ versionData }: WebsitePlaygroundProps) => {
         "@typespec/http-client-python": { debounce: 500, newChangeDiff: true },
         "@typespec/http-client-csharp": { debounce: 500, newChangeDiff: true },
       }}
-      importConfig={{ useShim: true }}
+      importConfig={importConfig}
       editorOptions={editorOptions}
       footer={<PlaygroundFooter versionData={versionData} />}
       fallback={<LoadingSpinner message="Loading libraries..." />}
diff --git a/website/src/layouts/base-layout.astro b/website/src/layouts/base-layout.astro
index 4d22634c126..fb653792d5d 100644
--- a/website/src/layouts/base-layout.astro
+++ b/website/src/layouts/base-layout.astro
@@ -21,6 +21,22 @@ const initJsIntegrity = computeSriHash("1ds-init.js");
     <link rel="og:image" type="image/svg+xml" href={baseUrl("/img/social.svg")} />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>typespec.io</title>
+    <script is:inline>
+      (function () {
+        var raw =
+          localStorage.getItem("theme") ||
+          (window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light");
+        var theme = raw === "dark" ? "dark" : "light";
+        document.documentElement.setAttribute("data-theme", theme);
+        if (theme === "dark") {
+          document.documentElement.classList.remove("light");
+          document.documentElement.classList.add("dark");
+        } else {
+          document.documentElement.classList.remove("dark");
+          document.documentElement.classList.add("light");
+        }
+      })();
+    </script>
     <script
       src="https://consentdeliveryfd.azurefd.net/mscc/lib/v2/wcp-consent.js"
       crossorigin="anonymous"