diff --git a/.vscode/settings.json b/.vscode/settings.json
index e73292f..f93addc 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -75,7 +75,8 @@
     "unmounting",
     "unregistering",
     "unsyncable",
-    "whatsnew"
+    "whatsnew",
+    "workerize"
   ],
   "i18next.defaultTranslatedLocale": "en",
   "i18next.i18nPaths": "public/locales",
diff --git a/package.json b/package.json
index 0089ea1..1cd0d8b 100644
--- a/package.json
+++ b/package.json
@@ -122,10 +122,12 @@
     "react-scripts": "^4.0.3",
     "redux-devtools-extension": "^2.13.9",
     "rimraf": "^3.0.2",
+    "ts-loader": "^8.0.18",
     "typescript": "4.1.5",
     "utility-types": "^3.10.0",
     "webpack-bundle-analyzer": "^4.4.0",
-    "webpackbar": "^5.0.0-3"
+    "webpackbar": "^5.0.0-3",
+    "workerize-loader": "^1.3.0"
   },
   "jest": {
     "transformIgnorePatterns": [
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 94d3144..1e9e663 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -81,10 +81,12 @@
   react-scripts: 4.0.3_react@17.0.1+typescript@4.1.5
   redux-devtools-extension: 2.13.9_redux@4.0.5
   rimraf: 3.0.2
+  ts-loader: 8.0.18_typescript@4.1.5
   typescript: 4.1.5
   utility-types: 3.10.0
   webpack-bundle-analyzer: 4.4.0
   webpackbar: 5.0.0-3
+  workerize-loader: 1.3.0
 lockfileVersion: 5.2
 packages:
   /@ant-design/colors/6.0.0:
@@ -12934,6 +12936,22 @@
     dev: true
     resolution:
       integrity: sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA==
+  /ts-loader/8.0.18_typescript@4.1.5:
+    dependencies:
+      chalk: 4.1.0
+      enhanced-resolve: 4.5.0
+      loader-utils: 2.0.0
+      micromatch: 4.0.2
+      semver: 7.3.4
+      typescript: 4.1.5
+    dev: true
+    engines:
+      node: '>=10.0.0'
+    peerDependencies:
+      typescript: '*'
+      webpack: '*'
+    resolution:
+      integrity: sha512-hRZzkydPX30XkLaQwJTDcWDoxZHK6IrEMDQpNd7tgcakFruFkeUp/aY+9hBb7BUGb+ZWKI0jiOGMo0MckwzdDQ==
   /ts-pnp/1.2.0_typescript@4.1.5:
     dependencies:
       typescript: 4.1.5
@@ -13855,6 +13873,14 @@
     dev: true
     resolution:
       integrity: sha512-P1WjMrUB3qgJNI9jfmpZ/htmBEjFh//6l/5y8SD9hg1Ef5zTTVVoRjTrTEzPrNBQvmhMxkoTsjOXN10GWU7aCg==
+  /workerize-loader/1.3.0:
+    dependencies:
+      loader-utils: 2.0.0
+    dev: true
+    peerDependencies:
+      webpack: '*'
+    resolution:
+      integrity: sha512-utWDc8K6embcICmRBUUkzanPgKBb8yM1OHfh6siZfiMsswE8wLCa9CWS+L7AARz0+Th4KH4ZySrqer/OJ9WuWw==
   /world-countries/4.0.0:
     dev: false
     resolution:
@@ -14082,6 +14108,7 @@
   semver: ^7.3.4
   shallowequal: ^1.1.0
   spu-md5: 0.0.4
+  ts-loader: ^8.0.18
   typesafe-actions: ^5.1.0
   typescript: 4.1.5
   utility-types: ^3.10.0
@@ -14094,3 +14121,4 @@
   workbox-precaching: ^6.1.1
   workbox-routing: ^6.1.1
   workbox-strategies: ^6.1.1
+  workerize-loader: ^1.3.0
diff --git a/src/App.tsx b/src/App.tsx
index b6be171..80866f8 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -13,6 +13,9 @@
 // FIXME: Apparently the import order of my CSS is important. Who knew!
 import "./App.less";
 
+import createWorker from "workerize-loader?name=kw-storage-worker.[contenthash:8]!./workers/Storage.worker";
+import * as StorageWorker from "./workers/Storage.worker";
+
 import { AppLoading } from "./global/AppLoading";
 import { CheckStatus } from "./pages/CheckStatus";
 import { AppServices } from "./global/AppServices";
@@ -32,6 +35,11 @@
     store = initStore();
   }
 
+  const worker = createWorker<typeof StorageWorker>();
+  console.log(worker);
+  worker.foo("test")
+    .then((s: string) => debug("worker said: %s", s));
+
   return <Suspense fallback={<AppLoading />}>
     <Provider store={store}>
       <LocaleContext>
diff --git a/src/workers/Storage.worker.ts b/src/workers/Storage.worker.ts
new file mode 100644
index 0000000..b9c4f1b
--- /dev/null
+++ b/src/workers/Storage.worker.ts
@@ -0,0 +1,12 @@
+// Copyright (c) 2020-2021 Drew Lemmy
+// This file is part of KristWeb 2 under AGPL-3.0.
+// Full details: https://github.com/tmpim/KristWeb2/blob/master/LICENSE.txt
+import Debug from "debug";
+
+const window = { localStorage: { debug: "kristweb:*" }};
+const debug = Debug("kristweb:storage-worker");
+
+export async function foo(test: string): Promise<string> {
+  debug("sw debug");
+  return "1251512" + test;
+}
diff --git a/src/workers/createWorker.ts b/src/workers/createWorker.ts
new file mode 100644
index 0000000..3f4e0a0
--- /dev/null
+++ b/src/workers/createWorker.ts
@@ -0,0 +1,12 @@
+// Copyright (c) 2020-2021 Drew Lemmy
+// This file is part of KristWeb 2 under AGPL-3.0.
+// Full details: https://github.com/tmpim/KristWeb2/blob/master/LICENSE.txt
+
+// Implementation sourced from:
+// https://github.com/developit/workerize-loader/issues/3#issuecomment-393165124
+
+type WorkerType<T> = T & Pick<Worker, "terminate">
+export function createWorker<T>(workerPath: T): WorkerType<T> {
+  return (workerPath as any)();
+}
+export type createWorker<T> = WorkerType<T>;
diff --git a/typings/workers.d.ts b/typings/workers.d.ts
new file mode 100644
index 0000000..e990032
--- /dev/null
+++ b/typings/workers.d.ts
@@ -0,0 +1,18 @@
+declare module "workerize-loader*" {
+  type FlattenedPromise<T> = unknown extends T
+    ? Promise<T>
+    : T extends Promise<infer U>
+    ? T
+    : Promise<T>;
+
+  type AnyFunction = (...args: any[]) => any;
+  type Async<F extends AnyFunction> = (
+    ...args: Parameters<F>
+  ) => FlattenedPromise<ReturnType<F>>;
+
+  type Workerized<T> = Worker &
+    { [K in keyof T]: T[K] extends AnyFunction ? Async<T[K]> : never };
+
+  function createInstance<T>(): Workerized<T>;
+  export = createInstance;
+}