Use MessageChannel for communication, don't recreate workers, tighten up types.

GitOrigin-RevId: d97f45eab7ac4297d7bfa5d6d9186e5ab2f537c1

Author: cpojer

hera/hooks/useClientGameAction.tsx

@@ -5,25 +5,18 @@ import encodeGameActionResponse from '@deities/apollo/actions/encodeGameActionRe
 import {
   decodeEffects,
   Effects,
-  EncodedEffects,
   encodeEffects,
 } from '@deities/apollo/Effects.tsx';
 import {
   decodeActionResponse,
   encodeAction,
-  EncodedActionResponse,
 } from '@deities/apollo/EncodedActions.tsx';
 import { decodeGameState } from '@deities/apollo/GameState.tsx';
 import { computeVisibleEndTurnActionResponse } from '@deities/apollo/lib/computeVisibleActions.tsx';
 import decodeGameActionResponse from '@deities/apollo/lib/decodeGameActionResponse.tsx';
 import dropLabelsFromActionResponse from '@deities/apollo/lib/dropLabelsFromActionResponse.tsx';
 import dropLabelsFromGameState from '@deities/apollo/lib/dropLabelsFromGameState.tsx';
-import {
-  EncodedGameState,
-  GameActionResponse,
-  GameState,
-} from '@deities/apollo/Types.tsx';
-import { PlainMap } from '@deities/athena/map/PlainMap.tsx';
+import { GameActionResponse, GameState } from '@deities/apollo/Types.tsx';
 import MapData from '@deities/athena/MapData.tsx';
 import { getHiddenLabels } from '@deities/athena/WinConditions.tsx';
 import onGameEnd from '@deities/hermes/game/onGameEnd.tsx';
@@ -32,17 +25,27 @@ import toClientGame, {
 } from '@deities/hermes/game/toClientGame.tsx';
 import { useCallback } from 'react';
 import gameActionWorker from '../workers/gameAction.tsx?worker';
-
-type ClientGameAction = [
-  actionResponse: EncodedActionResponse,
-  map: PlainMap,
-  gameState: EncodedGameState,
-  effects: EncodedEffects,
-];
+import {
+  ClientGameActionRequest,
+  ClientGameActionResponse,
+} from '../workers/Types.tsx';
 
 const ActionError = (action: Action) =>
   new Error(`Map: Error executing remote '${action.type}' action.`);
 
