perf: embed shell soft nav, tab cache, and lighter options page boot

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-07-07 10:42:01 +08:00
parent 8913138dc3
commit 30e40dc34c
6 changed files with 150 additions and 31 deletions
+56 -7
View File
@@ -7,6 +7,7 @@
trade: "/trade",
strategy: "/strategy",
strategy_records: "/strategy/records",
options: "/options",
records: "/records",
stats: "/stats",
settings: "/settings",
@@ -14,6 +15,7 @@
let navToken = 0;
let loadingTab = false;
const tabHtmlCache = new Map();
/** 自带校验后 form.submit() 的表单,勿在捕获阶段再 fetch 一份(会双发 POST */
const CUSTOM_SUBMIT_FORM_IDS = new Set(["add-order-form", "key-form", "roll-form"]);
@@ -112,20 +114,61 @@
});
}
function embedPageUrl(tab) {
const qs = listWindowQueryString();
let url = "/api/embed/page/" + encodeURIComponent(tab);
const parts = [];
if (qs) parts.push(qs);
parts.push("embed=1");
return url + "?" + parts.join("&");
}
async function fetchTabHtml(tab) {
const r = await fetch(embedPageUrl(tab), {
credentials: "same-origin",
headers: { "X-Instance-Soft-Nav": "1" },
});
const j = await r.json();
if (!j.ok || !j.html) throw new Error(j.msg || "加载失败");
return j.html;
}
function warmTabCache(tab) {
if (!tab || tabHtmlCache.has(tab)) return;
fetchTabHtml(tab)
.then((html) => {
tabHtmlCache.set(tab, html);
})
.catch(() => {});
}
function clearTabCache() {
tabHtmlCache.clear();
}
async function loadTab(tab, opts) {
const options = opts || {};
if (!tab || loadingTab) return;
const token = ++navToken;
const force = !!options.force;
const cached = !force && tabHtmlCache.get(tab);
if (cached) {
injectFragment(cached);
setNavActive(tab);
if (!options.skipUrl) syncUrl(tab, !!options.replace);
runPageInit(tab);
warmTabCache(tab);
return;
}
loadingTab = true;
setRootLoading(true);
try {
const qs = listWindowQueryString();
const url = "/api/embed/page/" + encodeURIComponent(tab) + (qs ? "?" + qs : "");
const r = await fetch(url, { credentials: "same-origin" });
const html = await fetchTabHtml(tab);
if (token !== navToken) return;
const j = await r.json();
if (!j.ok || !j.html) throw new Error(j.msg || "加载失败");
injectFragment(j.html);
tabHtmlCache.set(tab, html);
injectFragment(html);
setNavActive(tab);
if (!options.skipUrl) syncUrl(tab, !!options.replace);
runPageInit(tab);
@@ -146,7 +189,8 @@
}
function reloadCurrentTab() {
return loadTab(getTab(), { replace: true, skipUrl: true });
tabHtmlCache.delete(getTab());
return loadTab(getTab(), { replace: true, skipUrl: true, force: true });
}
function postFormAndReload(form, label) {
@@ -172,6 +216,7 @@
function patchApplyListWindow() {
if (typeof global.applyListWindow !== "function") return;
global.applyListWindow = function embedApplyListWindow() {
clearTabCache();
const qs = listWindowQueryString();
const tab = getTab();
const q = new URLSearchParams(qs);
@@ -239,6 +284,9 @@
function bindNav() {
document.querySelectorAll(".embed-top-nav [data-embed-tab]").forEach((a) => {
a.addEventListener("mouseenter", () => {
warmTabCache(a.getAttribute("data-embed-tab"));
});
a.addEventListener("click", (ev) => {
ev.preventDefault();
const tab = a.getAttribute("data-embed-tab");
@@ -268,6 +316,7 @@
reloadCurrentTab,
getTab,
postFormAndReload,
clearTabCache,
};
if (document.readyState === "loading") {
+29 -4
View File
@@ -4,10 +4,12 @@
const root = document.getElementById("options-root");
if (!root) return;
const panelCache = (window.__optionsPanelCache = window.__optionsPanelCache || {});
const state = {
underlying: root.dataset.defaultUnderly || "ETH",
optType: "C",
chain: null,
chain: panelCache.chain || null,
selectedInst: null,
};
@@ -254,6 +256,9 @@
return;
}
state.chain = d;
panelCache.chain = d;
panelCache.underlying = state.underlying;
panelCache.optType = state.optType;
state.selectedInst = null;
parkOrderPanel();
renderExpiries();
@@ -457,6 +462,28 @@
refreshHistory();
}
function bootOptionsPanel() {
updateSizeInputs();
const hasCache =
panelCache.chain &&
panelCache.underlying === state.underlying &&
panelCache.optType === state.optType;
if (hasCache) {
state.chain = panelCache.chain;
renderExpiries();
renderStrikes();
refreshAllPositions();
requestAnimationFrame(function () {
loadChain();
});
return;
}
requestAnimationFrame(function () {
loadChain();
refreshAllPositions();
});
}
document.querySelectorAll(".opt-uly-btn").forEach(function (btn) {
btn.addEventListener("click", function () {
document.querySelectorAll(".opt-uly-btn").forEach(function (b) { b.classList.remove("active"); });
@@ -495,7 +522,5 @@
});
});
updateSizeInputs();
loadChain();
refreshAllPositions();
bootOptionsPanel();
})();
+16
View File
@@ -72,6 +72,22 @@ def embed_shell_enabled() -> bool:
return (os.getenv("HUB_EMBED_SHELL") or "1").strip().lower() in ("1", "true", "yes", "on")
def redirect_to_embed_shell_if_enabled(page: str):
"""直连 /trade 等整页路由时,重定向到 embed 壳(顶栏常驻、tab 软切换)。"""
from flask import redirect, request, urlencode
if not embed_shell_enabled():
return None
if (request.args.get("embed") or "").strip() == "1":
return None
if (request.path or "").rstrip("/") == "/embed":
return None
q = {k: v for k, v in request.args.items()}
q["tab"] = page
q["embed"] = "1"
return redirect("/embed?" + urlencode(q))
def rewrite_embed_dest(path: str, hub_theme: str | None = None) -> str:
"""embed=1 打开时:/trade → /embed?tab=trade&embed=1"""
if not embed_shell_enabled():
+1 -1
View File
@@ -90,6 +90,6 @@ const ORDER_ENTRY_MODEL_CODE_TO_CATEGORY = {{ entry_model_code_to_category | toj
<script src="/static/strategy_roll.js?v=6"></script>
<script src="/static/key_monitor_form.js?v=2"></script>
{% include 'embed_boot_scripts.html' %}
<script src="/static/instance_embed.js?v=7"></script>
<script src="/static/instance_embed.js?v=8"></script>
</body>
</html>
+1 -1
View File
@@ -121,4 +121,4 @@
</div>
</div>
</div>
<script src="/static/options_panel.js?v=7"></script>
<script src="/static/options_panel.js?v=8"></script>