From 0cd7c1e9dd56668e6f84f776c33d8d9f82d4cc68 Mon Sep 17 00:00:00 2001 From: Tristan Yang Date: Fri, 10 Mar 2023 14:33:36 +0800 Subject: [PATCH] refactor: add batch insert into indexDB --- package.json | 9 +- src/app/cache/index.ts | 5 +- .../listener.middleware/handler.channels.ts | 16 ++-- src/app/listener.middleware/handler.server.ts | 12 +-- src/app/listener.middleware/handler.users.ts | 15 ++-- yarn.lock | 83 +++++++++++++++++-- 6 files changed, 105 insertions(+), 35 deletions(-) diff --git a/package.json b/package.json index c548b4ae..057aaca1 100644 --- a/package.json +++ b/package.json @@ -42,9 +42,10 @@ "linkify-react": "^4.1.0", "linkifyjs": "^4.1.0", "localforage": "^1.10.0", + "localforage-setitems": "^1.4.0", "lodash": "^4.17.21", "masonry-layout": "^4.2.2", - "mini-css-extract-plugin": "^2.7.2", + "mini-css-extract-plugin": "^2.7.3", "qrcode.react": "^3.1.0", "react": "^18.2.0", "react-dev-utils": "^12.0.1", @@ -66,14 +67,14 @@ "rooks": "^7.4.4", "slate": "^0.91.4", "slate-history": "^0.86.0", - "slate-react": "^0.91.9", + "slate-react": "^0.91.10", "source-map-loader": "^4.0.1", "style-loader": "^3.3.1", "styled-components": "^5.3.8", - "terser-webpack-plugin": "^5.3.6", + "terser-webpack-plugin": "^5.3.7", "tippy.js": "^6.3.7", "typescript": "^4.9.5", - "webpack": "^5.75.0", + "webpack": "^5.76.0", "webpack-dev-server": "^4.11.1", "webpack-manifest-plugin": "^5.0.0", "workbox-background-sync": "^6.5.4", diff --git a/src/app/cache/index.ts b/src/app/cache/index.ts index 106e7e1f..c602a7e6 100644 --- a/src/app/cache/index.ts +++ b/src/app/cache/index.ts @@ -1,7 +1,10 @@ -import localforage from "localforage"; +import * as localforage from "localforage"; +import { extendPrototype } from 'localforage-setitems'; + import useRehydrate from "./useRehydrate"; import { KEY_UID, CACHE_VERSION } from "../config"; +extendPrototype(localforage); const tables = [ { storeName: "channels", diff --git a/src/app/listener.middleware/handler.channels.ts b/src/app/listener.middleware/handler.channels.ts index 60a583a4..6a0e3549 100644 --- a/src/app/listener.middleware/handler.channels.ts +++ b/src/app/listener.middleware/handler.channels.ts @@ -1,3 +1,5 @@ +import localforage from "localforage"; +import { Channel } from "../../types/channel"; import clearTable from "./clear.handler"; interface Params { data: any; @@ -5,7 +7,7 @@ interface Params { operation: string; } export default async function handler({ operation, data, payload }: Params) { - const table = window.CACHE["channels"]; + const table = window.CACHE["channels"] as typeof localforage; if (operation.startsWith("reset")) { clearTable("channels"); return; @@ -13,12 +15,11 @@ export default async function handler({ operation, data, payload }: Params) { switch (operation) { case "fillChannels": { - const chs = payload; - await Promise.all( - chs.map(({ gid, ...rest }) => { - return table?.setItem(gid + "", { gid, ...rest }); - }) - ); + const chs = payload as Channel[]; + const arr = chs.map(({ gid, ...rest }) => { + return { key: gid + "", value: rest }; + }); + await table.setItems(arr); } break; case "addChannel": @@ -39,7 +40,6 @@ export default async function handler({ operation, data, payload }: Params) { await table?.setItem(id + "", data.byId[id]); } break; - default: break; } diff --git a/src/app/listener.middleware/handler.server.ts b/src/app/listener.middleware/handler.server.ts index 12445872..28ca6be6 100644 --- a/src/app/listener.middleware/handler.server.ts +++ b/src/app/listener.middleware/handler.server.ts @@ -1,3 +1,4 @@ +import localforage from "localforage"; import clearTable from "./clear.handler"; interface Params { @@ -5,7 +6,7 @@ interface Params { operation: string; } export default async function handler({ operation, payload }: Params) { - const table = window.CACHE["server"]; + const table = window.CACHE["server"] as typeof localforage; if (operation.startsWith("reset")) { clearTable("server"); return; @@ -14,11 +15,10 @@ export default async function handler({ operation, payload }: Params) { case "updateInfo": { const data = payload; - await Promise.all( - Object.entries(data).map(([_key, _val]) => { - return table?.setItem(_key, _val); - }) - ); + const arr = Object.entries(data).map(([_key, _val]) => { + return { key: _key, value: _val }; + }); + await table.setItems(arr); } break; default: diff --git a/src/app/listener.middleware/handler.users.ts b/src/app/listener.middleware/handler.users.ts index d2af7f67..65aa3fe8 100644 --- a/src/app/listener.middleware/handler.users.ts +++ b/src/app/listener.middleware/handler.users.ts @@ -1,7 +1,9 @@ +import localforage from "localforage"; +import { User } from "../../types/user"; import clearTable from "./clear.handler"; export default async function handler({ operation, data, payload }) { - const table = window.CACHE["users"]; + const table = window.CACHE["users"] as typeof localforage; if (operation.startsWith("reset")) { clearTable("users"); return; @@ -9,12 +11,11 @@ export default async function handler({ operation, data, payload }) { switch (operation) { case "fillUsers": { - const users = payload; - await Promise.all( - users.map(({ uid, ...rest }) => { - return table?.setItem(uid + "", { uid, ...rest }); - }) - ); + const users = payload as User[]; + const arr = users.map(({ uid, ...rest }) => { + return { key: uid + "", value: rest }; + }); + await table.setItems(arr); } break; case "updateUsersByLogs": diff --git a/yarn.lock b/yarn.lock index 09498ac2..bc81dac0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8306,7 +8306,14 @@ loader-utils@^3.2.0: resolved "https://mirrors.cloud.tencent.com/npm/loader-utils/-/loader-utils-3.2.1.tgz#4fb104b599daafd82ef3e1a41fb9265f87e1f576" integrity sha512-ZvFw1KWS3GVyYBYb7qkmRM/WwL2TQQBxgCK62rlvm4WpVQ23Nb4tYjApUlfjrEGvOs7KHEsmyUn75OHZrJMWPw== -localforage@^1.10.0: +localforage-setitems@^1.4.0: + version "1.4.0" + resolved "https://mirrors.cloud.tencent.com/npm/localforage-setitems/-/localforage-setitems-1.4.0.tgz#36b8590d507dfb5c804033e287ece58d88996d5f" + integrity sha1-NrhZDVB9+1yAQDPih+zljYiZbV8= + dependencies: + localforage ">=1.4.0" + +localforage@>=1.4.0, localforage@^1.10.0: version "1.10.0" resolved "https://mirrors.cloud.tencent.com/npm/localforage/-/localforage-1.10.0.tgz#5c465dc5f62b2807c3a84c0c6a1b1b3212781dd4" integrity sha512-14/H1aX7hzBBmmh7sGPd+AOMkkIrHM3Z1PAyGgZigA1H1p5O5ANnMyWzvpAETtG68/dC4pC0ncy3+PPGzXZHPg== @@ -8561,13 +8568,20 @@ mimic-fn@^4.0.0: resolved "https://mirrors.cloud.tencent.com/npm/mimic-fn/-/mimic-fn-4.0.0.tgz#60a90550d5cb0b239cca65d893b1a53b29871ecc" integrity sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw== -mini-css-extract-plugin@^2.4.5, mini-css-extract-plugin@^2.7.2: +mini-css-extract-plugin@^2.4.5: version "2.7.2" resolved "https://mirrors.cloud.tencent.com/npm/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.2.tgz#e049d3ea7d3e4e773aad585c6cb329ce0c7b72d7" integrity sha512-EdlUizq13o0Pd+uCp+WO/JpkLvHRVGt97RqfeGhXqAcorYo1ypJSpkV+WDT0vY/kmh/p7wRdJNJtuyK540PXDw== dependencies: schema-utils "^4.0.0" +mini-css-extract-plugin@^2.7.3: + version "2.7.3" + resolved "https://mirrors.cloud.tencent.com/npm/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.3.tgz#794aa4d598bf178a66b2a35fe287c3df3eac394e" + integrity sha512-CD9cXeKeXLcnMw8FZdtfrRrLaM7gwCl4nKuKn2YkY2Bw5wdlB8zU2cCzw+w2zS9RFvbrufTBkMCJACNPwqQA0w== + dependencies: + schema-utils "^4.0.0" + minimalistic-assert@^1.0.0: version "1.0.1" resolved "https://mirrors.cloud.tencent.com/npm/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7" @@ -10832,7 +10846,7 @@ serialize-javascript@^4.0.0: dependencies: randombytes "^2.1.0" -serialize-javascript@^6.0.0: +serialize-javascript@^6.0.0, serialize-javascript@^6.0.1: version "6.0.1" resolved "https://mirrors.cloud.tencent.com/npm/serialize-javascript/-/serialize-javascript-6.0.1.tgz#b206efb27c3da0b0ab6b52f48d170b7996458e5c" integrity sha512-owoXEFjWRllis8/M1Q+Cw5k8ZH40e3zhp/ovX+Xr/vi1qj6QesbyXXViFbpNvWvPNAD62SutwEXavefrLJWj7w== @@ -10952,10 +10966,10 @@ slate-history@^0.86.0: dependencies: is-plain-object "^5.0.0" -slate-react@^0.91.9: - version "0.91.9" - resolved "https://mirrors.cloud.tencent.com/npm/slate-react/-/slate-react-0.91.9.tgz#c6418eced53b233b8cfe39649ebcf103f760a512" - integrity sha512-e3DvmZuUEKKrIB8Kb4RmJ+qzIL2IVJjN2NM/IHRi8W5MmjAtd8yhv46Ewz1sCf0F7uRODS5xvrQsJJAftQhH4Q== +slate-react@^0.91.10: + version "0.91.10" + resolved "https://mirrors.cloud.tencent.com/npm/slate-react/-/slate-react-0.91.10.tgz#b47ec5a575941ebab416c167986a5342cf550ccd" + integrity sha512-GEOpXNucqnJIQXBd06TETKxth/erbU+nVcxdSk1ijG/hZTlK86eVZzvAHma20+BPHhiNI2Qt2unHnrpLDzWHFQ== dependencies: "@juggle/resize-observer" "^3.4.0" "@types/is-hotkey" "^0.1.1" @@ -11516,7 +11530,7 @@ terminal-link@^2.0.0: ansi-escapes "^4.2.1" supports-hyperlinks "^2.0.0" -terser-webpack-plugin@^5.1.3, terser-webpack-plugin@^5.2.5, terser-webpack-plugin@^5.3.6: +terser-webpack-plugin@^5.1.3, terser-webpack-plugin@^5.2.5: version "5.3.6" resolved "https://mirrors.cloud.tencent.com/npm/terser-webpack-plugin/-/terser-webpack-plugin-5.3.6.tgz#5590aec31aa3c6f771ce1b1acca60639eab3195c" integrity sha512-kfLFk+PoLUQIbLmB1+PZDMRSZS99Mp+/MHqDNmMA6tOItzRt+Npe3E+fsMs5mfcM0wCtrrdU387UnV+vnSffXQ== @@ -11527,6 +11541,17 @@ terser-webpack-plugin@^5.1.3, terser-webpack-plugin@^5.2.5, terser-webpack-plugi serialize-javascript "^6.0.0" terser "^5.14.1" +terser-webpack-plugin@^5.3.7: + version "5.3.7" + resolved "https://mirrors.cloud.tencent.com/npm/terser-webpack-plugin/-/terser-webpack-plugin-5.3.7.tgz#ef760632d24991760f339fe9290deb936ad1ffc7" + integrity sha512-AfKwIktyP7Cu50xNjXF/6Qb5lBNzYaWpU6YfoX3uZicTx0zTy0stDDCsvjDapKsSDvOeWo5MEq4TmdBy2cNoHw== + dependencies: + "@jridgewell/trace-mapping" "^0.3.17" + jest-worker "^27.4.5" + schema-utils "^3.1.1" + serialize-javascript "^6.0.1" + terser "^5.16.5" + terser@^5.0.0, terser@^5.10.0, terser@^5.14.1: version "5.16.3" resolved "https://mirrors.cloud.tencent.com/npm/terser/-/terser-5.16.3.tgz#3266017a9b682edfe019b8ecddd2abaae7b39c6b" @@ -11537,6 +11562,16 @@ terser@^5.0.0, terser@^5.10.0, terser@^5.14.1: commander "^2.20.0" source-map-support "~0.5.20" +terser@^5.16.5: + version "5.16.5" + resolved "https://mirrors.cloud.tencent.com/npm/terser/-/terser-5.16.5.tgz#1c285ca0655f467f92af1bbab46ab72d1cb08e5a" + integrity sha512-qcwfg4+RZa3YvlFh0qjifnzBHjKGNbtDo9yivMqMFDy9Q6FSaQWSB/j1xKhsoUFJIqDOM3TsN6D5xbrMrFcHbg== + dependencies: + "@jridgewell/source-map" "^0.3.2" + acorn "^8.5.0" + commander "^2.20.0" + source-map-support "~0.5.20" + test-exclude@^6.0.0: version "6.0.0" resolved "https://mirrors.cloud.tencent.com/npm/test-exclude/-/test-exclude-6.0.0.tgz#04a8698661d805ea6fa293b6cb9e63ac044ef15e" @@ -12130,7 +12165,7 @@ webpack-sources@^3.2.3: resolved "https://mirrors.cloud.tencent.com/npm/webpack-sources/-/webpack-sources-3.2.3.tgz#2d4daab8451fd4b240cc27055ff6a0c2ccea0cde" integrity sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w== -webpack@^5.64.4, webpack@^5.75.0: +webpack@^5.64.4: version "5.75.0" resolved "https://mirrors.cloud.tencent.com/npm/webpack/-/webpack-5.75.0.tgz#1e440468647b2505860e94c9ff3e44d5b582c152" integrity sha512-piaIaoVJlqMsPtX/+3KTTO6jfvrSYgauFVdt8cr9LTHKmcq/AMd4mhzsiP7ZF/PGRNPGA8336jldh9l2Kt2ogQ== @@ -12160,6 +12195,36 @@ webpack@^5.64.4, webpack@^5.75.0: watchpack "^2.4.0" webpack-sources "^3.2.3" +webpack@^5.76.0: + version "5.76.0" + resolved "https://mirrors.cloud.tencent.com/npm/webpack/-/webpack-5.76.0.tgz#f9fb9fb8c4a7dbdcd0d56a98e56b8a942ee2692c" + integrity sha512-l5sOdYBDunyf72HW8dF23rFtWq/7Zgvt/9ftMof71E/yUb1YLOBmTgA2K4vQthB3kotMrSj609txVE0dnr2fjA== + dependencies: + "@types/eslint-scope" "^3.7.3" + "@types/estree" "^0.0.51" + "@webassemblyjs/ast" "1.11.1" + "@webassemblyjs/wasm-edit" "1.11.1" + "@webassemblyjs/wasm-parser" "1.11.1" + acorn "^8.7.1" + acorn-import-assertions "^1.7.6" + browserslist "^4.14.5" + chrome-trace-event "^1.0.2" + enhanced-resolve "^5.10.0" + es-module-lexer "^0.9.0" + eslint-scope "5.1.1" + events "^3.2.0" + glob-to-regexp "^0.4.1" + graceful-fs "^4.2.9" + json-parse-even-better-errors "^2.3.1" + loader-runner "^4.2.0" + mime-types "^2.1.27" + neo-async "^2.6.2" + schema-utils "^3.1.0" + tapable "^2.1.1" + terser-webpack-plugin "^5.1.3" + watchpack "^2.4.0" + webpack-sources "^3.2.3" + websocket-driver@>=0.5.1, websocket-driver@^0.7.4: version "0.7.4" resolved "https://mirrors.cloud.tencent.com/npm/websocket-driver/-/websocket-driver-0.7.4.tgz#89ad5295bbf64b480abcba31e4953aca706f5760"