@solidtv/renderer 1.1.0 → 1.1.2

package/src/core/CoreNode.ts

@@ -811,6 +811,28 @@ export class CoreNode extends EventEmitter {
   public isRenderable = false;
   public renderState: CoreNodeRenderState = CoreNodeRenderState.Init;
   public isSimple = true;
+  /**
+   * `true` when `localTransform` is in identity-shape (ta=1, tb=0, tc=0, td=1)
+   * — i.e. a pure translation. Lets the simple-path `updateLocalTransform`
+   * skip redundant ta/tb/tc/td writes between frames. Defaults to `true`
+   * because the matrix is eagerly allocated as an identity in the constructor.
+   */
+  public _localIsTranslate = true;
+  /**
+   * Cached result of the texture `contain` resizeMode check used by
+   * `updateLocalTransform` and `updateIsSimple`. Updated whenever the
+   * texture or textureOptions change (via `updateIsSimple`), so the hot
+   * paths can avoid the optional-chain + string compare on every frame.
+   */
+  public _hasContainResize = false;
+  /**
+   * `true` when `globalTransform` is in identity-shape (ta=1, tb=0, tc=0, td=1).
+   * Propagates from parent: a node's global is translate-only iff the parent's
+   * global is translate-only AND the node itself is `isSimple`. Default `true`
+   * because freshly-constructed nodes have no transform applied yet, and the
+   * Stage root is configured with an identity-shape global.
+   */
+  public _globalIsTranslate = true;
 
   public worldAlpha = 1;
   public premultipliedColorTl = 0;
@@ -835,6 +857,13 @@ export class CoreNode extends EventEmitter {
   constructor(readonly stage: Stage, props: CoreNodeProps) {
     super();
 
+    // Eagerly allocate the local/global transform matrices as identity.
+    // This keeps the field's hidden class monomorphic (Matrix3d, not
+    // Matrix3d|undefined) from construction onward and lets the simple
+    // / translate-only fast paths take effect on the very first update.
+    this.localTransform = Matrix3d.identity();
+    this.globalTransform = Matrix3d.identity();
+
     //inital update type
     let initialUpdateType =
       UpdateType.Local | UpdateType.RenderBounds | UpdateType.RenderState;
@@ -1089,7 +1118,18 @@ export class CoreNode extends EventEmitter {
     const { x, y } = p;
 
     if (this.isSimple) {
+      // Fast path: when localTransform is already in identity-shape
+      // (ta=1, tb=0, tc=0, td=1), only tx/ty change between frames, so we
+      // skip the 4 redundant field writes Matrix3d.translate would do.
+      // _localIsTranslate becomes stale when a node was non-simple (had
+      // rotation/scale/mount) on a previous frame — in that case do a
+      // full reset to identity-translate.
+      if (this._localIsTranslate === true) {
+        this.localTransform!.setTranslate(x, y);
+        return;
+      }
       this.localTransform = Matrix3d.translate(x, y, this.localTransform);
+      this._localIsTranslate = true;
       return;
     }
 
@@ -1097,10 +1137,15 @@ export class CoreNode extends EventEmitter {
     const mountTranslateX = p.mountX * w;
     const mountTranslateY = p.mountY * h;
 
-    if (p.rotation !== 0 || p.scaleX !== 1 || p.scaleY !== 1) {
-      const scaleRotate = Matrix3d.rotate(p.rotation, Matrix3d.temp).scale(
-        p.scaleX,
-        p.scaleY,
+    const rotation = p.rotation;
+    const scaleX = p.scaleX;
+    const scaleY = p.scaleY;
+
+    if (rotation !== 0) {
+      // Full rotation (+ optional scale + pivot)
+      const scaleRotate = Matrix3d.rotate(rotation, Matrix3d.temp).scale(
+        scaleX,
+        scaleY,
       );
       const pivotTranslateX = p.pivotX * w;
       const pivotTranslateY = p.pivotY * h;
@@ -1112,7 +1157,21 @@ export class CoreNode extends EventEmitter {
       )
         .multiply(scaleRotate)
         .translate(-pivotTranslateX, -pivotTranslateY);
+    } else if (scaleX !== 1 || scaleY !== 1) {
+      // Scale (+ optional pivot) without rotation — skip the rotate matrix
+      // and the 8-mul multiply; `.scale()` is a 4-mul in-place op.
+      const pivotTranslateX = p.pivotX * w;
+      const pivotTranslateY = p.pivotY * h;
+
+      this.localTransform = Matrix3d.translate(
+        x - mountTranslateX + pivotTranslateX,
+        y - mountTranslateY + pivotTranslateY,
+        this.localTransform,
+      )
+        .scale(scaleX, scaleY)
+        .translate(-pivotTranslateX, -pivotTranslateY);
     } else {
+      // Mount (or texture-contain) only — pure translation.
       this.localTransform = Matrix3d.translate(
         x - mountTranslateX,
         y - mountTranslateY,
@@ -1120,12 +1179,13 @@ export class CoreNode extends EventEmitter {
       );
     }
 
-    // Handle 'contain' resize mode
+    // Handle 'contain' resize mode (cached check; dimensions still need
+    // a runtime null-check because they're populated asynchronously).
     const texture = p.texture;
     if (
-      texture &&
-      texture.dimensions &&
-      p.textureOptions.resizeMode?.type === 'contain'
+      this._hasContainResize === true &&
+      texture !== null &&
+      texture.dimensions !== null
     ) {
       let resizeModeScaleX = 1;
       let resizeModeScaleY = 1;
@@ -1157,17 +1217,23 @@ export class CoreNode extends EventEmitter {
         .translate(extraX, extraY)
         .scale(resizeModeScaleX, resizeModeScaleY);
     }
+
+    this._localIsTranslate = false;
   }
 
   updateIsSimple() {
     const p = this.props;
+    // Cache the texture-contain check so updateLocalTransform doesn't have to
+    // run the optional-chain + string compare on every Local update.
+    this._hasContainResize =
+      p.texture !== null && p.textureOptions?.resizeMode?.type === 'contain';
     this.isSimple =
       p.rotation === 0 &&
       p.scaleX === 1 &&
       p.scaleY === 1 &&
       p.mountX === 0 &&
       p.mountY === 0 &&
-      !(p.texture && p.textureOptions.resizeMode?.type === 'contain');
+      this._hasContainResize === false;
   }
 
   /**
@@ -1209,6 +1275,10 @@ export class CoreNode extends EventEmitter {
     }
 
     if (updateType & UpdateType.Global) {
+      const lt = this.localTransform!;
+      const gt = this.globalTransform!;
+      let fastPathApplied = false;
+
       if (
         USE_RTT &&
         this.parentHasRenderTexture === true &&
@@ -1216,7 +1286,7 @@ export class CoreNode extends EventEmitter {
       ) {
         // we are at the start of the RTT chain, so we need to reset the globalTransform
         // for correct RTT rendering
-        this.globalTransform = Matrix3d.identity(this.globalTransform);
+        Matrix3d.identity(gt);
 
         // Maintain a full scene global transform for bounds detection
         const parentTransform =
@@ -1225,7 +1295,10 @@ export class CoreNode extends EventEmitter {
         this.sceneGlobalTransform = Matrix3d.copy(
           parentTransform,
           this.sceneGlobalTransform,
-        ).translateOrMultiply(this.localTransform!);
+        ).translateOrMultiply(lt);
+
+        // identity * local => translate-only iff this node is simple
+        this._globalIsTranslate = this.isSimple;
       } else if (
         USE_RTT &&
         this.parentHasRenderTexture === true &&
@@ -1234,32 +1307,48 @@ export class CoreNode extends EventEmitter {
         // we're part of an RTT chain but our parent is not the main RTT node
         // so we need to propogate the sceneGlobalTransform of the parent
         // to maintain a full scene global transform for bounds detection
-        const parentSceneTransform =
-          parent.sceneGlobalTransform || this.localTransform!;
+        const parentSceneTransform = parent.sceneGlobalTransform || lt;
 
         this.sceneGlobalTransform = Matrix3d.copy(
           parentSceneTransform,
           this.sceneGlobalTransform,
-        ).translateOrMultiply(this.localTransform!);
+        ).translateOrMultiply(lt);
 
-        this.globalTransform = Matrix3d.copy(
-          parent.globalTransform || this.localTransform!,
-          this.globalTransform,
-        );
+        Matrix3d.copy(parent.globalTransform!, gt);
+
+        // Conservative: RTT chains rarely hit the translate fast path
+        this._globalIsTranslate = false;
       } else {
-        this.globalTransform = Matrix3d.copy(
-          parent.globalTransform || this.localTransform!,
-          this.globalTransform,
-        );
+        // Common non-RTT path
+        const parentGT = parent.globalTransform!;
+        if (this.isSimple === true && parent._globalIsTranslate === true) {
+          // Translate-only fast path: parent global and local are both pure
+          // translations, so the resulting global is also a pure translation
+          // and collapses to 2 adds on tx/ty.
+          if (this._globalIsTranslate === false) {
+            // Transitioning back into translate-only — reset ta/tb/tc/td
+            // that may have been left non-identity by a prior frame.
+            gt.ta = 1;
+            gt.tb = 0;
+            gt.tc = 0;
+            gt.td = 1;
+          }
+          gt.setTranslate(parentGT.tx + lt.tx, parentGT.ty + lt.ty);
+          this._globalIsTranslate = true;
+          fastPathApplied = true;
+        } else {
+          Matrix3d.copy(parentGT, gt);
+          this._globalIsTranslate =
+            this.isSimple === true && parent._globalIsTranslate === true;
+        }
       }
 
-      if (this.isSimple) {
-        this.globalTransform.translate(
-          this.localTransform!.tx,
-          this.localTransform!.ty,
-        );
-      } else {
-        this.globalTransform.translateOrMultiply(this.localTransform!);
+      if (fastPathApplied === false) {
+        if (this.isSimple) {
+          gt.translate(lt.tx, lt.ty);
+        } else {
+          gt.translateOrMultiply(lt);
+        }
       }
       this.calculateRenderCoords();
       this.updateBoundingRect();
@@ -1380,18 +1469,30 @@ export class CoreNode extends EventEmitter {
         childClippingRect = NO_CLIPPING_RECT;
       }
 
-      for (let i = 0, length = this.children.length; i < length; i++) {
-        const child = this.children[i] as CoreNode;
-
-        if (childUpdateType !== 0) {
+      const children = this.children;
+      const length = children.length;
+      if (childUpdateType !== 0) {
+        // Specialized loop: OR-in the inherited update bits for every child,
+        // then update if non-zero. Avoids the per-iter `childUpdateType !== 0`
+        // compare.
+        for (let i = 0; i < length; i++) {
+          const child = children[i] as CoreNode;
           child.updateType |= childUpdateType;
+          if (child.updateType === 0) {
+            continue;
+          }
+          child.update(delta, childClippingRect);
         }
-
-        if (child.updateType === 0) {
-          continue;
+      } else {
+        // Specialized loop: nothing to inherit, so only walk children that
+        // already have pending work of their own.
+        for (let i = 0; i < length; i++) {
+          const child = children[i] as CoreNode;
+          if (child.updateType === 0) {
+            continue;
+          }
+          child.update(delta, childClippingRect);
         }
-
-        child.update(delta, childClippingRect);
       }
     }
 
@@ -1503,7 +1604,7 @@ export class CoreNode extends EventEmitter {
     const renderCoords = (this.sceneRenderCoords ||
       this.renderCoords) as RenderCoords;
 
-    if (transform.tb === 0 || transform.tc === 0) {
+    if (transform.tb === 0 && transform.tc === 0) {
       this.renderBound = createBound(
         renderCoords.x1,
         renderCoords.y1,

package/src/core/CoreTextureManager.ts

@@ -281,12 +281,21 @@ export class CoreTextureManager extends EventEmitter {
       );
     } else {
       console.warn(
-        '[Lightning] Imageworker is 0 or not supported on this browser. Image loading will be slower.',
+        '[Lightning] Image worker count is 0 or workers are not supported on this browser. Image loading will be slower.',
       );
     }
 
     this.initialized = true;
     this.emit('initialized');
+
+    // Anything that arrived before initialization completed is now safe to
+    // process. Without this, queued textures would sit until the next frame
+    // tick happens to call processSome().
+    if (this.uploadTextureQueue.size > 0) {
+      this.processSome(Infinity).catch((err) => {
+        console.error('Failed to drain pre-init texture queue:', err);
+      });
+    }
   }
 
   /**
@@ -295,6 +304,9 @@ export class CoreTextureManager extends EventEmitter {
    * @param texture - The texture to upload
    */
   enqueueUploadTexture(texture: Texture): void {
+    if (texture.state === 'failed' || texture.state === 'freed') {
+      return;
+    }
     this.uploadTextureQueue.add(texture);
   }
 
@@ -308,7 +320,6 @@ export class CoreTextureManager extends EventEmitter {
     textureType: Type,
     props: ExtractProps<TextureMap[Type]>,
   ): InstanceType<TextureMap[Type]> {
-    let texture: Texture | undefined;
     const TextureClass = this.txConstructors[textureType];
     if (!TextureClass) {
       throw new TextureError(
@@ -316,20 +327,26 @@ export class CoreTextureManager extends EventEmitter {
         `Texture type "${textureType}" is not registered`,
       );
     }
-    const resolvedProps = TextureClass.resolveDefaults(props as any);
-    const cacheKey = TextureClass.makeCacheKey(resolvedProps as any);
-    if (cacheKey && this.keyCache.has(cacheKey)) {
-      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-      texture = this.keyCache.get(cacheKey)!;
-    } else {
-      // eslint-disable-next-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-explicit-any
-      texture = new TextureClass(this, resolvedProps as any);
 
-      if (cacheKey) {
-        this.initTextureToCache(texture, cacheKey);
+    // Cache key is computed from raw props (each Texture's makeCacheKey
+    // inlines its own defaults) so we can skip the resolveDefaults
+    // allocation on a cache hit.
+    const cacheKey = TextureClass.makeCacheKey(props as any);
+    if (cacheKey) {
+      const cached = this.keyCache.get(cacheKey);
+      if (cached) {
+        return cached as InstanceType<TextureMap[Type]>;
       }
     }
 
+    const resolvedProps = TextureClass.resolveDefaults(props as any);
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-explicit-any
+    const texture = new TextureClass(this, resolvedProps as any);
+
+    if (cacheKey) {
+      this.initTextureToCache(texture, cacheKey);
+    }
+
     return texture as InstanceType<TextureMap[Type]>;
   }
 
@@ -381,7 +398,10 @@ export class CoreTextureManager extends EventEmitter {
         console.error(`Failed to upload texture:`, err);
         texture.setState(
           'failed',
-          new TextureError(TextureErrorCode.TEXTURE_DATA_NULL),
+          new TextureError(
+            TextureErrorCode.TEXTURE_UPLOAD_FAILED,
+            err instanceof Error ? err.message : undefined,
+          ),
         );
       });
       return;
@@ -432,7 +452,7 @@ export class CoreTextureManager extends EventEmitter {
     }
 
     const coreContext = texture.loadCtxTexture();
-    if (coreContext !== null && coreContext.state === 'loaded') {
+    if (coreContext.state === 'loaded') {
       texture.setState('loaded');
       return;
     }
@@ -460,24 +480,83 @@ export class CoreTextureManager extends EventEmitter {
     const platform = this.platform;
     const startTime = platform.getTimeStamp();
 
-    // Process uploads - await each upload to prevent GPU overload
+    // Decode / fetch ("getTextureData") is IO-bound and parallelisable across
+    // image workers, while GPU upload is effectively serial. Keep a small
+    // sliding window of in-flight data fetches so the next decode runs while
+    // we're uploading the current one.
+    const prefetchLimit = Math.max(1, this.numImageWorkers);
+    const pending: Array<{ texture: Texture; data: Promise<unknown> }> = [];
+
+    // Helper avoids TS narrowing `texture.state` permanently after the first
+    // discriminated check — the property is mutable and can transition across
+    // awaits, so we need to re-read it freshly each time.
+    const isDead = (texture: Texture): boolean =>
+      texture.state === 'failed' || texture.state === 'freed';
+
+    const fillPrefetch = () => {
+      while (
+        pending.length < prefetchLimit &&
+        this.uploadTextureQueue.size > 0
+      ) {
+        const [texture] = this.uploadTextureQueue;
+        if (!texture) break;
+        this.uploadTextureQueue.delete(texture);
+
+        if (isDead(texture)) {
+          continue;
+        }
+
+        // Swallow the rejection here so an early failure doesn't surface as
+        // an unhandled promise rejection while it sits in the prefetch
+        // window; we re-check state after awaiting.
+        const data =
+          texture.textureData === null
+            ? texture.getTextureData().catch((err) => {
+                console.error('Failed to fetch texture data:', err);
+                return null;
+              })
+            : Promise.resolve(texture.textureData);
+
+        pending.push({ texture, data });
+      }
+    };
+
+    fillPrefetch();
+
     while (
-      this.uploadTextureQueue.size > 0 &&
+      pending.length > 0 &&
       platform.getTimeStamp() - startTime < maxProcessingTime
     ) {
-      const [texture] = this.uploadTextureQueue;
-      if (!texture) break;
-      this.uploadTextureQueue.delete(texture);
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      const next = pending.shift()!;
+      // Top up the prefetch window before awaiting — the next decode starts
+      // now and overlaps with this upload.
+      fillPrefetch();
+
+      if (isDead(next.texture)) {
+        continue;
+      }
+
       try {
-        if (texture.textureData === null) {
-          await texture.getTextureData();
+        await next.data;
+        if (isDead(next.texture)) {
+          continue;
         }
-        await this.uploadTexture(texture);
+        await this.uploadTexture(next.texture);
       } catch (error) {
         console.error('Failed to upload texture:', error);
         // Continue with next texture instead of stopping entire queue
       }
     }
+
+    // Time ran out before we got to these. Put them back so we don't lose
+    // them — their getTextureData() is already in flight and will populate
+    // `textureData` for the next tick.
+    for (const { texture } of pending) {
+      if (!isDead(texture)) {
+        this.uploadTextureQueue.add(texture);
+      }
+    }
   }
 
   public hasUpdates(): boolean {

package/src/core/Stage.ts

@@ -359,9 +359,10 @@ export class Stage {
 
     this.root = rootNode;
 
-    // Initialize root node properties
+    // Initialize root node properties. Copy in place into the eagerly-allocated
+    // matrices so the hidden class for these fields stays stable.
     rootNode.updateLocalTransform();
-    rootNode.globalTransform = Matrix3d.copy(rootNode.localTransform!);
+    Matrix3d.copy(rootNode.localTransform!, rootNode.globalTransform);
     rootNode.sceneGlobalTransform = Matrix3d.copy(rootNode.localTransform!);
     rootNode.calculateRenderCoords();
     rootNode.updateBoundingRect();

package/src/core/TextureError.ts

@@ -2,6 +2,7 @@ export enum TextureErrorCode {
   MEMORY_THRESHOLD_EXCEEDED = 'MEMORY_THRESHOLD_EXCEEDED',
   TEXTURE_DATA_NULL = 'TEXTURE_DATA_NULL',
   TEXTURE_TYPE_NOT_REGISTERED = 'TEXTURE_TYPE_NOT_REGISTERED',
+  TEXTURE_UPLOAD_FAILED = 'TEXTURE_UPLOAD_FAILED',
 }
 
 const defaultMessages: Record<TextureErrorCode, string> = {
@@ -9,6 +10,7 @@ const defaultMessages: Record<TextureErrorCode, string> = {
   [TextureErrorCode.TEXTURE_DATA_NULL]: 'Texture data is null',
   [TextureErrorCode.TEXTURE_TYPE_NOT_REGISTERED]:
     'Texture type is not registered',
+  [TextureErrorCode.TEXTURE_UPLOAD_FAILED]: 'Texture upload failed',
 };
 
 export class TextureError extends Error {

package/src/core/lib/ImageWorker.ts

@@ -67,7 +67,7 @@ function createImageWorker() {
 
         var blob = xhr.response;
         var withAlphaChannel =
-          premultiplyAlpha !== undefined
+          premultiplyAlpha !== undefined && premultiplyAlpha !== null
             ? premultiplyAlpha
             : hasAlphaChannel(blob.type);
 
@@ -83,7 +83,7 @@ function createImageWorker() {
             imageOrientation: 'none',
           })
             .then(function (data) {
-              resolve({ data, premultiplyAlpha: premultiplyAlpha });
+              resolve({ data: data, premultiplyAlpha: withAlphaChannel });
             })
             .catch(function (error) {
               reject(error);
@@ -91,13 +91,13 @@ function createImageWorker() {
           return;
         } else if (
           supportsOptionsCreateImageBitmap === false &&
-          supportsOptionsCreateImageBitmap === false
+          supportsFullCreateImageBitmap === false
         ) {
           // Fallback for browsers that do not support createImageBitmap with options
           // this is supported for Chrome v50 to v52/54 that doesn't support options
           createImageBitmap(blob)
             .then(function (data) {
-              resolve({ data, premultiplyAlpha: premultiplyAlpha });
+              resolve({ data: data, premultiplyAlpha: withAlphaChannel });
             })
             .catch(function (error) {
               reject(error);
@@ -109,7 +109,7 @@ function createImageWorker() {
             imageOrientation: 'none',
           })
             .then(function (data) {
-              resolve({ data, premultiplyAlpha: premultiplyAlpha });
+              resolve({ data: data, premultiplyAlpha: withAlphaChannel });
             })
             .catch(function (error) {
               reject(error);
@@ -156,7 +156,6 @@ function createImageWorker() {
 /* eslint-enable */
 
 export class ImageWorkerManager {
-  imageWorkersEnabled = true;
   messageManager: Record<number, MessageCallback> = {};
   workers: Worker[] = [];
   workerLoad: number[] = [];
@@ -172,6 +171,8 @@ export class ImageWorkerManager {
     );
     this.workers.forEach((worker, index) => {
       worker.onmessage = (event) => this.handleMessage(event, index);
+      worker.onerror = (event) => this.handleWorkerError(event, index);
+      worker.onmessageerror = (event) => this.handleWorkerError(event, index);
     });
   }
 
@@ -194,6 +195,25 @@ export class ImageWorkerManager {
     }
   }
 
+  private handleWorkerError(event: Event | ErrorEvent, workerIndex: number) {
+    const message =
+      event instanceof ErrorEvent && event.message
+        ? event.message
+        : 'Image worker encountered an unrecoverable error';
+
+    // Reject all pending requests; we cannot map a worker-level crash to a
+    // specific message id, so fail everything outstanding to avoid hangs.
+    for (const id in this.messageManager) {
+      const msg = this.messageManager[id];
+      if (msg) {
+        const [, reject] = msg;
+        delete this.messageManager[id];
+        reject(new Error(message));
+      }
+    }
+    this.workerLoad[workerIndex] = 0;
+  }
+
   private createWorkers(
     numWorkers = 1,
     createImageBitmapSupport: CreateImageBitmapSupport,
@@ -224,19 +244,22 @@ export class ImageWorkerManager {
     const blob: Blob = new Blob([workerCode], {
       type: 'application/javascript',
     });
-    const blobURL: string = (self.URL ? URL : webkitURL).createObjectURL(blob);
+    const urlFactory = self.URL ? URL : webkitURL;
+    const blobURL: string = urlFactory.createObjectURL(blob);
     const workers: Worker[] = [];
     for (let i = 0; i < numWorkers; i++) {
       workers.push(new Worker(blobURL));
       this.workerLoad.push(0);
     }
+    // Workers retain the script; the URL itself is no longer needed.
+    urlFactory.revokeObjectURL(blobURL);
     return workers;
   }
 
   private getNextWorkerIndex(): number {
     if (this.workers.length === 0) return -1;
 
-    let minLoad = 99;
+    let minLoad = Infinity;
     let workerIndex = 0;
 
     for (let i = 0; i < this.workers.length; i++) {
@@ -264,26 +287,26 @@ export class ImageWorkerManager {
   ): Promise<TextureData> {
     return new Promise((resolve, reject) => {
       try {
-        if (this.workers) {
-          const id = this.nextId++;
-          this.messageManager[id] = [resolve, reject];
-          const nextWorkerIndex = this.getNextWorkerIndex();
-
-          if (nextWorkerIndex !== -1) {
-            const worker = this.workers[nextWorkerIndex];
-            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-            this.workerLoad[nextWorkerIndex]!++;
-            worker!.postMessage({
-              id,
-              src: src,
-              premultiplyAlpha,
-              sx,
-              sy,
-              sw,
-              sh,
-            });
-          }
+        const nextWorkerIndex = this.getNextWorkerIndex();
+        if (nextWorkerIndex === -1) {
+          reject(new Error('No image workers available'));
+          return;
         }
+
+        const id = this.nextId++;
+        this.messageManager[id] = [resolve, reject];
+        const worker = this.workers[nextWorkerIndex];
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        this.workerLoad[nextWorkerIndex]!++;
+        worker!.postMessage({
+          id,
+          src: src,
+          premultiplyAlpha,
+          sx,
+          sy,
+          sw,
+          sh,
+        });
       } catch (error) {
         reject(error);
       }