feat: support shared workers with newWebWorkerSyntax enabled (#105)

Release-as: 0.8.2
gravity-ui · Nov 15, 2023 · 6527cc3 · 6527cc3
1 parent 1d85c25
commit 6527cc3
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 20 deletions.
diff --git a/README.md b/README.md
@@ -299,7 +299,7 @@ declare module '*.worker.ts' {
 ```ts
 import {Worker} from '@gravity-ui/app-builder/worker';
 
-const MyWorker = new Worker(new URL('./my.worker'), import.meta.url);
+const MyWorker = new Worker(new URL('./my.worker', import.meta.url));
 ```
 
 To use the web worker in your main script, you need to communicate with it using the postMessage and onmessage methods. For example:

diff --git a/src/common/webpack/worker/web-worker.ts b/src/common/webpack/worker/web-worker.ts
@@ -3,27 +3,40 @@ declare let __webpack_public_path__: string;
 
 class WebWorker extends Worker {
     constructor(url: string | URL, options?: WorkerOptions) {
-        // eslint-disable-next-line camelcase
-        const publicPath = __webpack_public_path__;
-        const workerPublicPath = publicPath.match(/^https?:\/\//)
-            ? publicPath
-            : new URL(publicPath, window.location.href).toString();
-        const objectURL = URL.createObjectURL(
-            new Blob(
-                [
-                    [
-                        `self.__PUBLIC_PATH__ = ${JSON.stringify(workerPublicPath)}`,
-                        `importScripts(${JSON.stringify(url.toString())});`,
-                    ].join('\n'),
-                ],
-                {
-                    type: 'application/javascript',
-                },
-            ),
-        );
+        const objectURL = generateWorkerLoader(url);
         super(objectURL, options);
         URL.revokeObjectURL(objectURL);
     }
 }
 
-export {WebWorker as Worker};
+class SharedWebWorker extends SharedWorker {
+    constructor(url: string | URL, options?: string | WorkerOptions) {
+        const objectURL = generateWorkerLoader(url);
+        super(objectURL, options);
+        URL.revokeObjectURL(objectURL);
+    }
+}
+
+export {WebWorker as Worker, SharedWebWorker as SharedWorker};
+
+function generateWorkerLoader(url: string | URL) {
+    // eslint-disable-next-line camelcase
+    const publicPath = __webpack_public_path__;
+    const workerPublicPath = publicPath.match(/^https?:\/\//)
+        ? publicPath
+        : new URL(publicPath, window.location.href).toString();
+    const objectURL = URL.createObjectURL(
+        new Blob(
+            [
+                [
+                    `self.__PUBLIC_PATH__ = ${JSON.stringify(workerPublicPath)}`,
+                    `importScripts(${JSON.stringify(url.toString())});`,
+                ].join('\n'),
+            ],
+            {
+                type: 'application/javascript',
+            },
+        ),
+    );
+    return objectURL;
+}