From b71c75e86fe0acdbdc2dd756e355b8be66ede49d Mon Sep 17 00:00:00 2001
From: admin <admin@viaeon.com>
Date: Mon, 20 Apr 2026 06:41:50 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20monaco-editor=20=E6=94=B9=E4=B8=BA?=
 =?UTF-8?q?=E5=8A=A8=E6=80=81=E5=AF=BC=E5=85=A5=EF=BC=8C=E7=A7=BB=E9=99=A4?=
 =?UTF-8?q?=E5=86=85=E5=AD=98=E9=99=90=E5=88=B6=20-=20=E9=99=8D=E4=BD=8E?=
 =?UTF-8?q?=E6=9E=84=E5=BB=BA=E8=B5=84=E6=BA=90=E9=9C=80=E6=B1=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/package.json                    |  2 +-
 web/src/pages/access/FileEditor.tsx | 37 ++++-------------------------
 2 files changed, 5 insertions(+), 34 deletions(-)

diff --git a/web/package.json b/web/package.json
index e308bc8fa..c28616028 100644
--- a/web/package.json
+++ b/web/package.json
@@ -5,7 +5,7 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "NODE_OPTIONS=--max-old-space-size=6144 tsc && vite build",
+    "build": "tsc && vite build",
     "preview": "vite preview"
   },
   "dependencies": {
diff --git a/web/src/pages/access/FileEditor.tsx b/web/src/pages/access/FileEditor.tsx
index 5ec265756..085ef0da7 100644
--- a/web/src/pages/access/FileEditor.tsx
+++ b/web/src/pages/access/FileEditor.tsx
@@ -1,43 +1,12 @@
-import React, {useEffect, useState} from 'react';
+import React, {Suspense, useEffect, useState} from 'react';
 import {App, Button, ConfigProvider, Empty, Modal, Tabs, theme, Tooltip} from "antd";
 import {Copy, RefreshCw, Save, X} from "lucide-react";
-import {Editor as MonacoEditor, loader} from '@monaco-editor/react';
 import {useTranslation} from "react-i18next";
 import copy from "copy-to-clipboard";
 import fileSystemApi from "@/api/filesystem-api";
 import {OpenFile} from "@/pages/access/hooks/use-file-editor";
-import * as monaco from 'monaco-editor';
-import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
-import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker';
-import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker';
-import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker';
-import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker';
 
-self.MonacoEnvironment = {
-    getWorker(_, label) {
-        if (label === 'json') {
-            return new jsonWorker();
-        }
-        if (label === 'css' || label === 'scss' || label === 'less') {
-            return new cssWorker();
-        }
-        if (label === 'html' || label === 'handlebars' || label === 'razor') {
-            return new htmlWorker();
-        }
-        if (label === 'typescript' || label === 'javascript') {
-            return new tsWorker();
-        }
-        return new editorWorker();
-    },
-};
-
-loader.config({monaco});
-
-loader.init().then(() => {
-    console.log('monaco init success')
-}).catch((error) => {
-    console.error('monaco init error', error);
-});
+const MonacoEditor = React.lazy(() => import('@monaco-editor/react').then(mod => ({default: mod.Editor})));
 
 interface Props {
     fsId: string
@@ -150,6 +119,7 @@ const FileEditor: React.FC<Props> = ({
             ),
             children: (
                 <div className="h-full">
+                    <Suspense fallback={<div className="flex items-center justify-center h-full text-gray-400">Loading editor...</div>}>
                     <MonacoEditor
                         language={item.language}
                         height={window.innerHeight * 0.7}
@@ -176,6 +146,7 @@ const FileEditor: React.FC<Props> = ({
                             }
                         }}
                     />
+                    </Suspense>
                 </div>
             ),
         };