Skip to content

perf: memoize options/thumbImage and stop mutating on inverted#804

Open
pataar wants to merge 1 commit intocallstack:mainfrom
pataar:perf/slider-marginal-fixes
Open

perf: memoize options/thumbImage and stop mutating on inverted#804
pataar wants to merge 1 commit intocallstack:mainfrom
pataar:perf/slider-marginal-fixes

Conversation

@pataar
Copy link
Copy Markdown

@pataar pataar commented May 5, 2026

Summary:

Three marginal-but-easy perf/correctness fixes in the JS layer. No public API changes, no behaviour changes for end users.

  1. Memoize options in Slider.tsx — the Array.from(...) call rebuilt the array on every render. Wrapping it in useMemo also restores the effectiveness of StepsIndicator's existing useCallback/useMemo, which currently bust every render because the parent hands them a freshly allocated array.
  2. Memoize the resolved thumbImage in Slider.tsxImage.resolveAssetSource(...) ran on every render. Memoized on props.thumbImage/props.StepMarker.
  3. Stop mutating options in StepsIndicator.tsxoptions.reverse() mutates the array passed in from the parent in place. Switched to options.slice().reverse(). Mostly a correctness fix; with the parent now memoizing the array, the in-place reverse would also have re-reversed the same array each render.

Test Plan:

  • npm test from package/ → 4 suites, 16 tests passing.
  • npm run lint from package/ → no new warnings introduced.
  • Recommended smoke test in the example app: scenarios with inverted, with non-zero step, and with thumbImage set, to confirm no visual regression.

- Slider: memoize the `options` array and the resolved `thumbImage` so they're stable across renders, which keeps StepsIndicator's existing `useCallback` memos effective.
- StepsIndicator: use `options.slice().reverse()` instead of `options.reverse()` to avoid mutating the parent's array in place.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant