@github/hydro-analytics-client 2.3.3 → 2.4.0

package/dist/analytics-client.d.ts

@@ -3,14 +3,28 @@ export interface AnalyticsClientOptions {
     collectorUrl: string;
     clientId?: string;
     baseContext?: Context;
+    maxBatchSize?: number;
+    idleTimeout?: number;
 }
 export declare class AnalyticsClient {
     readonly options: AnalyticsClientOptions;
+    private eventBatch;
+    private idleCallbackId;
+    private fallbackTimerId;
     constructor(options: AnalyticsClientOptions);
     get collectorUrl(): string;
     get clientId(): string;
+    private get maxBatchSize();
+    private get idleTimeout();
     private createEvent;
     sendPageView(context?: Context): void;
     sendEvent(type: string, context: Context): void;
+    sendBatchedEvent(type: string, context: Context): void;
+    flushBatch(): void;
+    destroy(): void;
+    private scheduleFlush;
+    private cancelScheduledFlush;
+    private onVisibilityChange;
+    private boundFlush;
     private send;
 }

package/dist/analytics-client.js

@@ -4,6 +4,21 @@ import { getOrCreateClientId } from './client-id.js';
 export class AnalyticsClient {
     constructor(options) {
         this.options = options;
+        this.eventBatch = [];
+        this.idleCallbackId = null;
+        this.fallbackTimerId = null;
+        this.onVisibilityChange = () => {
+            if (document.visibilityState === 'hidden') {
+                this.flushBatch();
+            }
+        };
+        this.boundFlush = () => this.flushBatch();
+        if (typeof document !== 'undefined') {
+            document.addEventListener('visibilitychange', this.onVisibilityChange);
+        }
+        if (typeof window !== 'undefined') {
+            window.addEventListener('pagehide', this.boundFlush);
+        }
     }
     get collectorUrl() {
         return this.options.collectorUrl;
@@ -14,6 +29,12 @@ export class AnalyticsClient {
         }
         return getOrCreateClientId();
     }
+    get maxBatchSize() {
+        return this.options.maxBatchSize ?? 10;
+    }
+    get idleTimeout() {
+        return this.options.idleTimeout ?? 1000;
+    }
     createEvent(context) {
         return {
             page: location.href,
@@ -36,6 +57,60 @@ export class AnalyticsClient {
         };
         this.send({ events: [event] });
     }
+    sendBatchedEvent(type, context) {
+        const event = {
+            ...this.createEvent(context),
+            type
+        };
+        this.eventBatch.push(event);
+        if (this.eventBatch.length >= this.maxBatchSize) {
+            this.flushBatch();
+        }
+        else {
+            this.scheduleFlush();
+        }
+    }
+    flushBatch() {
+        if (this.eventBatch.length === 0)
+            return;
+        this.cancelScheduledFlush();
+        const events = this.eventBatch;
+        this.eventBatch = [];
+        this.send({ events });
+    }
+    destroy() {
+        this.flushBatch();
+        if (typeof document !== 'undefined') {
+            document.removeEventListener('visibilitychange', this.onVisibilityChange);
+        }
+        if (typeof window !== 'undefined') {
+            window.removeEventListener('pagehide', this.boundFlush);
+        }
+    }
+    scheduleFlush() {
+        if (this.idleCallbackId !== null || this.fallbackTimerId !== null)
+            return;
+        if (typeof requestIdleCallback === 'function') {
+            this.idleCallbackId = requestIdleCallback(this.boundFlush, {
+                timeout: this.idleTimeout
+            });
+        }
+        else {
+            this.fallbackTimerId = setTimeout(this.boundFlush, this.idleTimeout);
+        }
+    }
+    cancelScheduledFlush() {
+        if (this.idleCallbackId !== null) {
+            if (typeof cancelIdleCallback === 'function') {
+                cancelIdleCallback(this.idleCallbackId);
+            }
+            this.idleCallbackId = null;
+        }
+        if (this.fallbackTimerId !== null) {
+            clearTimeout(this.fallbackTimerId);
+            this.fallbackTimerId = null;
+        }
+    }
     send({ page_views, events }) {
         const payload = {
             client_id: this.clientId,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@github/hydro-analytics-client",
-  "version": "2.3.3",
+  "version": "2.4.0",
   "description": "Client SDK for Hydro Analytics",
   "main": "./dist/index.js",
   "module": "dist/index.js",