@meursyphus/flitter 2.0.3 → 2.1.0

package/index.cjs

@@ -13831,23 +13831,95 @@ var Scheduler = class {
 };
 var Scheduler_default = Scheduler;
 
+// src/framework/Vsync.ts
+var Vsync = class _Vsync {
+  constructor() {
+    __publicField(this, "callbacks");
+    __publicField(this, "frameRequested");
+    __publicField(this, "rafId");
+    /**
+     * Handles the animation frame by executing all queued callbacks.
+     */
+    __publicField(this, "handleFrame", (time) => {
+      this.frameRequested = false;
+      this.rafId = null;
+      const callbacksToRun = [...this.callbacks];
+      this.callbacks = [];
+      for (const callback of callbacksToRun) {
+        callback(time);
+      }
+      if (this.callbacks.length > 0 && !this.frameRequested) {
+        this.frameRequested = true;
+        this.rafId = requestAnimationFrame(this.handleFrame);
+      }
+    });
+    this.callbacks = [];
+    this.frameRequested = false;
+    this.rafId = null;
+  }
+  static getInstance() {
+    if (typeof window === "undefined") {
+      throw new Error("Vsync requires window object");
+    }
+    if (!window.__flitter_vsync__) {
+      window.__flitter_vsync__ = new _Vsync();
+    }
+    return window.__flitter_vsync__;
+  }
+  /**
+   * Schedules a callback to be executed in the next animation frame.
+   * If there's already a frame requested, the callback will be queued
+   * to run with other callbacks in that frame.
+   */
+  requestCallback(callback) {
+    this.callbacks.push(callback);
+    if (!this.frameRequested) {
+      this.frameRequested = true;
+      this.rafId = requestAnimationFrame(this.handleFrame);
+    }
+  }
+  /**
+   * Removes a previously scheduled callback.
+   */
+  cancelCallback(callback) {
+    const index = this.callbacks.indexOf(callback);
+    if (index !== -1) {
+      this.callbacks.splice(index, 1);
+    }
+    if (this.callbacks.length === 0 && this.rafId !== null) {
+      cancelAnimationFrame(this.rafId);
+      this.frameRequested = false;
+      this.rafId = null;
+    }
+  }
+};
+
 // src/framework/RenderFrameDispatcher.ts
