From ad8c5f5452dc760b36c5c715678aa13dc377e378 Mon Sep 17 00:00:00 2001 From: yyh Date: Fri, 16 Jan 2026 21:31:56 +0800 Subject: [PATCH] perf: lazy load SkillMain component using next/dynamic Reduce initial bundle size by dynamically importing SkillMain component. This prevents loading the entire Skill module (including Monaco and Lexical editors) when users only access the Graph view. --- web/app/components/workflow-app/index.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/web/app/components/workflow-app/index.tsx b/web/app/components/workflow-app/index.tsx index f98085bdc6..cee481d473 100644 --- a/web/app/components/workflow-app/index.tsx +++ b/web/app/components/workflow-app/index.tsx @@ -2,6 +2,7 @@ import type { Features as FeaturesData } from '@/app/components/base/features/types' import type { InjectWorkflowStoreSliceFn } from '@/app/components/workflow/store' +import dynamic from 'next/dynamic' import { useSearchParams } from 'next/navigation' import { useQueryState } from 'nuqs' import { @@ -17,7 +18,6 @@ import WorkflowWithDefaultContext from '@/app/components/workflow' import { WorkflowContextProvider, } from '@/app/components/workflow/context' -import SkillMain from '@/app/components/workflow/skill/main' import { useWorkflowStore } from '@/app/components/workflow/store' import { useTriggerStatusStore } from '@/app/components/workflow/store/trigger-status' import { @@ -41,6 +41,10 @@ import { import { parseAsViewType, WORKFLOW_VIEW_PARAM_KEY } from './search-params' import { createWorkflowSlice } from './store/workflow/workflow-slice' +const SkillMain = dynamic(() => import('@/app/components/workflow/skill/main'), { + ssr: false, +}) + const WorkflowAppWithAdditionalContext = () => { const { data,