merged hotfix 2.9.1 into 2.10.0 release

uguraslan · uguraslan · commit 53211f6c730d · 2023-04-21T19:34:55.000+02:00
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,7 +1,7 @@
 # Changelog
 
 ## v2.10.0
-*20 apr 2023*
+*24 apr 2023*
 
 - Integrated `Vite` to replace `rollup` bundler and integrated `Vitest` for unit testing
 - Implemented word wrapping support on zero-width breaking spaces (#450) (docs: [Word Wrap in Non-Latin Based Languages](https://lightningjs.io/docs/#/lightning-core-reference/RenderEngine/Textures/Text?id=word-wrap-in-non-latin-based-languages) ) 
@@ -13,6 +13,12 @@
 - Fixed TypeScript error with getByRef() when using generic type param as Ref value (#444)
 - Implemented default loose type configs for TypeScript.
 
+## v2.9.1
+
+*21 apr 2023*
+
+- 🔥 Hotfix for memory leak when `pauseRafLoopOnIdle` is enabled (introduced in v2.7.0)
+- Implemented additional cleanup of Lightning code that gets stuck on the heap after calling `destroy`
 
 ## v2.9.0
 *16 feb 2023*
diff --git a/examples/destroy/index.html b/examples/destroy/index.html
@@ -0,0 +1,96 @@
+<!--
+ If not stated otherwise in this file or this component's LICENSE file the
+ following copyright and licenses apply:
+
+ Copyright 2020 Metrological
+
+ Licensed under the Apache License, Version 2.0 (the License);
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+-->
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8" />
+    <script src="../../../devtools/lightning-inspect.js"></script>
+</head>
+<body style="margin: 0; padding: 0">
+    <script type="module">
+        import lng from '../../../src/lightning.mjs';
+        //attachInspector(lng)
+
+        let app = null;
+        let canvas = null;
+        const loadApp = () => {
+            class BasicUsageExample extends lng.Application {
+                static _template() {
+                    return {
+                        Bg: {
+                            src: "../landscape.jpg", scale: 1,
+                        },
+                        Primary: {
+                            Main: {rect: true, renderToTexture: true, w: 900, h: 900, colorLeft: 0x000000FF, colorRight: 0xFF0000FF
+                            },
+                            App: {alpha: 0.5, rect: true, w: 100, h: 100, scale: 1, texture: {type: lng.textures.NoiseTexture, x: 0, y: 0, w: 1000, h: 1000}}
+                        },
+                        Overlay: {}
+                    }
+                }
+
+                _handleLeft() {
+                    this.tag('Primary').setSmooth('x', this.tag('Primary').getSmooth('x') - 100)
+                }
+
+                _handleRight() {
+                    this.tag('Primary').setSmooth('x', this.tag('Primary').getSmooth('x') + 100)
+                    this._setState("Loading");
+                }
+
+                _handleUp() {
+                    this.tag('Primary').setSmooth('y', this.tag('Primary').getSmooth('y') - 100)
+                }
+
+                _handleDown() {
+                    this.tag('Primary').setSmooth('y', this.tag('Primary').getSmooth('y') + 100)
+                }
+
+            }
+
+            const options = {
+                stage: {
+                    w: 900, h: 900, clearColor: 0xFF000000, canvas2d: false, useImageWorker: false,
+                    forceTxCanvasSource: true,
+                    pauseRafLoopOnIdle: true
+                }, debug: true}
+
+            app = new BasicUsageExample(options);
+            canvas = app.stage.getCanvas()
+            document.body.appendChild(app.stage.getCanvas());
+        }
+
+
+        document.addEventListener("keydown", (e) => {
+            // spacebar
+            if (e.keyCode === 32) {
+                if (app) {
+                    app.destroy();
+                    document.body.removeChild(canvas);
+                    canvas = null;
+                    return app = null;
+                }
+
+                loadApp();
+            }
+        })
+    </script>
+</body>
+</html>
diff --git a/src/platforms/browser/ImageWorker.mjs b/src/platforms/browser/ImageWorker.mjs
@@ -30,6 +30,12 @@ export default class ImageWorker {
         if (this._worker) {
             this._worker.terminate();
         }
+
+        this._items = null;
+        this._worker = null;
+
+        delete this._items;
+        delete this._worker;        
     }
 
     _initWorker() {
diff --git a/src/platforms/browser/WebPlatform.mjs b/src/platforms/browser/WebPlatform.mjs
@@ -50,11 +50,17 @@ export default class WebPlatform {
         if (this._imageWorker) {
             this._imageWorker.destroy();
         }
+
+        clearInterval(this._loopHandler);
+
         this._removeKeyHandler();
         this._removeClickHandler();
         this._removeHoverHandler();
         this._removeScrollWheelHandler();
         this._removeVisibilityChangeHandler();
+
+        this.stage = null;
+        delete this.stage;
     }
 
     startLoop() {
diff --git a/src/renderer/c2d/C2dRenderer.mjs b/src/renderer/c2d/C2dRenderer.mjs
@@ -38,6 +38,9 @@ export default class C2dRenderer extends Renderer {
 
     destroy() {
         this.tintManager.destroy();
+
+        this.tintManager = null;
+        delete this.tintManager;
     }
 
     _createDefaultShader(ctx) {
diff --git a/src/renderer/c2d/C2dTextureTintManager.mjs b/src/renderer/c2d/C2dTextureTintManager.mjs
@@ -27,6 +27,9 @@ export default class C2dTextureTintManager {
 
     destroy() {
         this.gc(true);
+
+        this.stage = null;
+        delete this.stage;
     }
 
     _addMemoryUsage(delta) {
diff --git a/src/renderer/webgl/WebGLCoreRenderExecutor.mjs b/src/renderer/webgl/WebGLCoreRenderExecutor.mjs
@@ -64,6 +64,9 @@ export default class WebGLCoreRenderExecutor extends CoreRenderExecutor {
         super.destroy();
         this.gl.deleteBuffer(this._attribsBuffer);
         this.gl.deleteBuffer(this._quadsBuffer);
+
+        this.gl = null;
+        delete this.gl;
     }
 
     _reset() {
diff --git a/src/renderer/webgl/WebGLRenderer.mjs b/src/renderer/webgl/WebGLRenderer.mjs
@@ -46,6 +46,12 @@ export default class WebGLRenderer extends Renderer {
 
     destroy() {
         this.shaderPrograms.forEach(shaderProgram => shaderProgram.destroy());
+
+        this.shaderPrograms = null;
+        this._compressedTextureExtensions = null;
+
+        delete this.shaderPrograms;
+        delete this._compressedTextureExtensions;
     }
 
     _createDefaultShader(ctx) {
diff --git a/src/renderer/webgl/WebGLShaderProgram.mjs b/src/renderer/webgl/WebGLShaderProgram.mjs
@@ -28,6 +28,7 @@ export default class WebGLShaderProgram {
         this.fragmentShaderSource = fragmentShaderSource;
 
         this._program = null;
+        this.gl = null;
 
         this._uniformLocations = new Map();
         this._attributeLocations = new Map();
@@ -109,8 +110,24 @@ export default class WebGLShaderProgram {
     destroy() {
         if (this._program) {
             this.gl.deleteProgram(this._program);
-            this._program = null;
         }
+
+        this._attributeLocations = null;
+        this._currentUniformValues = null;
+        this.fragmentShaderSource = null;
+        this._program = null;
+        this.gl = null;
+        this._uniformLocations = null;
+        this.vertexShaderSource = null;  
+
+        delete this.vertexShaderSource;
+        delete this._program;        
+        delete this._currentUniformValues;
+        delete this.fragmentShaderSource;
+        delete this.gl;
+        delete this._uniformLocations;
+        delete this._attributeLocations;
+
     }
 
     get glProgram() {
diff --git a/src/tree/Stage.mjs b/src/tree/Stage.mjs
@@ -140,7 +140,7 @@ export default class Stage extends EventEmitter {
 
         try {
             return !!window.WebGLRenderingContext;
-        } catch(e) {
+        } catch (e) {
             return false;
         }
     }
@@ -188,7 +188,7 @@ export default class Stage extends EventEmitter {
         opt('memoryPressure', 24e6);
         opt('bufferMemory', 2e6);
         opt('textRenderIssueMargin', 0);
-        opt('fontSharp',{precision:0.6666666667, fontSize: 24})
+        opt('fontSharp', { precision: 0.6666666667, fontSize: 24 })
         opt('clearColor', [0, 0, 0, 0]);
         opt('defaultFontFace', 'sans-serif');
         opt('fixedDt', 0);
@@ -238,6 +238,32 @@ export default class Stage extends EventEmitter {
         this.ctx.destroy();
         this.textureManager.destroy();
         this._renderer.destroy();
+
+        // clear last rendered frame
+        if (this.gl) {
+            this.gl.clearColor(0.0, 0.0, 0.0, 0.0);
+            this.gl.clear(this.gl.COLOR_BUFFER_BIT);
+        } else if (this.c2d) {
+            this.c2d.clearRect(
+                0, 0, this.c2d.canvas.width, this.c2d.canvas.height
+            );
+        }
+
+        this.gl = null;
+        this.c2d = null;
+        this.ctx = null;
+        this._options = null;
+        this.platform = null;
+        this.textureManager = null;
+        this._renderer = null;
+
+        delete this.gl;
+        delete this.c2d;
+        delete this.ctx;
+        delete this._options;
+        delete this.platform;
+        delete this.textureManager;
+        delete this._renderer;
     }
 
     stop() {
@@ -511,10 +537,10 @@ export default class Stage extends EventEmitter {
         }
     }
 
-    getChildrenByPosition(x, y){
+    getChildrenByPosition(x, y) {
         const children = [];
         this.root.core.update();
-        this.root.core.collectAtCoord(x,y,children);
+        this.root.core.collectAtCoord(x, y, children);
 
         return children;
     }
diff --git a/src/tree/TextureThrottler.mjs b/src/tree/TextureThrottler.mjs
@@ -36,6 +36,11 @@ export default class TextureThrottler {
     destroy() {
         this._sources = [];
         this._data = [];
+        this.stage = null;
+
+        delete this._sources;
+        delete this._data;
+        delete this.stage;
     }
 
     processSome() {
diff --git a/src/tree/core/CoreContext.mjs b/src/tree/core/CoreContext.mjs
@@ -49,6 +49,21 @@ export default class CoreContext {
     destroy() {
         this._renderTexturePool.forEach(texture => this._freeRenderTexture(texture));
         this._usedMemory = 0;
+
+        this.stage = null;
+        this.root = null;
+
+        this.renderState = null;
+        this.renderExec = null;
+        this._renderTexturePool = null;
+        this._zSorts = null;
+
+        delete this.stage;
+        delete this.root;
+        delete this.renderState;
+        delete this.renderExec;
+        delete this._renderTexturePool;
+        delete this._zSorts;
     }
 
     hasRenderUpdates() {
diff --git a/src/tree/core/CoreRenderExecutor.mjs b/src/tree/core/CoreRenderExecutor.mjs
@@ -29,6 +29,13 @@ export default class CoreRenderExecutor {
     }
 
     destroy() {
+        this.ctx = null;
+        this.renderState = null;
+        this.gl = null;
+
+        delete this.ctx;
+        delete this.renderState;
+        delete this.gl;
     }
 
     _reset() {

Original file line number	Diff line number	Diff line change
`@@ -30,6 +30,12 @@ export default class ImageWorker {`
`30`	`30`	`if (this._worker) {`
`31`	`31`	`this._worker.terminate();`
`32`	`32`	`}`
	`33`	`+`
	`34`	`+ this._items = null;`
	`35`	`+ this._worker = null;`
	`36`	`+`
	`37`	`+ delete this._items;`
	`38`	`+ delete this._worker;`
`33`	`39`	`}`
`34`	`40`
`35`	`41`	`_initWorker() {`
Original file line number	Diff line number	Diff line change
`@@ -38,6 +38,9 @@ export default class C2dRenderer extends Renderer {`
`38`	`38`
`39`	`39`	`destroy() {`
`40`	`40`	`this.tintManager.destroy();`
	`41`	`+`
	`42`	`+ this.tintManager = null;`
	`43`	`+ delete this.tintManager;`
`41`	`44`	`}`
`42`	`45`
`43`	`46`	`_createDefaultShader(ctx) {`
Original file line number	Diff line number	Diff line change
`@@ -27,6 +27,9 @@ export default class C2dTextureTintManager {`
`27`	`27`
`28`	`28`	`destroy() {`
`29`	`29`	`this.gc(true);`
	`30`	`+`
	`31`	`+ this.stage = null;`
	`32`	`+ delete this.stage;`
`30`	`33`	`}`
`31`	`34`
`32`	`35`	`_addMemoryUsage(delta) {`
Original file line number	Diff line number	Diff line change
`@@ -64,6 +64,9 @@ export default class WebGLCoreRenderExecutor extends CoreRenderExecutor {`
`64`	`64`	`super.destroy();`
`65`	`65`	`this.gl.deleteBuffer(this._attribsBuffer);`
`66`	`66`	`this.gl.deleteBuffer(this._quadsBuffer);`
	`67`	`+`
	`68`	`+ this.gl = null;`
	`69`	`+ delete this.gl;`
`67`	`70`	`}`
`68`	`71`
`69`	`72`	`_reset() {`
Original file line number	Diff line number	Diff line change
`@@ -29,6 +29,13 @@ export default class CoreRenderExecutor {`
`29`	`29`	`}`
`30`	`30`
`31`	`31`	`destroy() {`
	`32`	`+ this.ctx = null;`
	`33`	`+ this.renderState = null;`
	`34`	`+ this.gl = null;`
	`35`	`+`
	`36`	`+ delete this.ctx;`
	`37`	`+ delete this.renderState;`
	`38`	`+ delete this.gl;`
`32`	`39`	`}`
`33`	`40`
`34`	`41`	`_reset() {`