+let worker: Worker | null = null;
+const getWorker = () => {
+  if (worker) {
+    return worker;
+  }
+  worker = new gameActionWorker();
+  worker.onerror = () => {
+    worker?.terminate();
+    worker = null;
+  };
+  return worker;
+};
+
 export default function useClientGameAction(
   game: ClientGame | null,
   setGame: (game: ClientGame) => void,
@@ -69,27 +72,36 @@ export default function useClientGameAction(
       }
 
       try {
-        const worker = new gameActionWorker();
+        const message: ClientGameActionRequest = [
+          map.toJSON(),
+          encodeEffects(game.effects),
+          encodeAction(action),
+          mutateAction,
+        ];
+
         const [
           encodedActionResponse,
           plainMap,
           encodedGameState,
           encodedEffects,
-        ] = await new Promise<ClientGameAction>((resolve) => {
-          worker.postMessage([
-            map.toJSON(),
-            encodeEffects(game.effects),
-            encodeAction(action),
-            mutateAction,
-          ]);
-          worker.onmessage = (event: MessageEvent<ClientGameAction>) =>
-            resolve(event.data);
+        ] = await new Promise<ClientGameActionResponse>((resolve, reject) => {
+          const { port1, port2 } = new MessageChannel();
+          port1.onmessage = (
+            event: MessageEvent<ClientGameActionResponse | null>,
+          ) => {
+            if (event.data) {
+              resolve(event.data);
+            } else {
+              reject();
+            }
+          };
+          port1.onmessageerror = reject;
+          getWorker().postMessage(message, [port2]);
         });
-
         actionResponse = decodeActionResponse(encodedActionResponse);
         initialActiveMap = MapData.fromObject(plainMap);
         gameState = decodeGameState(encodedGameState);
-        newEffects = decodeEffects(encodedEffects);
+        newEffects = encodedEffects ? decodeEffects(encodedEffects) : null;
       } catch (error) {
         throw process.env.NODE_ENV === 'development'
           ? error

hera/workers/Types.tsx

@@ -0,0 +1,22 @@
+import { MutateActionResponseFnName } from '@deities/apollo/ActionResponseMutator.tsx';
+import { EncodedEffects } from '@deities/apollo/Effects.tsx';
+import {
+  EncodedAction,
+  EncodedActionResponse,
+} from '@deities/apollo/EncodedActions.tsx';
+import { EncodedGameState } from '@deities/apollo/Types.tsx';
+import { PlainMap } from '@deities/athena/map/PlainMap.tsx';
+
+export type ClientGameActionResponse = [
+  actionResponse: EncodedActionResponse,
+  map: PlainMap,
+  gameState: EncodedGameState,
+  effects: EncodedEffects | null,
+];
+
+export type ClientGameActionRequest = [
+  map: PlainMap,
+  encodedEffects: EncodedEffects,
+  action: EncodedAction,
+  mutateAction: MutateActionResponseFnName | undefined | null,
+];

hera/workers/gameAction.tsx

@@ -1,36 +1,23 @@
 import './initializeWorker.tsx';
 import { ActionResponse } from '@deities/apollo/ActionResponse.tsx';
-import ActionResponseMutator, {
-  MutateActionResponseFnName,
-} from '@deities/apollo/ActionResponseMutator.tsx';
+import ActionResponseMutator from '@deities/apollo/ActionResponseMutator.tsx';
 import executeGameAction from '@deities/apollo/actions/executeGameAction.tsx';
 import {
   decodeEffects,
   Effects,
-  EncodedEffects,
   encodeEffects,
 } from '@deities/apollo/Effects.tsx';
 import {
   decodeAction,
   encodeActionResponse,
-  EncodedAction,
 } from '@deities/apollo/EncodedActions.tsx';
 import { encodeGameState } from '@deities/apollo/GameState.tsx';
 import { GameState } from '@deities/apollo/Types.tsx';
-import { PlainMap } from '@deities/athena/map/PlainMap.tsx';
 import MapData from '@deities/athena/MapData.tsx';
 import AIRegistry from '@deities/dionysus/AIRegistry.tsx';
+import { ClientGameActionRequest, ClientGameActionResponse } from './Types.tsx';
 
-self.onmessage = function (
-  event: MessageEvent<
-    [
-      map: PlainMap,
-      encodedEffects: EncodedEffects,
-      action: EncodedAction,
-      mutateAction: MutateActionResponseFnName | undefined | null,
-    ]
-  >,
-) {
+self.onmessage = function (event: MessageEvent<ClientGameActionRequest>) {
   const [plainMap, encodedEffects, action, mutateAction] = event.data;
   const map = MapData.fromObject(plainMap);
   const vision = map.createVisionObject(map.getCurrentPlayer());
@@ -49,10 +36,21 @@ self.onmessage = function (
     mutateAction ? ActionResponseMutator[mutateAction] : undefined,
   );
 
-  self.postMessage([
-    actionResponse ? encodeActionResponse(actionResponse) : null,
-    initialActiveMap ? initialActiveMap?.toJSON() : null,
-    gameState ? encodeGameState(gameState) : null,
-    newEffects ? encodeEffects(newEffects) : null,
-  ]);
+  const message: ClientGameActionResponse | null =
+    actionResponse && initialActiveMap && gameState
+      ? [
+          encodeActionResponse(actionResponse),
+          initialActiveMap?.toJSON(),
+          encodeGameState(gameState),
+          newEffects ? encodeEffects(newEffects) : null,
+        ]
+      : null;
+
+  if (event.ports.length === 1) {
+    event.ports[0].postMessage(message);
+  } else {
+    for (const port of event.ports) {
+      port.postMessage(message);
+    }
+  }
 };