Skip to content

Commit 0551ee4

Browse files
AVGVSTVS96claude
andcommitted
refactor: simplify useStableOptions to return value directly
Remove revision counter indirection - the stable reference itself changes only when content changes, so it works directly in deps arrays. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
1 parent ab8d3ce commit 0551ee4

File tree

2 files changed

+10
-8
lines changed

2 files changed

+10
-8
lines changed

package/src/lib/hook.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -47,9 +47,9 @@ export const useShikiHighlighter = <F extends OutputFormat = 'react'>(
4747
createFallback(format, code)
4848
);
4949

50-
const [stableLang, langRev] = useStableOptions(lang);
51-
const [stableTheme, themeRev] = useStableOptions(themeInput);
52-
const [stableOpts, optsRev] = useStableOptions(options);
50+
const stableLang = useStableOptions(lang);
51+
const stableTheme = useStableOptions(themeInput);
52+
const stableOpts = useStableOptions(options);
5353

5454
const { languageId, langsToLoad } = useMemo(
5555
() =>

package/src/lib/utils.ts

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,18 @@ import { dequal } from 'dequal';
33

44
import type { TimeoutState } from './types';
55

6-
export const useStableOptions = <T>(value: T) => {
6+
/**
7+
* Returns a stable reference that only changes when content changes (deep equality).
8+
* Prevents unnecessary re-renders when objects are recreated with identical content.
9+
*/
10+
export const useStableOptions = <T>(value: T): T => {
711
const ref = useRef(value);
8-
const revision = useRef(0);
912

1013
if (typeof value !== 'object' || value === null) {
1114
if (value !== ref.current) {
1215
ref.current = value;
13-
revision.current += 1;
1416
}
15-
return [value, revision.current] as const;
17+
return value;
1618
}
1719

1820
if (value !== ref.current) {
@@ -22,7 +24,7 @@ export const useStableOptions = <T>(value: T) => {
2224
}
2325
}
2426

25-
return [ref.current, revision.current] as const;
27+
return ref.current;
2628
};
2729

2830
export const throttleHighlighting = (

0 commit comments

Comments
 (0)