perf: 优化旧版浏览器页面恢复与资源加载

- 页面恢复时延后版本检查并补齐根背景，减少白闪与首帧卡顿

- 面向 Chrome 90 收敛公共分包，按需加载资源弹窗和知识库面板

- 压缩工作流图标并补充延迟加载与可见性生命周期测试

easyflow-ui-admin/app/src/views/ai/workflow/WorkflowList.vue

@@ -64,6 +64,7 @@ import { $t } from '#/locales';
 import { router } from '#/router';
 import { useDictStore } from '#/store';
 import { copyTextWithFeedback } from '#/utils/clipboard-feedback';
+import { createLazyComponentController } from '#/utils/lazy-component';
 import { buildAbsoluteAppRouteUrl } from '#/utils/share-route-context';
 import AiResourceCornerMeta from '#/views/ai/shared/AiResourceCornerMeta.vue';
 import { confirmPublishSubmission } from '#/views/ai/shared/approval-application-reason';
@@ -82,7 +83,6 @@ import {
   mergeWorkflowListRouteQuery,
   parseWorkflowListRouteState,
 } from './workflow-list-route-state';
-import WorkflowModal from './WorkflowModal.vue';
 
 const ElXMarkdown = defineAsyncComponent(
   () => import('vue-element-plus-x/es/XMarkdown/index.js'),
@@ -116,6 +116,19 @@ interface ApiFieldDoc {
   placeholder: string;
 }
 
+interface WorkflowModalInstance {
+  openDialog: (row: Record<string, unknown>, importMode?: boolean) => void;
+}
+
+const {
+  component: WorkflowModalComponent,
+  componentRef: saveDialog,
+  ensureInstance: ensureWorkflowModal,
+  loading: workflowModalLoading,
+} = createLazyComponentController<WorkflowModalInstance>(
+  () => import('./WorkflowModal.vue'),
+);
+
 const primaryAction: CardPrimaryAction = {
   showIndicator: false,
   text: $t('button.design'),
@@ -283,7 +296,6 @@ onMounted(() => {
   getSideList();
 });
 const pageDataRef = ref();
-const saveDialog = ref();
 const selectedCategoryId = ref<number | string>(initialListState.categoryId);
 const searchKeyword = ref(initialListState.keyword);
 const currentPageNumber = ref(initialListState.pageNumber);
@@ -401,8 +413,14 @@ function handleSearch(keyword: string) {
 function reloadCurrentList() {
   pageDataRef.value?.reload?.();
 }
-function showDialog(row: any, importMode = false) {
-  saveDialog.value.openDialog({ ...row }, importMode);
+async function showDialog(row: any, importMode = false) {
+  try {
+    const modal = await ensureWorkflowModal();
+    modal.openDialog({ ...row }, importMode);
+  } catch (error) {
+    console.error('Failed to load workflow modal:', error);
+    ElMessage.error($t('message.getDataError'));
+  }
 }
 function resolveNavTitle(row: any) {
   return row?.title || row?.name || '';
@@ -1144,8 +1162,13 @@ function handleHeaderButtonClick(data: any) {
 </script>
 
 <template>
-  <div class="flex h-full flex-col gap-6 p-6">
-    <WorkflowModal ref="saveDialog" @reload="reloadCurrentList" />
+  <div v-loading="workflowModalLoading" class="flex h-full flex-col gap-6 p-6">
+    <component
+      :is="WorkflowModalComponent"
+      v-if="WorkflowModalComponent"
+      ref="saveDialog"
+      @reload="reloadCurrentList"
+    />
     <ElDialog
       v-model="apiInstructionVisible"
       :title="$t('aiWorkflow.apiInstruction')"