@openreplay/tracker 3.5.16-beta.1 → 3.5.16-beta.2

package/cjs/app/index.d.ts

@@ -1,5 +1,5 @@
 import type Message from "../common/messages.js";
-import Nodes from "./nodes.js";
+import Nodes, { CheckOptions } from "./nodes.js";
 import Sanitizer from "./sanitizer.js";
 import Ticker from "./ticker.js";
 import Logger from "./logger.js";
@@ -49,7 +49,7 @@ declare type AppOptions = {
     maxMemorySize: number;
     memoryCheckInterval: number;
     onStart?: StartCallback;
-} & WebworkerOptions;
+} & WebworkerOptions & CheckOptions;
 export declare type Options = AppOptions & ObserverOptions & SanitizerOptions;
 export declare const DEFAULT_INGEST_POINT = "https://api.openreplay.com/ingest";
 export default class App {
@@ -62,7 +62,6 @@ export default class App {
     readonly session: Session;
     readonly localStorage: Storage;
     readonly sessionStorage: Storage;
-    private gc;
     private readonly messages;
     private readonly observer;
     private readonly startCallbacks;

package/cjs/app/index.js

@@ -27,12 +27,13 @@ class App {
         // if (options.onStart !== undefined) {
         //   deprecationWarn("'onStart' option", "tracker.start().then(/* handle session info */)")
         // } ?? maybe onStart is good
+        // private gc?: NodeJS.Timer = undefined;
         this.messages = [];
         this.startCallbacks = [];
         this.stopCallbacks = [];
         this.commitCallbacks = [];
         this.activityState = ActivityState.NotActive;
-        this.version = '3.5.16-beta.1'; // TODO: version compatability check inside each plugin.
+        this.version = '3.5.16-beta.2'; // TODO: version compatability check inside each plugin.
         this.projectKey = projectKey;
         this.options = Object.assign({
             revID: '',
@@ -48,12 +49,12 @@ class App {
             __debug_report_edp: null,
             localStorage: window.localStorage,
             sessionStorage: window.sessionStorage,
-            maxMemorySize: 650 * 1e6,
+            maxMemorySize: 550 * 1e6,
             memoryCheckInterval: 2 * 60 * 1000,
         }, options);
         this.revID = this.options.revID;
         this.sanitizer = new sanitizer_js_1.default(this, options);
-        this.nodes = new nodes_js_1.default(this.options.node_id);
+        this.nodes = new nodes_js_1.default(this.options.node_id, this.options.maxMemorySize, this.options.memoryCheckInterval);
         this.observer = new top_observer_js_1.default(this, options);
         this.ticker = new ticker_js_1.default(this);
         this.ticker.attach(() => this.commit());
@@ -145,6 +146,7 @@ class App {
                 fn.apply(this, args);
             }
             catch (e) {
+                console.error(e);
                 app._debug("safe_fn_call", e);
                 // time: timestamp(),
                 // name: e.name,
@@ -318,16 +320,16 @@ class App {
             this.observer.observe();
             this.ticker.start();
             this.notify.log("OpenReplay tracking started.");
-            // GC
-            if (this.gc) {
-                clearInterval(this.gc);
-            }
-            this.gc = setInterval(() => {
-                // @ts-ignore
-                if (window.performance.memory.usedJSHeapSize > this.options.maxMemorySize) {
-                    this.restart();
-                }
-            }, this.options.memoryCheckInterval);
+            // // GC
+            // if (!this.gc) {
+            //   this.gc = setInterval(() => {
+            //   console.log('checking')
+            //   // @ts-ignore
+            //   if (window.performance.memory.usedJSHeapSize > this.options.maxMemorySize) {
+            //     this.restart();
+            //   }
+            //   }, this.options.memoryCheckInterval)
+            // }
             // get rid of onStart ?
             if (typeof this.options.onStart === 'function') {
                 this.options.onStart(onStartInfo);
@@ -364,6 +366,7 @@ class App {
     stop(calledFromAPI = false, restarting = false) {
         if (this.activityState !== ActivityState.NotActive) {
             try {
+                // this.gc && clearInterval(this.gc)
                 this.sanitizer.clear();
                 this.observer.disconnect();
                 this.nodes.clear();

package/cjs/app/nodes.d.ts

@@ -1,14 +1,21 @@
+/// <reference types="node" resolution-mode="require"/>
 declare type NodeCallback = (node: Node, isStart: boolean) => void;
+export interface CheckOptions {
+    maxMemorySize: number;
+    memoryCheckInterval: number;
+}
 export default class Nodes {
     private readonly node_id;
     private nodes;
     private readonly nodeCallbacks;
     private readonly elementListeners;
-    constructor(node_id: string);
+    gc: NodeJS.Timer | undefined;
+    constructor(node_id: string, maxMemorySize: CheckOptions["maxMemorySize"], memoryCheckInterval: CheckOptions["memoryCheckInterval"]);
     attachNodeCallback(nodeCallback: NodeCallback): void;
     attachElementListener(type: string, node: Element, elementListener: EventListener): void;
     registerNode(node: Node): [id: number, isNew: boolean];
     unregisterNode(node: Node): number | undefined;
+    cleanTree(): void;
     callNodeCallbacks(node: Node, isStart: boolean): void;
     getID(node: Node): number | undefined;
     getNode(id: number): Node | undefined;

package/cjs/app/nodes.js

@@ -1,11 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 class Nodes {
-    constructor(node_id) {
+    constructor(node_id, maxMemorySize, memoryCheckInterval) {
         this.node_id = node_id;
         this.nodes = [];
         this.nodeCallbacks = [];
         this.elementListeners = new Map();
+        this.gc = setInterval(() => {
+            // @ts-ignore should use settings object here
+            if (window.performance.memory.usedJSHeapSize > maxMemorySize) {
+                this.cleanTree();
+            }
+        }, memoryCheckInterval);
     }
     attachNodeCallback(nodeCallback) {
         this.nodeCallbacks.push(nodeCallback);
@@ -47,12 +53,23 @@ class Nodes {
         }
         return id;
     }
-    // cleanTree() {
-    //   if (this.nodes.length > 10000) {
-    //     this.nodes = this.nodes.filter((n) => n !== undefined && document.contains(n))
-    //   }
-    //   return;
-    // }
+    cleanTree() {
+        // sadly we keep empty items in array here resulting in some memory still being used
+        // but its still better than keeping dead nodes or undef elements
+        // plus we keep our index positions for new/alive nodes
+        // performance test: 3ms for 30k nodes with 17k dead ones
+        for (let i = 0; i < this.nodes.length; i++) {
+            const node = this.nodes[i];
+            if (node === undefined) {
+                delete this.nodes[i];
+                continue;
+            }
+            if (!document.contains(node)) {
+                this.unregisterNode(node);
+                delete this.nodes[i];
+            }
+        }
+    }
     callNodeCallbacks(node, isStart) {
         this.nodeCallbacks.forEach((cb) => cb(node, isStart));
     }
@@ -71,6 +88,10 @@ class Nodes {
             this.unregisterNode(node);
         }
         this.nodes.length = 0;
+        if (this.gc) {
+            clearInterval(this.gc);
+            this.gc = undefined;
+        }
     }
 }
 exports.default = Nodes;

package/cjs/index.js

@@ -127,7 +127,7 @@ class API {
             // no-cors issue only with text/plain or not-set Content-Type
             // req.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
             req.send(JSON.stringify({
-                trackerVersion: '3.5.16-beta.1',
+                trackerVersion: '3.5.16-beta.2',
                 projectKey: options.projectKey,
                 doNotTrack,
                 // TODO: add precise reason (an exact API missing)

package/lib/app/index.d.ts

@@ -1,5 +1,5 @@
 import type Message from "../common/messages.js";
-import Nodes from "./nodes.js";
+import Nodes, { CheckOptions } from "./nodes.js";
 import Sanitizer from "./sanitizer.js";
 import Ticker from "./ticker.js";
 import Logger from "./logger.js";
@@ -49,7 +49,7 @@ declare type AppOptions = {
     maxMemorySize: number;
     memoryCheckInterval: number;
     onStart?: StartCallback;
-} & WebworkerOptions;
+} & WebworkerOptions & CheckOptions;
 export declare type Options = AppOptions & ObserverOptions & SanitizerOptions;
 export declare const DEFAULT_INGEST_POINT = "https://api.openreplay.com/ingest";
 export default class App {
@@ -62,7 +62,6 @@ export default class App {
     readonly session: Session;
     readonly localStorage: Storage;
     readonly sessionStorage: Storage;
-    private gc;
     private readonly messages;
     private readonly observer;
     private readonly startCallbacks;

package/lib/app/index.js

@@ -24,12 +24,13 @@ export default class App {
         // if (options.onStart !== undefined) {
         //   deprecationWarn("'onStart' option", "tracker.start().then(/* handle session info */)")
         // } ?? maybe onStart is good
+        // private gc?: NodeJS.Timer = undefined;
         this.messages = [];
         this.startCallbacks = [];
         this.stopCallbacks = [];
         this.commitCallbacks = [];
         this.activityState = ActivityState.NotActive;
-        this.version = '3.5.16-beta.1'; // TODO: version compatability check inside each plugin.
+        this.version = '3.5.16-beta.2'; // TODO: version compatability check inside each plugin.
         this.projectKey = projectKey;
         this.options = Object.assign({
             revID: '',
@@ -45,12 +46,12 @@ export default class App {
             __debug_report_edp: null,
             localStorage: window.localStorage,
             sessionStorage: window.sessionStorage,
-            maxMemorySize: 650 * 1e6,
+            maxMemorySize: 550 * 1e6,
             memoryCheckInterval: 2 * 60 * 1000,
         }, options);
         this.revID = this.options.revID;
         this.sanitizer = new Sanitizer(this, options);
-        this.nodes = new Nodes(this.options.node_id);
+        this.nodes = new Nodes(this.options.node_id, this.options.maxMemorySize, this.options.memoryCheckInterval);
         this.observer = new Observer(this, options);
         this.ticker = new Ticker(this);
         this.ticker.attach(() => this.commit());
@@ -142,6 +143,7 @@ export default class App {
                 fn.apply(this, args);
             }
             catch (e) {
+                console.error(e);
                 app._debug("safe_fn_call", e);
                 // time: timestamp(),
                 // name: e.name,
@@ -315,16 +317,16 @@ export default class App {
             this.observer.observe();
             this.ticker.start();
             this.notify.log("OpenReplay tracking started.");
-            // GC
-            if (this.gc) {
-                clearInterval(this.gc);
-            }
-            this.gc = setInterval(() => {
-                // @ts-ignore
-                if (window.performance.memory.usedJSHeapSize > this.options.maxMemorySize) {
-                    this.restart();
-                }
-            }, this.options.memoryCheckInterval);
+            // // GC
+            // if (!this.gc) {
+            //   this.gc = setInterval(() => {
+            //   console.log('checking')
+            //   // @ts-ignore
+            //   if (window.performance.memory.usedJSHeapSize > this.options.maxMemorySize) {
+            //     this.restart();
+            //   }
+            //   }, this.options.memoryCheckInterval)
+            // }
             // get rid of onStart ?
             if (typeof this.options.onStart === 'function') {
                 this.options.onStart(onStartInfo);
@@ -361,6 +363,7 @@ export default class App {
     stop(calledFromAPI = false, restarting = false) {
         if (this.activityState !== ActivityState.NotActive) {
             try {
+                // this.gc && clearInterval(this.gc)
                 this.sanitizer.clear();
                 this.observer.disconnect();
                 this.nodes.clear();

package/lib/app/nodes.d.ts

@@ -1,14 +1,21 @@
+/// <reference types="node" resolution-mode="require"/>
 declare type NodeCallback = (node: Node, isStart: boolean) => void;
+export interface CheckOptions {
+    maxMemorySize: number;
+    memoryCheckInterval: number;
+}
 export default class Nodes {
     private readonly node_id;
     private nodes;
     private readonly nodeCallbacks;
     private readonly elementListeners;
-    constructor(node_id: string);
+    gc: NodeJS.Timer | undefined;
+    constructor(node_id: string, maxMemorySize: CheckOptions["maxMemorySize"], memoryCheckInterval: CheckOptions["memoryCheckInterval"]);
     attachNodeCallback(nodeCallback: NodeCallback): void;
     attachElementListener(type: string, node: Element, elementListener: EventListener): void;
     registerNode(node: Node): [id: number, isNew: boolean];
     unregisterNode(node: Node): number | undefined;
+    cleanTree(): void;
     callNodeCallbacks(node: Node, isStart: boolean): void;
     getID(node: Node): number | undefined;
     getNode(id: number): Node | undefined;

package/lib/app/nodes.js

@@ -1,9 +1,15 @@
 export default class Nodes {
-    constructor(node_id) {
+    constructor(node_id, maxMemorySize, memoryCheckInterval) {
         this.node_id = node_id;
         this.nodes = [];
         this.nodeCallbacks = [];
         this.elementListeners = new Map();
+        this.gc = setInterval(() => {
+            // @ts-ignore should use settings object here
+            if (window.performance.memory.usedJSHeapSize > maxMemorySize) {
+                this.cleanTree();
+            }
+        }, memoryCheckInterval);
     }
     attachNodeCallback(nodeCallback) {
         this.nodeCallbacks.push(nodeCallback);
@@ -45,12 +51,23 @@ export default class Nodes {
         }
         return id;
     }
-    // cleanTree() {
-    //   if (this.nodes.length > 10000) {
-    //     this.nodes = this.nodes.filter((n) => n !== undefined && document.contains(n))
-    //   }
-    //   return;
-    // }
+    cleanTree() {
+        // sadly we keep empty items in array here resulting in some memory still being used
+        // but its still better than keeping dead nodes or undef elements
+        // plus we keep our index positions for new/alive nodes
+        // performance test: 3ms for 30k nodes with 17k dead ones
+        for (let i = 0; i < this.nodes.length; i++) {
+            const node = this.nodes[i];
+            if (node === undefined) {
+                delete this.nodes[i];
+                continue;
+            }
+            if (!document.contains(node)) {
+                this.unregisterNode(node);
+                delete this.nodes[i];
+            }
+        }
+    }
     callNodeCallbacks(node, isStart) {
         this.nodeCallbacks.forEach((cb) => cb(node, isStart));
     }
@@ -69,5 +86,9 @@ export default class Nodes {
             this.unregisterNode(node);
         }
         this.nodes.length = 0;
+        if (this.gc) {
+            clearInterval(this.gc);
+            this.gc = undefined;
+        }
     }
 }

package/lib/index.js

@@ -123,7 +123,7 @@ export default class API {
             // no-cors issue only with text/plain or not-set Content-Type
             // req.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
             req.send(JSON.stringify({
-                trackerVersion: '3.5.16-beta.1',
+                trackerVersion: '3.5.16-beta.2',
                 projectKey: options.projectKey,
                 doNotTrack,
                 // TODO: add precise reason (an exact API missing)

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openreplay/tracker",
   "description": "The OpenReplay tracker main package",
-  "version": "3.5.16-beta.1",
+  "version": "3.5.16-beta.2",
   "keywords": [
     "logging",
     "replay"