From f960c04474bae39348b95ef8ad924f15525069ba Mon Sep 17 00:00:00 2001
From: Jinny You <jinny@lottiefiles.com>
Date: Tue, 23 Apr 2024 11:16:28 +0900
Subject: [PATCH] web: memory stability++
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Call the explicit memory deletion—binded in function `delete()`, which is highly recommended by the Memory management in Emscripten guideline.

The function will guarantee that the WASM module is cleaned up from the memory.

see: https://emscripten.org/docs/porting/connecting_cpp_and_javascript/embind.html#memory-management

Additionally, WASM module's initialization part has been refactored to correspond to the change.
---
 web/src/lottie-player.ts | 23 +++++++----------------
 1 file changed, 7 insertions(+), 16 deletions(-)

diff --git a/web/src/lottie-player.ts b/web/src/lottie-player.ts
index a7c3889d..c9a5f045 100644
--- a/web/src/lottie-player.ts
+++ b/web/src/lottie-player.ts
@@ -30,11 +30,9 @@ import { THORVG_VERSION } from './version';
 type LottieJson = Map<PropertyKey, any>;
 type TvgModule = any;
 
-let _tvg: TvgModule;
 let _module: any;
 (async () => {  
   _module = await Module();
-  _tvg = new _module.TvgLottieAnimation();
 })();
 
 // Define library version
@@ -279,29 +277,21 @@ export class LottiePlayer extends LitElement {
   private _timer?: ReturnType<typeof setInterval>;
   private _observer?: IntersectionObserver;
 
-  constructor() {
-    super();
-    this._init();
-  }
-
   private async _init(): Promise<void> {
-    if (!_tvg) {
-      // throw new Error('ThorVG has not loaded');
+    if (!_module) {
+      //NOTE: ThorVG Module has not loaded
       return;
     }
 
-    this._TVG = _tvg;
-  }
-
-  private _delayedLoad(): void {
-    if (!_tvg || !this._timer) {
+    if (!this._timer) {
+      //NOTE: ThorVG Module has loaded, but called this function again
       return;
     }
 
     clearInterval(this._timer);
     this._timer = undefined;
 
-    this._TVG = _tvg;
+    this._TVG = new _module.TvgLottieAnimation();
 
     if (this.src) {
       this.load(this.src, this.mimeType);
@@ -317,7 +307,7 @@ export class LottiePlayer extends LitElement {
     this._observer.observe(this);
 
     if (!this._TVG) {
-      this._timer = setInterval(this._delayedLoad.bind(this), 100);
+      this._timer = setInterval(this._init.bind(this), 100);
       return;
     }
 
@@ -537,6 +527,7 @@ export class LottiePlayer extends LitElement {
       return;
     }
 
+    this._TVG.delete();
     this._TVG = null;
     this.currentState = PlayerState.Destroyed;