+var _vsync;
 var RenderFrameDispatcher = class {
   constructor({ onFrame } = {}) {
     __publicField(this, "onFrame");
+    __privateAdd(this, _vsync, null);
     this.onFrame = onFrame;
   }
+  get vsync() {
+    if (!__privateGet(this, _vsync)) {
+      __privateSet(this, _vsync, Vsync.getInstance());
+    }
+    return __privateGet(this, _vsync);
+  }
   setOnFrame(callback) {
     this.onFrame = () => callback();
   }
   dispatch() {
     if (typeof window === "undefined") return;
-    window.requestAnimationFrame(() => {
+    this.vsync.requestCallback(() => {
       var _a;
       (_a = this.onFrame) == null ? void 0 : _a.call(this);
     });
   }
 };
+_vsync = new WeakMap();
 var RenderFrameDispatcher_default = RenderFrameDispatcher;
 
 // src/framework/Globalkey.ts

package/index.d.cts

@@ -3595,8 +3595,36 @@ declare class CanvasPainter extends Painter$1 {
     skippedPaintingOnLayer(): void;
 }
 
+/**
+ * Vsync manages requestAnimationFrame calls by queuing callbacks and executing them
+ * in a single animation frame to optimize performance.
+ */
+declare class Vsync {
+    private callbacks;
+    private frameRequested;
+    private rafId;
+    private constructor();
+    static getInstance(): Vsync;
+    /**
+     * Schedules a callback to be executed in the next animation frame.
+     * If there's already a frame requested, the callback will be queued
+     * to run with other callbacks in that frame.
+     */
+    requestCallback(callback: (time: number) => void): void;
+    /**
+     * Removes a previously scheduled callback.
+     */
+    cancelCallback(callback: (time: number) => void): void;
+    /**
+     * Handles the animation frame by executing all queued callbacks.
+     */
+    private handleFrame;
+}
+
 declare class RenderFrameDispatcher {
+    #private;
     private onFrame?;
+    get vsync(): Vsync;
     constructor({ onFrame }?: {
         onFrame?: () => void;
     });

package/index.d.ts

@@ -3595,8 +3595,36 @@ declare class CanvasPainter extends Painter$1 {
     skippedPaintingOnLayer(): void;
 }
 
+/**
+ * Vsync manages requestAnimationFrame calls by queuing callbacks and executing them
+ * in a single animation frame to optimize performance.
+ */
+declare class Vsync {
+    private callbacks;
+    private frameRequested;
+    private rafId;
+    private constructor();
+    static getInstance(): Vsync;
+    /**
+     * Schedules a callback to be executed in the next animation frame.
+     * If there's already a frame requested, the callback will be queued
+     * to run with other callbacks in that frame.
+     */
+    requestCallback(callback: (time: number) => void): void;
+    /**
+     * Removes a previously scheduled callback.
+     */
+    cancelCallback(callback: (time: number) => void): void;
+    /**
+     * Handles the animation frame by executing all queued callbacks.
+     */
+    private handleFrame;
+}
+
 declare class RenderFrameDispatcher {
+    #private;
     private onFrame?;
+    get vsync(): Vsync;
     constructor({ onFrame }?: {
         onFrame?: () => void;
     });

package/index.global.js

@@ -14157,23 +14157,95 @@
   };
   var Scheduler_default = Scheduler;
 
+  // src/framework/Vsync.ts
+  var Vsync = class _Vsync {
+    constructor() {
+      __publicField(this, "callbacks");
+      __publicField(this, "frameRequested");
+      __publicField(this, "rafId");
+      /**
+       * Handles the animation frame by executing all queued callbacks.
+       */
+      __publicField(this, "handleFrame", (time) => {
+        this.frameRequested = false;
+        this.rafId = null;
+        const callbacksToRun = [...this.callbacks];
+        this.callbacks = [];
+        for (const callback of callbacksToRun) {
+          callback(time);
+        }
+        if (this.callbacks.length > 0 && !this.frameRequested) {
+          this.frameRequested = true;
+          this.rafId = requestAnimationFrame(this.handleFrame);
+        }
+      });
+      this.callbacks = [];
+      this.frameRequested = false;
+      this.rafId = null;
+    }
+    static getInstance() {
+      if (typeof window === "undefined") {
+        throw new Error("Vsync requires window object");
+      }
+      if (!window.__flitter_vsync__) {
+        window.__flitter_vsync__ = new _Vsync();
+      }
+      return window.__flitter_vsync__;
+    }
+    /**
+     * Schedules a callback to be executed in the next animation frame.
+     * If there's already a frame requested, the callback will be queued
+     * to run with other callbacks in that frame.
+     */
+    requestCallback(callback) {
+      this.callbacks.push(callback);
+      if (!this.frameRequested) {
+        this.frameRequested = true;
+        this.rafId = requestAnimationFrame(this.handleFrame);
+      }
+    }
+    /**
+     * Removes a previously scheduled callback.
+     */
+    cancelCallback(callback) {
+      const index = this.callbacks.indexOf(callback);
+      if (index !== -1) {
+        this.callbacks.splice(index, 1);
+      }
+      if (this.callbacks.length === 0 && this.rafId !== null) {
+        cancelAnimationFrame(this.rafId);
+        this.frameRequested = false;
+        this.rafId = null;
+      }
+    }
+  };
+
   // src/framework/RenderFrameDispatcher.ts
+  var _vsync;
   var RenderFrameDispatcher = class {
     constructor({ onFrame } = {}) {
       __publicField(this, "onFrame");
+      __privateAdd(this, _vsync, null);
       this.onFrame = onFrame;
     }
+    get vsync() {
+      if (!__privateGet(this, _vsync)) {
+        __privateSet(this, _vsync, Vsync.getInstance());
+      }
+      return __privateGet(this, _vsync);
+    }
     setOnFrame(callback) {
       this.onFrame = () => callback();
     }
     dispatch() {
       if (typeof window === "undefined") return;
-      window.requestAnimationFrame(() => {
+      this.vsync.requestCallback(() => {
         var _a;
         (_a = this.onFrame) == null ? void 0 : _a.call(this);
       });
     }
   };
+  _vsync = new WeakMap();
   var RenderFrameDispatcher_default = RenderFrameDispatcher;
 
   // src/framework/Globalkey.ts

package/index.js

@@ -13831,23 +13831,95 @@ var Scheduler = class {
 };
 var Scheduler_default = Scheduler;
 
+// src/framework/Vsync.ts
+var Vsync = class _Vsync {
+  constructor() {
+    __publicField(this, "callbacks");
+    __publicField(this, "frameRequested");
+    __publicField(this, "rafId");
+    /**
+     * Handles the animation frame by executing all queued callbacks.
+     */
+    __publicField(this, "handleFrame", (time) => {
+      this.frameRequested = false;
+      this.rafId = null;
+      const callbacksToRun = [...this.callbacks];
+      this.callbacks = [];
+      for (const callback of callbacksToRun) {
+        callback(time);
+      }
+      if (this.callbacks.length > 0 && !this.frameRequested) {
+        this.frameRequested = true;
+        this.rafId = requestAnimationFrame(this.handleFrame);
+      }
+    });
+    this.callbacks = [];
+    this.frameRequested = false;
+    this.rafId = null;
+  }
+  static getInstance() {
+    if (typeof window === "undefined") {
+      throw new Error("Vsync requires window object");
+    }
+    if (!window.__flitter_vsync__) {
+      window.__flitter_vsync__ = new _Vsync();
+    }
+    return window.__flitter_vsync__;
+  }
+  /**
+   * Schedules a callback to be executed in the next animation frame.
+   * If there's already a frame requested, the callback will be queued
+   * to run with other callbacks in that frame.
+   */
+  requestCallback(callback) {
+    this.callbacks.push(callback);
+    if (!this.frameRequested) {
+      this.frameRequested = true;
+      this.rafId = requestAnimationFrame(this.handleFrame);
+    }
+  }
+  /**
+   * Removes a previously scheduled callback.
+   */
+  cancelCallback(callback) {
+    const index = this.callbacks.indexOf(callback);
+    if (index !== -1) {
+      this.callbacks.splice(index, 1);
+    }
+    if (this.callbacks.length === 0 && this.rafId !== null) {
+      cancelAnimationFrame(this.rafId);
+      this.frameRequested = false;
+      this.rafId = null;
+    }
+  }
+};
+
 // src/framework/RenderFrameDispatcher.ts
+var _vsync;
 var RenderFrameDispatcher = class {
   constructor({ onFrame } = {}) {
     __publicField(this, "onFrame");
+    __privateAdd(this, _vsync, null);
     this.onFrame = onFrame;
   }
+  get vsync() {
+    if (!__privateGet(this, _vsync)) {
+      __privateSet(this, _vsync, Vsync.getInstance());
+    }
+    return __privateGet(this, _vsync);
+  }
   setOnFrame(callback) {
     this.onFrame = () => callback();
   }
   dispatch() {
     if (typeof window === "undefined") return;
-    window.requestAnimationFrame(() => {
+    this.vsync.requestCallback(() => {
       var _a;
       (_a = this.onFrame) == null ? void 0 : _a.call(this);
     });
   }
 };
+_vsync = new WeakMap();
 var RenderFrameDispatcher_default = RenderFrameDispatcher;
 
 // src/framework/Globalkey.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meursyphus/flitter",
-  "version": "2.0.3",
+  "version": "2.1.0",
   "description": "Flitter: A high-performance JavaScript rendering engine and framework inspired by Flutter. Features declarative programming, SVG and Canvas support, and optimized for complex data visualizations, interactive charts, and graphic editors in web applications.",
   "keywords": [
     "rendering-engine",
@@ -51,14 +51,14 @@
     "url": "https://github.com/meursyphus/flitter/issues"
   },
   "main": "./index.cjs",
+  "module": "./index.js",
+  "types": "./index.d.ts",
   "type": "module",
   "publishConfig": {
     "access": "public"
   },
-  "module": "./index.js",
   "exports": {
     "import": "./index.js",
     "default": "./index.js"
-  },
-  "types": "./index.d.ts"
+  }
 }