From f33e4e9fc39f9cec755aefdb91c5e95da916d3d8 Mon Sep 17 00:00:00 2001 From: xueyueben <522109452@qq.com> Date: Thu, 5 Dec 2024 14:41:00 +0800 Subject: [PATCH 1/5] =?UTF-8?q?feat:=20getRectByTaro=20=E6=96=B9=E6=B3=95?= =?UTF-8?q?=E5=9C=A8=E5=B0=8F=E7=A8=8B=E5=BA=8F=E5=86=85=E5=A2=9E=E5=8A=A0?= =?UTF-8?q?=E7=BC=93=E5=AD=98=E4=BB=A5=E6=8F=90=E5=8D=87=E6=80=A7=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 3 ++- src/utils/get-rect-by-taro.ts | 9 +++++++++ 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 460d59015f..7a79704286 100644 --- a/package.json +++ b/package.json @@ -105,7 +105,8 @@ "classnames": "^2.5.1", "lodash.isequal": "^4.5.0", "lodash.kebabcase": "^4.1.1", - "react-transition-group": "^4.4.5" + "react-transition-group": "^4.4.5", + "quick-lru": "^4.0.1" }, "devDependencies": { "@babel/core": "^7.23.9", diff --git a/src/utils/get-rect-by-taro.ts b/src/utils/get-rect-by-taro.ts index cf3abd59df..fa39c39dd7 100644 --- a/src/utils/get-rect-by-taro.ts +++ b/src/utils/get-rect-by-taro.ts @@ -1,6 +1,9 @@ import { createSelectorQuery } from '@tarojs/taro' +import QuickLRU from 'quick-lru' import { getRect, inBrowser } from './use-client-rect' +const lru = new QuickLRU({ maxSize: 10 }) + export interface Rect { dataset: Record id: string @@ -30,10 +33,16 @@ export const getRectByTaro = async (element: any): Promise => { } // 小程序下的逻辑 return new Promise((resolve, reject) => { + if (lru.has(element)) { + resolve(lru.get(element) as Rect) + } createSelectorQuery() .select(`#${element.uid}`) .boundingClientRect() .exec(([rects]) => { + if (rects) { + lru.set(element, rects) + } resolve(rects) }) }) From 59fa40d9abf84c8610f90a7d37ec3a4841a1a0e0 Mon Sep 17 00:00:00 2001 From: xueyueben <522109452@qq.com> Date: Thu, 5 Dec 2024 17:26:25 +0800 Subject: [PATCH 2/5] =?UTF-8?q?feat:=20lock=20=E6=96=87=E4=BB=B6=E6=8F=90?= =?UTF-8?q?=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pnpm-lock.yaml | 30 ++++++++++++++++-------------- src/utils/get-rect-by-taro.ts | 1 + 2 files changed, 17 insertions(+), 14 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d47390c252..51c4014cfc 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -45,6 +45,9 @@ importers: lodash.kebabcase: specifier: ^4.1.1 version: 4.1.1 + quick-lru: + specifier: ^4.0.1 + version: 4.0.1 react-transition-group: specifier: ^4.4.5 version: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -111,10 +114,10 @@ importers: version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/plugin-platform-alipay': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/plugin-platform-weapp': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/react': specifier: 3.6.22 version: 3.6.22(react@18.3.1) @@ -492,7 +495,7 @@ importers: version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-alipay': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/plugin-platform-h5': specifier: 3.6.22 version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) @@ -501,7 +504,7 @@ importers: version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-qq': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-swan': specifier: 3.6.22 version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) @@ -510,7 +513,7 @@ importers: version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-weapp': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/react': specifier: 3.6.22 version: 3.6.22(react@18.3.1) @@ -15865,7 +15868,7 @@ snapshots: - supports-color - vue - '@tarojs/plugin-platform-alipay@3.6.22(@types/react@18.3.4)(postcss@8.4.41)': + '@tarojs/plugin-platform-alipay@3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1)': dependencies: '@tarojs/components': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/service': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) @@ -15877,6 +15880,7 @@ snapshots: - '@types/webpack' - '@types/webpack-dev-server' - postcss + - react - supports-color - vue @@ -15915,9 +15919,9 @@ snapshots: - supports-color - vue - '@tarojs/plugin-platform-qq@3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1)': + '@tarojs/plugin-platform-qq@3.6.22(@types/react@18.3.4)(postcss@8.4.41)': dependencies: - '@tarojs/plugin-platform-weapp': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) + '@tarojs/plugin-platform-weapp': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/service': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/shared': 3.6.22 transitivePeerDependencies: @@ -15927,7 +15931,6 @@ snapshots: - '@types/webpack' - '@types/webpack-dev-server' - postcss - - react - supports-color - vue @@ -15961,7 +15964,7 @@ snapshots: - supports-color - vue - '@tarojs/plugin-platform-weapp@3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1)': + '@tarojs/plugin-platform-weapp@3.6.22(@types/react@18.3.4)(postcss@8.4.41)': dependencies: '@tarojs/components': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/service': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) @@ -15973,7 +15976,6 @@ snapshots: - '@types/webpack' - '@types/webpack-dev-server' - postcss - - react - supports-color - vue @@ -16107,12 +16109,12 @@ snapshots: dependencies: '@parcel/css': 1.14.0 '@tarojs/helper': 3.6.22 - '@tarojs/plugin-platform-alipay': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) + '@tarojs/plugin-platform-alipay': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/plugin-platform-jd': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) - '@tarojs/plugin-platform-qq': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) + '@tarojs/plugin-platform-qq': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-swan': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-tt': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) - '@tarojs/plugin-platform-weapp': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) + '@tarojs/plugin-platform-weapp': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/runner-utils': 3.6.22 '@tarojs/runtime': 3.6.22 '@tarojs/shared': 3.6.22 diff --git a/src/utils/get-rect-by-taro.ts b/src/utils/get-rect-by-taro.ts index fa39c39dd7..277a93cc6e 100644 --- a/src/utils/get-rect-by-taro.ts +++ b/src/utils/get-rect-by-taro.ts @@ -35,6 +35,7 @@ export const getRectByTaro = async (element: any): Promise => { return new Promise((resolve, reject) => { if (lru.has(element)) { resolve(lru.get(element) as Rect) + return } createSelectorQuery() .select(`#${element.uid}`) From 0f6a55c3e7cc670e02b280b4143ce35a6e795bd5 Mon Sep 17 00:00:00 2001 From: xueyueben <522109452@qq.com> Date: Mon, 9 Dec 2024 11:28:40 +0800 Subject: [PATCH 3/5] =?UTF-8?q?feat:=20=E5=B7=A5=E5=85=B7=E7=B1=BB?= =?UTF-8?q?=E6=96=B0=E5=A2=9E=20lru?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 3 +-- pnpm-lock.yaml | 32 +++++++++++++++----------------- src/utils/get-rect-by-taro.ts | 4 ++-- src/utils/lru.ts | 33 +++++++++++++++++++++++++++++++++ 4 files changed, 51 insertions(+), 21 deletions(-) create mode 100644 src/utils/lru.ts diff --git a/package.json b/package.json index 7a79704286..460d59015f 100644 --- a/package.json +++ b/package.json @@ -105,8 +105,7 @@ "classnames": "^2.5.1", "lodash.isequal": "^4.5.0", "lodash.kebabcase": "^4.1.1", - "react-transition-group": "^4.4.5", - "quick-lru": "^4.0.1" + "react-transition-group": "^4.4.5" }, "devDependencies": { "@babel/core": "^7.23.9", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 51c4014cfc..396160638e 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -45,9 +45,6 @@ importers: lodash.kebabcase: specifier: ^4.1.1 version: 4.1.1 - quick-lru: - specifier: ^4.0.1 - version: 4.0.1 react-transition-group: specifier: ^4.4.5 version: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -114,10 +111,10 @@ importers: version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/plugin-platform-alipay': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-weapp': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/react': specifier: 3.6.22 version: 3.6.22(react@18.3.1) @@ -495,7 +492,7 @@ importers: version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-alipay': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-h5': specifier: 3.6.22 version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) @@ -504,7 +501,7 @@ importers: version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-qq': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/plugin-platform-swan': specifier: 3.6.22 version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) @@ -513,7 +510,7 @@ importers: version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-weapp': specifier: 3.6.22 - version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41) + version: 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/react': specifier: 3.6.22 version: 3.6.22(react@18.3.1) @@ -15868,7 +15865,7 @@ snapshots: - supports-color - vue - '@tarojs/plugin-platform-alipay@3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1)': + '@tarojs/plugin-platform-alipay@3.6.22(@types/react@18.3.4)(postcss@8.4.41)': dependencies: '@tarojs/components': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/service': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) @@ -15880,7 +15877,6 @@ snapshots: - '@types/webpack' - '@types/webpack-dev-server' - postcss - - react - supports-color - vue @@ -15919,9 +15915,9 @@ snapshots: - supports-color - vue - '@tarojs/plugin-platform-qq@3.6.22(@types/react@18.3.4)(postcss@8.4.41)': + '@tarojs/plugin-platform-qq@3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1)': dependencies: - '@tarojs/plugin-platform-weapp': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) + '@tarojs/plugin-platform-weapp': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/service': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/shared': 3.6.22 transitivePeerDependencies: @@ -15931,6 +15927,7 @@ snapshots: - '@types/webpack' - '@types/webpack-dev-server' - postcss + - react - supports-color - vue @@ -15964,7 +15961,7 @@ snapshots: - supports-color - vue - '@tarojs/plugin-platform-weapp@3.6.22(@types/react@18.3.4)(postcss@8.4.41)': + '@tarojs/plugin-platform-weapp@3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1)': dependencies: '@tarojs/components': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/service': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) @@ -15976,6 +15973,7 @@ snapshots: - '@types/webpack' - '@types/webpack-dev-server' - postcss + - react - supports-color - vue @@ -16109,12 +16107,12 @@ snapshots: dependencies: '@parcel/css': 1.14.0 '@tarojs/helper': 3.6.22 - '@tarojs/plugin-platform-alipay': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) + '@tarojs/plugin-platform-alipay': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-jd': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) - '@tarojs/plugin-platform-qq': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) + '@tarojs/plugin-platform-qq': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/plugin-platform-swan': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) '@tarojs/plugin-platform-tt': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) - '@tarojs/plugin-platform-weapp': 3.6.22(@types/react@18.3.4)(postcss@8.4.41) + '@tarojs/plugin-platform-weapp': 3.6.22(@types/react@18.3.4)(postcss@8.4.41)(react@18.3.1) '@tarojs/runner-utils': 3.6.22 '@tarojs/runtime': 3.6.22 '@tarojs/shared': 3.6.22 @@ -26545,4 +26543,4 @@ snapshots: toposort: 2.0.2 type-fest: 2.19.0 - zwitch@2.0.4: {} + zwitch@2.0.4: {} \ No newline at end of file diff --git a/src/utils/get-rect-by-taro.ts b/src/utils/get-rect-by-taro.ts index 277a93cc6e..f18924349d 100644 --- a/src/utils/get-rect-by-taro.ts +++ b/src/utils/get-rect-by-taro.ts @@ -1,8 +1,8 @@ import { createSelectorQuery } from '@tarojs/taro' -import QuickLRU from 'quick-lru' +import MiniLru from '@/utils/lru' import { getRect, inBrowser } from './use-client-rect' -const lru = new QuickLRU({ maxSize: 10 }) +const lru = new MiniLru(10) export interface Rect { dataset: Record diff --git a/src/utils/lru.ts b/src/utils/lru.ts new file mode 100644 index 0000000000..55c0c577bd --- /dev/null +++ b/src/utils/lru.ts @@ -0,0 +1,33 @@ +export default class MiniLru { + private cache: Map + + private capacity: number + + constructor(capacity: number) { + this.cache = new Map() + this.capacity = capacity + } + + get(key: string): any | null { + if (this.cache.has(key)) { + const value = this.cache.get(key) + this.cache.delete(key) + this.cache.set(key, value) + return value + } + return null + } + + set(key: string, value: any): void { + if (this.cache.has(key)) { + this.cache.delete(key) + } else if (this.cache.size >= this.capacity) { + this.cache.delete(this.cache.keys().next().value as string) + } + this.cache.set(key, value) + } + + has(key: string): boolean { + return this.cache.has(key) + } +} From 91e4a784b936df62bfb874e3c48115d57910bdeb Mon Sep 17 00:00:00 2001 From: xueyueben <522109452@qq.com> Date: Mon, 9 Dec 2024 14:02:39 +0800 Subject: [PATCH 4/5] =?UTF-8?q?feat:=20=20=E5=A2=9E=E5=8A=A0capacity=20?= =?UTF-8?q?=E5=8F=82=E6=95=B0=E5=80=BC=E6=A0=A1=E9=AA=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pnpm-lock.yaml | 2 -- src/utils/lru.ts | 13 ++++++++----- 2 files changed, 8 insertions(+), 7 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 396160638e..cfcb2a06ef 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -26542,5 +26542,3 @@ snapshots: tiny-case: 1.0.3 toposort: 2.0.2 type-fest: 2.19.0 - - zwitch@2.0.4: {} \ No newline at end of file diff --git a/src/utils/lru.ts b/src/utils/lru.ts index 55c0c577bd..1d9cca3381 100644 --- a/src/utils/lru.ts +++ b/src/utils/lru.ts @@ -1,14 +1,17 @@ export default class MiniLru { - private cache: Map + private cache: Map private capacity: number constructor(capacity: number) { + if (capacity <= 0) { + throw new Error('Cache capacity must be a positive number') + } this.cache = new Map() this.capacity = capacity } - get(key: string): any | null { + get(key: any): any | null { if (this.cache.has(key)) { const value = this.cache.get(key) this.cache.delete(key) @@ -18,16 +21,16 @@ export default class MiniLru { return null } - set(key: string, value: any): void { + set(key: any, value: any): void { if (this.cache.has(key)) { this.cache.delete(key) } else if (this.cache.size >= this.capacity) { - this.cache.delete(this.cache.keys().next().value as string) + this.cache.delete(this.cache.keys().next().value) } this.cache.set(key, value) } - has(key: string): boolean { + has(key: any): boolean { return this.cache.has(key) } } From 38ec6db3813a123cc17a7bd69a9313f08ebfaeb0 Mon Sep 17 00:00:00 2001 From: xueyueben <522109452@qq.com> Date: Mon, 9 Dec 2024 14:25:08 +0800 Subject: [PATCH 5/5] =?UTF-8?q?feat:=20lock=20=E6=96=87=E4=BB=B6=E8=BF=98?= =?UTF-8?q?=E5=8E=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pnpm-lock.yaml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index cfcb2a06ef..d47390c252 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -26542,3 +26542,5 @@ snapshots: tiny-case: 1.0.3 toposort: 2.0.2 type-fest: 2.19.0 + + zwitch@2.0.4: {}