fix: fix memory leaks

Author: xuefei1313

packages/vrender-components/src/player/base-player.ts

@@ -390,4 +390,11 @@ export abstract class BasePlayer<T> extends AbstractComponent<Required<PlayerAtt
       value: this._data[dataIndex]
     });
   }
+
+  release(all: boolean) {
+    if (!this._sliderVisible) {
+      this._slider.release(all);
+    }
+    super.release(all);
+  }
 }

packages/vrender-components/src/slider/slider.ts

@@ -620,8 +620,8 @@ export class Slider extends AbstractComponent<Required<SliderAttributes>> {
         text: textConfig.formatter
           ? textConfig.formatter(this._tooltipState.value)
           : !this._isHorizontal && align === 'left'
-          ? `${this._tooltipState.value.toFixed(textConfig.precision ?? 0)} ≈`
-          : `≈ ${this._tooltipState.value.toFixed(textConfig.precision ?? 0)}`
+            ? `${this._tooltipState.value.toFixed(textConfig.precision ?? 0)} ≈`
+            : `≈ ${this._tooltipState.value.toFixed(textConfig.precision ?? 0)}`
       });
     }
   }
@@ -1121,7 +1121,7 @@ export class Slider extends AbstractComponent<Required<SliderAttributes>> {
      * 浏览器上的事件必须解绑，防止内存泄漏，场景树上的事件会自动解绑
      */
     super.release(all);
-    (vglobal.env === 'browser' ? vglobal : this.stage).addEventListener('touchmove', this._handleTouchMove, {
+    (vglobal.env === 'browser' ? vglobal : this.stage).removeEventListener('touchmove', this._handleTouchMove, {
       passive: false
     });
     this._clearAllDragEvents();

packages/vrender-core/src/common/event-listener-manager.ts

@@ -7,9 +7,15 @@ import type { IEventListenerManager } from '../interface/event-listener-manager'
 export class EventListenerManager implements IEventListenerManager {
   /**
    * Map that stores the mapping from original listeners to wrapped listeners
-   * Structure: Map<eventType, Map<originalListener, wrappedListener>>
+   * Structure: Map<eventType, Map<originalListener, Map<capture, wrappedRecord>>>
    */
-  protected _listenerMap: Map<string, Map<EventListenerOrEventListenerObject, EventListener>>;
+  protected _listenerMap: Map<
+    string,
+    Map<
+      EventListenerOrEventListenerObject,
+      Map<boolean, { wrappedListener: EventListener; options?: boolean | AddEventListenerOptions }>
+    >
+  >;
 
   /**
    * Transformer function that transforms the event
@@ -44,6 +50,16 @@ export class EventListenerManager implements IEventListenerManager {
       return;
     }
 
+    const capture = this._resolveCapture(options);
+    const once = this._resolveOnce(options);
+    const listenerTypeMap = this._getOrCreateListenerTypeMap(type);
+    const wrappedMap = this._getOrCreateWrappedMap(listenerTypeMap, listener);
+
+    // Align with native behavior: adding same (type, listener, capture) repeatedly is a no-op.
+    if (wrappedMap.has(capture)) {
+      return;
+    }
+
     // Create a wrapped listener that applies the transformation
     const wrappedListener = (event: Event) => {
       const transformedEvent = this._eventListenerTransformer(event);
@@ -52,13 +68,15 @@ export class EventListenerManager implements IEventListenerManager {
       } else if (listener.handleEvent) {
         listener.handleEvent(transformedEvent);
       }
+
+      // Native once listeners are removed automatically after dispatch, clear the mapping as well.
+      if (once) {
+        this._deleteListenerRecord(type, listener, capture);
+      }
     };
 
     // Store the mapping between original and wrapped listener
-    if (!this._listenerMap.has(type)) {
-      this._listenerMap.set(type, new Map());
-    }
-    this._listenerMap.get(type)!.set(listener, wrappedListener);
+    wrappedMap.set(capture, { wrappedListener, options });
 
     // Add the wrapped listener
     this._nativeAddEventListener(type, wrappedListener, options);
@@ -79,17 +97,12 @@ export class EventListenerManager implements IEventListenerManager {
       return;
     }
 
-    // Get the wrapped listener from our map
-    const wrappedListener = this._listenerMap.get(type)?.get(listener);
-    if (wrappedListener) {
+    const capture = this._resolveCapture(options);
+    const wrappedRecord = this._listenerMap.get(type)?.get(listener)?.get(capture);
+    if (wrappedRecord) {
       // Remove the wrapped listener
-      this._nativeRemoveEventListener(type, wrappedListener, options);
-
-      // Remove from our map
-      this._listenerMap.get(type)!.delete(listener);
-      if (this._listenerMap.get(type)!.size === 0) {
-        this._listenerMap.delete(type);
-      }
+      this._nativeRemoveEventListener(type, wrappedRecord.wrappedListener, capture);
+      this._deleteListenerRecord(type, listener, capture);
     }
   }
 
@@ -105,14 +118,74 @@ export class EventListenerManager implements IEventListenerManager {
    * Clear all event listeners
    */
   clearAllEventListeners(): void {
-    this._listenerMap.forEach((listenersMap, type) => {
-      listenersMap.forEach((wrappedListener, originalListener) => {
-        this._nativeRemoveEventListener(type, wrappedListener, undefined);
+    this._listenerMap.forEach((listenerMap, type) => {
+      listenerMap.forEach(wrappedMap => {
+        wrappedMap.forEach((wrappedRecord, capture) => {
+          this._nativeRemoveEventListener(type, wrappedRecord.wrappedListener, capture);
+        });
       });
     });
     this._listenerMap.clear();
   }
 
+  protected _resolveCapture(options?: boolean | EventListenerOptions | AddEventListenerOptions): boolean {
+    if (typeof options === 'boolean') {
+      return options;
+    }
+    return !!options?.capture;
+  }
+
+  protected _resolveOnce(options?: boolean | AddEventListenerOptions): boolean {
+    return typeof options === 'object' && !!options?.once;
+  }
+
+  protected _getOrCreateListenerTypeMap(
+    type: string
+  ): Map<
+    EventListenerOrEventListenerObject,
+    Map<boolean, { wrappedListener: EventListener; options?: boolean | AddEventListenerOptions }>
+  > {
+    let listenerTypeMap = this._listenerMap.get(type);
+    if (!listenerTypeMap) {
+      listenerTypeMap = new Map();
+      this._listenerMap.set(type, listenerTypeMap);
+    }
+    return listenerTypeMap;
+  }
+
+  protected _getOrCreateWrappedMap(
+    listenerTypeMap: Map<
+      EventListenerOrEventListenerObject,
+      Map<boolean, { wrappedListener: EventListener; options?: boolean | AddEventListenerOptions }>
+    >,
+    listener: EventListenerOrEventListenerObject
+  ): Map<boolean, { wrappedListener: EventListener; options?: boolean | AddEventListenerOptions }> {
+    let wrappedMap = listenerTypeMap.get(listener);
+    if (!wrappedMap) {
+      wrappedMap = new Map();
+      listenerTypeMap.set(listener, wrappedMap);
+    }
+    return wrappedMap;
+  }
+
+  protected _deleteListenerRecord(type: string, listener: EventListenerOrEventListenerObject, capture: boolean): void {
+    const listenerTypeMap = this._listenerMap.get(type);
+    if (!listenerTypeMap) {
+      return;
+    }
+    const wrappedMap = listenerTypeMap.get(listener);
+    if (!wrappedMap) {
+      return;
+    }
+    wrappedMap.delete(capture);
+    if (wrappedMap.size === 0) {
+      listenerTypeMap.delete(listener);
+    }
+    if (listenerTypeMap.size === 0) {
+      this._listenerMap.delete(type);
+    }
+  }
+
   /**
    * Native implementation of addEventListener
    * To be implemented by derived classes

packages/vrender-core/src/event/event-manager.ts

@@ -790,6 +790,13 @@ export class EventManager {
     const constructor = event.constructor;
 
     if (!this.eventPool.has(constructor as any)) {
+      this.eventPool.get(constructor as any).forEach(e => {
+        e.eventPhase = event.NONE;
+        e.currentTarget = null;
+        e.path = [];
+        e.detailPath = [];
+        e.target = null;
+      });
       this.eventPool.set(constructor as any, []);
     }
 

packages/vrender-core/src/graphic/graphic.ts

@@ -259,29 +259,29 @@ export abstract class Graphic<T extends Partial<IGraphicAttribute> = Partial<IGr
   declare y1WithoutTransform?: number;
 
   // aabbBounds，所有图形都需要有，所以初始化即赋值
-  protected declare _AABBBounds: IAABBBounds;
+  declare protected _AABBBounds: IAABBBounds;
   get AABBBounds(): IAABBBounds {
     return this.tryUpdateAABBBounds();
   }
   // 具有旋转的包围盒，部分图元需要，动态初始化
-  protected declare _OBBBounds?: IOBBBounds;
+  declare protected _OBBBounds?: IOBBBounds;
   get OBBBounds(): IOBBBounds {
     return this.tryUpdateOBBBounds();
   }
-  protected declare _globalAABBBounds: IAABBBounds;
+  declare protected _globalAABBBounds: IAABBBounds;
   // 全局包围盒，部分图元需要，动态初始化，建议使用AABBBounds
   get globalAABBBounds(): IAABBBounds {
     return this.tryUpdateGlobalAABBBounds();
   }
-  protected declare _transMatrix: Matrix;
+  declare protected _transMatrix: Matrix;
   get transMatrix(): Matrix {
     return this.tryUpdateLocalTransMatrix(true);
   }
-  protected declare _globalTransMatrix: Matrix;
+  declare protected _globalTransMatrix: Matrix;
   get globalTransMatrix(): Matrix {
     return this.tryUpdateGlobalTransMatrix(true);
   }
-  protected declare _updateTag: number;
+  declare protected _updateTag: number;
 
   // 上次更新的stamp
   declare stamp?: number;
@@ -1569,6 +1569,7 @@ export abstract class Graphic<T extends Partial<IGraphicAttribute> = Partial<IGr
     this.releaseStatus = 'released';
     this.stopAnimates();
     application.graphicService.onRelease(this);
+    super.release();
   }
 
   protected _emitCustomEvent(type: string, context?: any) {