Added worker implementation of database put

src/contexts/MapDataContext.js

@@ -6,7 +6,7 @@ import React, {
   useRef,
 } from "react";
 import * as Comlink from "comlink";
-import { decode } from "@msgpack/msgpack";
+import { decode, encode } from "@msgpack/msgpack";
 
 import { useAuth } from "./AuthContext";
 import { useDatabase } from "./DatabaseContext";
@@ -218,7 +218,16 @@ export function MapDataProvider({ children }) {
    */
   const putMap = useCallback(
     async (map) => {
-      await database.table("maps").put(map);
+      // Attempt to use worker to put map to avoid UI lockup
+      const packedMap = encode(map);
+      const success = await worker.putData(
+        Comlink.transfer(packedMap, [packedMap.buffer]),
+        "maps",
+        false
+      );
+      if (!success) {
+        await database.table("maps").put(map);
+      }
       if (map.owner !== userId) {
         await updateCache();
       }