From 5ca5c245a57b2f10cffb5f5d6a0be3787813eb7a Mon Sep 17 00:00:00 2001 From: Taylous Date: Mon, 3 Mar 2025 20:25:13 +0900 Subject: [PATCH 1/8] add missing parameter(sync) --- docs/api/virtualizer.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/api/virtualizer.md b/docs/api/virtualizer.md index e00ed8bf..f930ff6f 100644 --- a/docs/api/virtualizer.md +++ b/docs/api/virtualizer.md @@ -67,7 +67,7 @@ The initial `Rect` of the scrollElement. This is mostly useful if you need to ru ### `onChange` ```tsx -onChange?: (instance: Virtualizer) => void +onChange?: (instance: Virtualizer, sync: boolean) => void ``` A callback function that fires when the virtualizer's internal state changes. It's passed the virtualizer instance. From 070d63d4324037d239046fe5c8a42fffd8f758d0 Mon Sep 17 00:00:00 2001 From: Taylous Date: Sun, 9 Mar 2025 22:34:21 +0900 Subject: [PATCH 2/8] add documentation for sync parameter of the onChange --- docs/api/virtualizer.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/docs/api/virtualizer.md b/docs/api/virtualizer.md index f930ff6f..09f91f4c 100644 --- a/docs/api/virtualizer.md +++ b/docs/api/virtualizer.md @@ -70,7 +70,9 @@ The initial `Rect` of the scrollElement. This is mostly useful if you need to ru onChange?: (instance: Virtualizer, sync: boolean) => void ``` -A callback function that fires when the virtualizer's internal state changes. It's passed the virtualizer instance. +A callback function that fires when the virtualizer's internal state changes. It's passed the virtualizer instance and the sync parameter. + +The sync parameter indicates whether scrolling is currently in progress. It is `true` when scrolling is ongoing, and `false` when scrolling has stopped or other actions (such as resizing) are being performed. ### `overscan` From 387fa84e8566d71a1aa6b7f51e905ab853ed9ecb Mon Sep 17 00:00:00 2001 From: Taylous Date: Sun, 6 Apr 2025 23:46:24 +0900 Subject: [PATCH 3/8] extract dependency array check logic into a function --- packages/virtual-core/src/utils.ts | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/packages/virtual-core/src/utils.ts b/packages/virtual-core/src/utils.ts index 72259ded..5b605ac7 100644 --- a/packages/virtual-core/src/utils.ts +++ b/packages/virtual-core/src/utils.ts @@ -1,6 +1,19 @@ export type NoInfer = [A][A extends any ? 0 : never] export type PartialKeys = Omit & Partial> +/** + * checks whether the dependencies array has changed by comparing it with the previous one. + * + * @param newDeps new array of dependencies + * @param deps previous array of dependencies + * @returns `true` if the length of the arrays differ or if at least one dependency has changed; otherwise, `false` + */ +const isDepsChanged = >( + newDeps: Array, + deps: TDeps, +): boolean => + newDeps.length !== deps.length || + newDeps.some((dep, index: number) => deps[index] !== dep) export function memo, TResult>( getDeps: () => [...TDeps], From 324ec6a8bdaffd73add68539b4c2780675721376 Mon Sep 17 00:00:00 2001 From: Taylous Date: Sun, 6 Apr 2025 23:49:47 +0900 Subject: [PATCH 4/8] declare debugging mode activation condition as a variable --- packages/virtual-core/src/utils.ts | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/packages/virtual-core/src/utils.ts b/packages/virtual-core/src/utils.ts index 5b605ac7..3fa83bca 100644 --- a/packages/virtual-core/src/utils.ts +++ b/packages/virtual-core/src/utils.ts @@ -28,24 +28,28 @@ export function memo, TResult>( let deps = opts.initialDeps ?? [] let result: TResult | undefined + const enabledDebug = Boolean(opts.key && opts.debug?.()) + return (): TResult => { let depTime: number - if (opts.key && opts.debug?.()) depTime = Date.now() - const newDeps = getDeps() + if (enabledDebug) { + depTime = Date.now() + } - const depsChanged = - newDeps.length !== deps.length || - newDeps.some((dep: any, index: number) => deps[index] !== dep) + const newDeps = getDeps() - if (!depsChanged) { + if (!isDepsChanged(newDeps, deps)) { return result! } deps = newDeps let resultTime: number - if (opts.key && opts.debug?.()) resultTime = Date.now() + + if (enabledDebug) { + resultTime = Date.now() + } result = fn(...newDeps) From fb8d302d10319a0b65dfc4ff3d655a69cd49589e Mon Sep 17 00:00:00 2001 From: Taylous Date: Sun, 6 Apr 2025 23:50:38 +0900 Subject: [PATCH 5/8] refactor pad function to use String.padStart method --- packages/virtual-core/src/utils.ts | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/packages/virtual-core/src/utils.ts b/packages/virtual-core/src/utils.ts index 3fa83bca..108cfa8b 100644 --- a/packages/virtual-core/src/utils.ts +++ b/packages/virtual-core/src/utils.ts @@ -58,16 +58,8 @@ export function memo, TResult>( const resultEndTime = Math.round((Date.now() - resultTime!) * 100) / 100 const resultFpsPercentage = resultEndTime / 16 - const pad = (str: number | string, num: number) => { - str = String(str) - while (str.length < num) { - str = ' ' + str - } - return str - } - console.info( - `%c⏱ ${pad(resultEndTime, 5)} /${pad(depEndTime, 5)} ms`, + `%c⏱ ${String(resultEndTime).padStart(5, ' ')}/${String(depEndTime).padStart(5, ' ')} ms`, ` font-size: .6rem; font-weight: bold; From 9633f9b509d7752989a1770a1a64a267bff497e3 Mon Sep 17 00:00:00 2001 From: Taylous Date: Mon, 7 Apr 2025 00:31:04 +0900 Subject: [PATCH 6/8] change enabledDebug position --- packages/virtual-core/src/utils.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/virtual-core/src/utils.ts b/packages/virtual-core/src/utils.ts index 8847dfc9..b38324ef 100644 --- a/packages/virtual-core/src/utils.ts +++ b/packages/virtual-core/src/utils.ts @@ -28,9 +28,8 @@ export function memo, TResult>( let deps = opts.initialDeps ?? [] let result: TResult | undefined - const enabledDebug = Boolean(opts.key && opts.debug?.()) - function memoizedFunction(): TResult { + const enabledDebug = Boolean(opts.key && opts.debug?.()) let depTime: number if (enabledDebug) { From 307fbb26b49c2b0d2351dad4c86d6575683ea132 Mon Sep 17 00:00:00 2001 From: Taylous Date: Mon, 7 Apr 2025 00:43:18 +0900 Subject: [PATCH 7/8] reflect missing variable reference --- packages/virtual-core/src/utils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/virtual-core/src/utils.ts b/packages/virtual-core/src/utils.ts index b38324ef..cfada5ba 100644 --- a/packages/virtual-core/src/utils.ts +++ b/packages/virtual-core/src/utils.ts @@ -52,7 +52,7 @@ export function memo, TResult>( result = fn(...newDeps) - if (opts.key && opts.debug?.()) { + if (enabledDebug) { const depEndTime = Math.round((Date.now() - depTime!) * 100) / 100 const resultEndTime = Math.round((Date.now() - resultTime!) * 100) / 100 const resultFpsPercentage = resultEndTime / 16 From abcda379f515d2a0921bb2b1b2bf2e475607d564 Mon Sep 17 00:00:00 2001 From: Taylous Date: Mon, 7 Apr 2025 01:03:14 +0900 Subject: [PATCH 8/8] relocation resultTime variable --- packages/virtual-core/src/utils.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/virtual-core/src/utils.ts b/packages/virtual-core/src/utils.ts index cfada5ba..c9950e81 100644 --- a/packages/virtual-core/src/utils.ts +++ b/packages/virtual-core/src/utils.ts @@ -30,6 +30,7 @@ export function memo, TResult>( function memoizedFunction(): TResult { const enabledDebug = Boolean(opts.key && opts.debug?.()) + let resultTime: number let depTime: number if (enabledDebug) { @@ -44,8 +45,6 @@ export function memo, TResult>( deps = newDeps - let resultTime: number - if (enabledDebug) { resultTime = Date.now() }