Restore hub iframe soft nav to cut blank tab switch gap.

Use fetch in-frame navigation with overlay and hover prefetch; show delayed hub loading spinner instead of hiding the iframe.

Co-authored-by: Cursor <cursoragent@cursor.com>

static/instance_theme.js

@@ -338,24 +338,137 @@
 
   function notifyParentFrameReady() {
     if (!isHubLinked()) return;
+    dismissNavOverlay();
     try {
       window.parent.postMessage({ type: "instance-frame-ready", theme: get() }, "*");
     } catch (_) {}
   }
 
-  /** 中控 iframe：顶栏用正常跳转（与单独打开实例一致），由中控 shell 遮罩盖住 iframe 加载过程。 */
+  function ensureNavOverlay() {
+    const t = normalize(get());
+    const bg = META[t];
+    let el = document.getElementById("inst-nav-overlay");
+    if (!el) {
+      el = document.createElement("div");
+      el.id = "inst-nav-overlay";
+      el.setAttribute("aria-hidden", "true");
+      (document.body || document.documentElement).appendChild(el);
+    }
+    el.style.cssText =
+      "position:fixed;inset:0;z-index:2147483646;background:" +
+      bg +
+      ";opacity:1;pointer-events:auto;transition:opacity 80ms ease;";
+    return el;
+  }
+
+  function dismissNavOverlay() {
+    const el = document.getElementById("inst-nav-overlay");
+    if (!el) return;
+    el.style.opacity = "0";
+    window.setTimeout(() => {
+      try {
+        el.remove();
+      } catch (_) {}
+    }, 90);
+  }
+
+  function injectNavOverlayIntoHtml(html, theme) {
+    const t = normalize(theme || get());
+    const bg = META[t];
+    let out = html || "";
+    const guard =
+      '<style id="inst-nav-guard">html,body{background:' +
+      bg +
+      "!important;color-scheme:" +
+      t +
+      ';}</style>';
+    if (out.includes("</head>")) {
+      out = out.replace("</head>", guard + "</head>");
+    } else {
+      out = guard + out;
+    }
+    out = out.replace(/<html([^>]*)>/i, (m, attrs) => {
+      if (/data-theme=/i.test(attrs)) {
+        return m.replace(/data-theme="[^"]*"/i, 'data-theme="' + t + '"');
+      }
+      return "<html" + attrs + ' data-theme="' + t + '">';
+    });
+    const overlay =
+      '<div id="inst-nav-overlay" aria-hidden="true" style="position:fixed;inset:0;z-index:2147483646;background:' +
+      bg +
+      ';opacity:1;pointer-events:auto"></div>';
+    if (/<body[^>]*>/i.test(out)) {
+      out = out.replace(/<body([^>]*)>/i, "<body$1>" + overlay);
+    }
+    return out;
+  }
+
+  /** 中控 iframe：fetch 换页 + 页内遮罩，避免整页卸载与中控侧长时间空白。 */
   function initHubEmbedInFrameNav() {
     if (!isHubLinked()) return;
 
+    let navToken = 0;
+    const prefetch = new Map();
+    const PREFETCH_MAX = 8;
+
     function isSoftNavLink(a) {
       if (!a || !a.getAttribute) return false;
       if (a.hasAttribute("download") || a.target === "_blank") return false;
       return !!a.closest(".top-nav, .strategy-subnav");
     }
 
-    function navigateTopNav(href) {
+    function rememberPrefetch(href, html) {
+      if (!href || !html) return;
+      if (prefetch.has(href)) prefetch.delete(href);
+      prefetch.set(href, html);
+      while (prefetch.size > PREFETCH_MAX) {
+        const first = prefetch.keys().next().value;
+        prefetch.delete(first);
+      }
+    }
+
+    function warmPrefetch(href) {
+      if (!href || prefetch.has(href)) return;
+      const token = navToken;
+      fetch(href, { credentials: "same-origin" })
+        .then((r) => (r.ok ? r.text() : null))
+        .then((html) => {
+          if (html && token === navToken) rememberPrefetch(href, html);
+        })
+        .catch(() => {});
+    }
+
+    async function navigateInFrame(href, opts) {
+      const token = ++navToken;
       notifyParentFrameNavStart();
-      location.assign(href);
+      ensureNavOverlay();
+      try {
+        let html = prefetch.get(href);
+        if (html) prefetch.delete(href);
+        if (!html) {
+          const r = await fetch(href, { credentials: "same-origin" });
+          if (token !== navToken) return;
+          if (!r.ok) {
+            location.assign(href);
+            return;
+          }
+          html = await r.text();
+        }
+        if (token !== navToken) return;
+        html = injectNavOverlayIntoHtml(html, get());
+        let path = href;
+        try {
+          const u = new URL(href, location.href);
+          path = u.pathname + u.search + u.hash;
+        } catch (_) {}
+        if (opts && opts.replace) history.replaceState(null, "", path);
+        else history.pushState(null, "", path);
+        document.open();
+        document.write(html);
+        document.close();
+      } catch (_) {
+        if (token === navToken) location.assign(href);
+      }
     }
 
     document.addEventListener(
@@ -376,12 +489,30 @@
         const nextHref = target.pathname + target.search + target.hash;
         if (target.pathname === location.pathname && target.search === location.search) return;
         ev.preventDefault();
-        navigateTopNav(nextHref);
+        void navigateInFrame(nextHref);
       },
       true
     );
 
-    window.addEventListener("pagehide", notifyParentFrameNavStart);
+    document.addEventListener(
+      "pointerenter",
+      (ev) => {
+        const a = ev.target.closest("a[href]");
+        if (!a || !isSoftNavLink(a)) return;
+        const rawHref = a.getAttribute("href");
+        if (!rawHref || rawHref.startsWith("#") || rawHref.startsWith("javascript:")) return;
+        try {
+          const target = new URL(rawHref, location.href);
+          if (target.origin !== location.origin) return;
+          warmPrefetch(target.pathname + target.search + target.hash);
+        } catch (_) {}
+      },
+      true
+    );
+
+    window.addEventListener("popstate", () => {
+      void navigateInFrame(location.pathname + location.search + location.hash, { replace: true });
+    });
   }
 
   function purgeLegacySoftNavCache() {
@@ -408,7 +539,6 @@
       apply(get(), { skipStore: true });
       window.addEventListener("message", (ev) => initFromHubMessage(ev.data));
       initHubEmbedInFrameNav();
-      notifyParentFrameReady();
       try {
         window.parent.postMessage({ type: "instance-theme-ready" }, "*");
       } catch (_) {}
@@ -438,7 +568,11 @@
       syncInlineStyles(get());
       patchHubNavLinks(get());
       observeDynamicLists();
-      if (isHubLinked()) notifyParentFrameReady();
+      if (isHubLinked()) {
+        requestAnimationFrame(() => {
+          requestAnimationFrame(() => notifyParentFrameReady());
+        });
+      }
     };
     if (document.readyState === "loading") {
       document.addEventListener("DOMContentLoaded", onReady);