From 93e446e9f715d691f748da629ca1bcc507bef536 Mon Sep 17 00:00:00 2001 From: Soulter <37870767+Soulter@users.noreply.github.com> Date: Tue, 6 Oct 2026 15:08:06 +0800 Subject: [PATCH] perf(dashboard): reduce first-screen load (lazy-load VAD/Monaco/i18n/ApexCharts, gzip responses) (#10413) * perf(dashboard): lazy-load VAD dependencies on demand Load onnxruntime-web and vad-web via dynamic script injection when the VAD initializes instead of render-blocking script tags in index.html, so they no longer delay the first paint on every page load. * perf(dashboard): shrink first-screen bundle and gzip responses - Lazy-load Monaco Editor (~3.3 MB) via an async wrapper component instead of importing it in main.ts; the editor bundle now loads only when an editor is first mounted. - Load i18n locale data on demand: each language becomes its own async chunk instead of bundling all four locales (~1.4 MB of JSON) into the entry. - Register vue3-apexcharts locally in StatsPage instead of globally in main.ts, moving ~470 KB out of the entry chunk. - Add Starlette GZipMiddleware to the dashboard ASGI app so static assets and API responses are compressed (SSE is excluded by default). Entry chunk: 4.5 MB -> 648 KB (gzip: 1.25 MB -> 210 KB). --- astrbot/dashboard/api/app.py | 4 + dashboard/index.html | 3 - .../extension/McpServersSection.vue | 2 +- .../components/extension/SkillsSection.vue | 2 +- .../src/components/shared/AstrBotConfig.vue | 2 +- .../src/components/shared/AstrBotConfigV4.vue | 2 +- .../components/shared/ConfigItemRenderer.vue | 2 +- .../src/components/shared/LazyMonacoEditor.ts | 12 + .../components/shared/T2ITemplateEditor.vue | 2 +- dashboard/src/composables/useVADRecording.ts | 47 ++- dashboard/src/i18n/composables.ts | 27 +- dashboard/src/i18n/locales/en-US/index.ts | 88 ++++ dashboard/src/i18n/locales/ja-JP/index.ts | 88 ++++ dashboard/src/i18n/locales/ru-RU/index.ts | 88 ++++ dashboard/src/i18n/locales/zh-CN/index.ts | 88 ++++ dashboard/src/i18n/translations.ts | 376 +----------------- dashboard/src/i18n/types.ts | 16 +- dashboard/src/main.ts | 41 -- dashboard/src/plugins/monaco.ts | 64 +++ dashboard/src/views/ConfigPage.vue | 2 +- dashboard/src/views/ConversationPage.vue | 2 +- .../ConversationWorkspacePage.vue | 2 +- dashboard/src/views/stats/StatsPage.vue | 5 +- 23 files changed, 515 insertions(+), 450 deletions(-) create mode 100644 dashboard/src/components/shared/LazyMonacoEditor.ts create mode 100644 dashboard/src/i18n/locales/en-US/index.ts create mode 100644 dashboard/src/i18n/locales/ja-JP/index.ts create mode 100644 dashboard/src/i18n/locales/ru-RU/index.ts create mode 100644 dashboard/src/i18n/locales/zh-CN/index.ts create mode 100644 dashboard/src/plugins/monaco.ts diff --git a/astrbot/dashboard/api/app.py b/astrbot/dashboard/api/app.py index 70d7858f4..90f2d59a9 100644 --- a/astrbot/dashboard/api/app.py +++ b/astrbot/dashboard/api/app.py @@ -5,6 +5,7 @@ from types import SimpleNamespace from fastapi import FastAPI, Request from fastapi.responses import JSONResponse from starlette.exceptions import HTTPException as StarletteHTTPException +from starlette.middleware.gzip import GZipMiddleware from astrbot.core import DEMO_MODE, LogBroker from astrbot.core.core_lifecycle import AstrBotCoreLifecycle @@ -95,6 +96,9 @@ def create_dashboard_asgi_app( docs_url=f"{API_V1_PREFIX}/docs", redoc_url=f"{API_V1_PREFIX}/redoc", ) + # Compress JS/CSS and other sizable responses; Starlette's GZipMiddleware + # skips text/event-stream, so SSE endpoints are unaffected. + app.add_middleware(GZipMiddleware, minimum_size=1024) app.state.core_lifecycle = core_lifecycle app.state.db = db app.state.jwt_secret = jwt_secret diff --git a/dashboard/index.html b/dashboard/index.html index 6d1597349..0ed1428d6 100644 --- a/dashboard/index.html +++ b/dashboard/index.html @@ -11,9 +11,6 @@ rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Outfit&family=Noto+Sans:wght@100..900&display=swap" /> - - - AstrBot Dashboard diff --git a/dashboard/src/components/extension/McpServersSection.vue b/dashboard/src/components/extension/McpServersSection.vue index a83d4dbf7..86c0fb772 100644 --- a/dashboard/src/components/extension/McpServersSection.vue +++ b/dashboard/src/components/extension/McpServersSection.vue @@ -429,7 +429,7 @@