fix: 修复组件非首次加载变慢的问题

Author: winjo

packages/alex/src/api/createApp.tsx

@@ -144,7 +144,10 @@ export function createApp({ appConfig, runtimeConfig }: IConfig): IAppInstance {
     if (codeEditorService) {
       codeEditorService._value = null;
     }
-    (monaco as any).services.StaticServices.modeService._value = null;
+    const modeService = (monaco as any).services.StaticServices.modeService;
+    // 需要把 LanguageRegistry dispose，否则二次加载会重复触发事件，导致加载越来越慢
+    modeService._value._registry.dispose();
+    modeService._value = null;
     // @ts-ignore
     // common-di 通过参数实例化无法自动 dispose
     app.injector.get(WorkerExtensionService)?.protocol?._locals?.forEach((instance) => {

packages/alex/src/api/createEditor.tsx

@@ -128,7 +128,10 @@ export function createEditor({ appConfig, runtimeConfig }: IConfig): IAppInstanc
     if (codeEditorService) {
       codeEditorService._value = null;
     }
-    (monaco as any).services.StaticServices.modeService._value = null;
+    const modeService = (monaco as any).services.StaticServices.modeService;
+    // 需要把 LanguageRegistry dispose，否则二次加载会重复触发事件，导致加载越来越慢
+    modeService._value._registry.dispose();
+    modeService._value = null;
     app.injector.disposeAll();
   };
 

packages/core/src/client/textmate-language-grammar/language-grammar.service.ts

@@ -1,5 +1,6 @@
 import { Autowired, Injectable } from '@ali/common-di';
-import { Disposable, Deferred, Emitter, Event, URI } from '@ali/ide-core-common';
+import { MonacoContribution, ClientAppContribution } from '@ali/ide-core-browser';
+import { Disposable, Deferred, Emitter, Event, URI, Domain } from '@ali/ide-core-common';
 import { TextmateService } from '@ali/ide-monaco/lib/browser/textmate.service';
 import { LanguagesContribution, GrammarsContribution } from '@ali/ide-monaco';
 
@@ -12,11 +13,17 @@ class SingleEventEmitter<T> extends Emitter<T> {
   }
 }
 
-@Injectable()
-export class LanguageGrammarRegistrationService extends Disposable {
+@Domain(ClientAppContribution, MonacoContribution)
+export class LanguageGrammarRegistrationService
+  extends Disposable
+  implements ClientAppContribution, MonacoContribution {
   static languageEmitter = new SingleEventEmitter<LanguagesContribution>();
   static grammarEmitter = new SingleEventEmitter<GrammarsContribution>();
 
+  private _monacoLoaded = new Deferred<void>();
+
+  private _ModesRegistry: { _languages: any[] } | null = null;
+
   @Autowired(TextmateService)
   private readonly textMateService: TextmateService;
 
@@ -25,6 +32,21 @@ export class LanguageGrammarRegistrationService extends Disposable {
     return this.languageDidRegisterDeferred.promise;
   }
 
+  async initialize() {
+    await this._monacoLoaded.promise;
+    const vsRequire: any = (window as any).amdLoader.require;
+    return new Promise<void>((resolve) => {
+      vsRequire(['vs/editor/common/modes/modesRegistry'], ({ ModesRegistry }) => {
+        this._ModesRegistry = ModesRegistry;
+        resolve();
+      });
+    });
+  }
+
+  onMonacoLoaded() {
+    this._monacoLoaded.resolve();
+  }
+
   async initRegisterLanguageAndGrammar() {
     // 没啥作用，只是确保传参类型正确
     const uri = new URI();
@@ -51,6 +73,10 @@ export class LanguageGrammarRegistrationService extends Disposable {
 
   dispose() {
     this.clear();
+    // 清除缓存的语言，减少 monaco 内部的遍历
+    if (this._ModesRegistry) {
+      this._ModesRegistry._languages = [];
+    }
   }
 }