@aurelia/platform-browser - npm Package Compare versions

Comparing version 2.0.1-dev.202405110109 to 2.0.1-dev.202405230048

CHANGELOG.md

@@ -6,2 +6,9 @@ # Change Log
 
+<a name="2.0.0-beta.18"></a>
+# 2.0.0-beta.18 (2024-05-23)
+
+### Refactorings:
+
+* **dom-queue:** merge dom read and write queues (#1970) ([3a63cde](https://github.com/aurelia/aurelia/commit/3a63cde))
+
 <a name="2.0.0-beta.17"></a>
@@ -8,0 +15,0 @@ # 2.0.0-beta.17 (2024-05-11)

dist/types/index.d.ts

 import { Platform, TaskQueue } from '@aurelia/platform';
 export declare class BrowserPlatform<TGlobal extends typeof globalThis = typeof globalThis> extends Platform<TGlobal> {
+    static getOrCreate<TGlobal extends typeof globalThis = typeof globalThis>(g: TGlobal, overrides?: Partial<Exclude<BrowserPlatform, 'globalThis'>>): BrowserPlatform<TGlobal>;
+    static set(g: typeof globalThis, platform: BrowserPlatform): void;
     readonly Node: TGlobal['Node'];
@@ -20,14 +22,13 @@ readonly Element: TGlobal['Element'];
     readonly setTimeout: TGlobal['window']['setTimeout'];
-    readonly domWriteQueue: TaskQueue;
-    readonly domReadQueue: TaskQueue;
+    readonly domQueue: TaskQueue;
+    /**
+     * @deprecated Use `platform.domQueue` instead.
+     */
+    get domWriteQueue(): TaskQueue;
+    /**
+     * @deprecated Use `platform.domQueue` instead.
+     */
+    get domReadQueue(): TaskQueue;
     constructor(g: TGlobal, overrides?: Partial<Exclude<BrowserPlatform, 'globalThis'>>);
-    static getOrCreate<TGlobal extends typeof globalThis = typeof globalThis>(g: TGlobal, overrides?: Partial<Exclude<BrowserPlatform, 'globalThis'>>): BrowserPlatform<TGlobal>;
-    static set(g: typeof globalThis, platform: BrowserPlatform): void;
-    protected requestDomRead(): void;
-    protected cancelDomRead(): void;
-    protected flushDomRead(): void;
-    protected requestDomWrite(): void;
-    protected cancelDomWrite(): void;
-    protected flushDomWrite(): void;
 }
 //# sourceMappingURL=index.d.ts.map

package.json

 {
   "name": "@aurelia/platform-browser",
-  "version": "2.0.1-dev.202405110109",
+  "version": "2.0.1-dev.202405230048",
   "main": "dist/cjs/index.cjs",
@@ -56,3 +56,3 @@ "module": "dist/esm/index.mjs",
   "dependencies": {
-    "@aurelia/platform": "2.0.1-dev.202405110109"
+    "@aurelia/platform": "2.0.1-dev.202405230048"
   },
@@ -59,0 +59,0 @@ "devDependencies": {

src/index.ts

 import { Platform, TaskQueue } from '@aurelia/platform';
 
-const lookup = new Map<object, BrowserPlatform>();
+export class BrowserPlatform<TGlobal extends typeof globalThis = typeof globalThis> extends Platform<TGlobal> {
+  /** @internal */
+  private static readonly _lookup = new WeakMap<typeof globalThis, BrowserPlatform>();
 
-export class BrowserPlatform<TGlobal extends typeof globalThis = typeof globalThis> extends Platform<TGlobal> {
+  public static getOrCreate<TGlobal extends typeof globalThis = typeof globalThis>(
+    g: TGlobal,
+    overrides: Partial<Exclude<BrowserPlatform, 'globalThis'>> = {},
+  ): BrowserPlatform<TGlobal> {
+    let platform = BrowserPlatform._lookup.get(g);
+    if (platform === void 0) {
+      BrowserPlatform._lookup.set(g, platform = new BrowserPlatform(g, overrides));
+    }
+    return platform as BrowserPlatform<TGlobal>;
+  }
+
+  public static set(g: typeof globalThis, platform: BrowserPlatform): void {
+    BrowserPlatform._lookup.set(g, platform);
+  }
+
   public readonly Node!: TGlobal['Node'];
@@ -29,10 +45,34 @@ public readonly Element!: TGlobal['Element'];
   public readonly setTimeout!: TGlobal['window']['setTimeout'];
-  public readonly domWriteQueue: TaskQueue;
-  public readonly domReadQueue: TaskQueue;
+  public readonly domQueue: TaskQueue;
 
+  /**
+   * @deprecated Use `platform.domQueue` instead.
+   */
+  public get domWriteQueue() {
+    if (__DEV__) {
+      this.console.log('[DEV:aurelia] platform.domQueue is deprecated, please use platform.domQueue instead.');
+    }
+    return this.domQueue;
+  }
+
+  /**
+   * @deprecated Use `platform.domQueue` instead.
+   */
+  public get domReadQueue() {
+    if (__DEV__) {
+      this.console.log('[DEV:aurelia] platform.domReadQueue has been removed, please use platform.domQueue instead.');
+    }
+    return this.domQueue;
+  }
+
   public constructor(g: TGlobal, overrides: Partial<Exclude<BrowserPlatform, 'globalThis'>> = {}) {
     super(g, overrides);
 
+    const notImplemented = (name: string) => () => {
+      // TODO: link to docs describing how to fix this issue
+      throw new Error(`The PLATFORM did not receive a valid reference to the global function '${name}'.`);
+    };
+
     ('Node Element HTMLElement CustomEvent CSSStyleSheet ShadowRoot MutationObserver '
-    + 'window document customElements')
+      + 'window document customElements')
       .split(' ')
@@ -47,90 +87,33 @@ // eslint-disable-next-line
 
-    this.flushDomRead = this.flushDomRead.bind(this);
-    this.flushDomWrite = this.flushDomWrite.bind(this);
-    this.domReadQueue = new TaskQueue(this, this.requestDomRead.bind(this), this.cancelDomRead.bind(this));
-    this.domWriteQueue = new TaskQueue(this, this.requestDomWrite.bind(this), this.cancelDomWrite.bind(this));
-  }
+    this.domQueue = (() => {
+      let domRequested: boolean = false;
+      let domHandle: number = -1;
 
-  public static getOrCreate<TGlobal extends typeof globalThis = typeof globalThis>(
-    g: TGlobal,
-    overrides: Partial<Exclude<BrowserPlatform, 'globalThis'>> = {},
-  ): BrowserPlatform<TGlobal> {
-    let platform = lookup.get(g);
-    if (platform === void 0) {
-      lookup.set(g, platform = new BrowserPlatform(g, overrides));
-    }
-    return platform as BrowserPlatform<TGlobal>;
-  }
+      const requestDomFlush = (): void => {
+        domRequested = true;
+        if (domHandle === -1) {
+          domHandle = this.requestAnimationFrame(flushDomQueue);
+        }
+      };
 
-  public static set(g: typeof globalThis, platform: BrowserPlatform): void {
-    lookup.set(g, platform);
-  }
+      const cancelDomFlush = (): void => {
+        domRequested = false;
+        if (domHandle > -1) {
+          this.cancelAnimationFrame(domHandle);
+          domHandle = -1;
+        }
+      };
 
-  /** @internal */ private _domReadRequested: boolean = false;
-  /** @internal */ private _domReadHandle: number = -1;
-  protected requestDomRead(): void {
-    this._domReadRequested = true;
-    // Yes, this is intentional: the timing of the read can only be "found" by doing a write first.
-    // The flushDomWrite queues the read.
-    // If/when requestPostAnimationFrame is implemented in browsers, we can use that instead.
-    if (this._domWriteHandle === -1) {
-      this._domWriteHandle = this.requestAnimationFrame(this.flushDomWrite);
-    }
-  }
-  protected cancelDomRead(): void {
-    this._domReadRequested = false;
-    if (this._domReadHandle > -1) {
-      this.clearTimeout(this._domReadHandle);
-      this._domReadHandle = -1;
-    }
-    if (this._domWriteRequested === false && this._domWriteHandle > -1) {
-      this.cancelAnimationFrame(this._domWriteHandle);
-      this._domWriteHandle = -1;
-    }
-  }
-  protected flushDomRead(): void {
-    this._domReadHandle = -1;
-    if (this._domReadRequested === true) {
-      this._domReadRequested = false;
-      this.domReadQueue.flush();
-    }
-  }
+      const flushDomQueue = (): void => {
+        domHandle = -1;
+        if (domRequested === true) {
+          domRequested = false;
+          domQueue.flush();
+        }
+      };
 
-  /** @internal */ private _domWriteRequested: boolean = false;
-  /** @internal */ private _domWriteHandle: number = -1;
-  protected requestDomWrite(): void {
-    this._domWriteRequested = true;
-    if (this._domWriteHandle === -1) {
-      this._domWriteHandle = this.requestAnimationFrame(this.flushDomWrite);
-    }
+      const domQueue = new TaskQueue(this, requestDomFlush, cancelDomFlush);
+      return domQueue;
+    })();
   }
-  protected cancelDomWrite(): void {
-    this._domWriteRequested = false;
-    if (
-      this._domWriteHandle > -1 &&
-      // if dom read is requested and there is no readHandle yet, we need the rAF to proceed regardless.
-      // The domWriteRequested=false will prevent the read flush from happening.
-      (this._domReadRequested === false || this._domReadHandle > -1)
-    ) {
-      this.cancelAnimationFrame(this._domWriteHandle);
-      this._domWriteHandle = -1;
-    }
-  }
-  protected flushDomWrite(): void {
-    this._domWriteHandle = -1;
-    if (this._domWriteRequested === true) {
-      this._domWriteRequested = false;
-      this.domWriteQueue.flush();
-    }
-    if (this._domReadRequested === true && this._domReadHandle === -1) {
-      this._domReadHandle = this.setTimeout(this.flushDomRead, 0);
-    }
-  }
 }
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const notImplemented = (name: string): (...args: any[]) => any => {
-  return () => {
-    throw new Error(`The PLATFORM did not receive a valid reference to the global function '${name}'.`); // TODO: link to docs describing how to fix this issue
-  };
-};

No alert changes

Worsened metrics

Total package byte prevSize

45299

decreased by-19.59%

Lines of code

529

decreased by-21.28%

Dependency changes

• + Added@aurelia/platform@2.0.1-dev.202405230048(transitive)

• - Removed@aurelia/platform@2.0.1-dev.202405110109(transitive)

• Updated@aurelia/platform@2.0.1-dev.202405230048