vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-05-07 04:20:12 +02:00
Code Issues Packages Projects Releases Wiki Activity

improve performance on page ScrollArea by throttling scroll callback

Browse Source
This commit is contained in:
jeffvli
2025-12-27 15:48:29 -08:00
parent b573999d33
commit 9c59a38f7a
1 changed files with 21 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/components/native-scroll-area/native-scroll-area.tsx
+21 -24
View File
@@ -6,6 +6,7 @@ import styles from './native-scroll-area.module.css';
import { PageHeader, PageHeaderProps } from '/@/renderer/components/page-header/page-header';
import { useWindowSettings } from '/@/renderer/store/settings.store';
import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
import { useThrottledCallback } from '/@/shared/hooks/use-throttled-callback';
import { Platform } from '/@/shared/types/types';
interface NativeScrollAreaProps {
@@ -26,35 +27,31 @@ const BaseNativeScrollArea = forwardRef(
const { windowBarStyle } = useWindowSettings();
const containerRef = useRef<HTMLDivElement | null>(null);
const scrollHandlerRef = useRef<null | number>(null);
const scrollHandler = useThrottledCallback((e: Event) => {
if (noHeader || !pageHeaderProps) {
return;
}
const scrollElement = e?.target as HTMLDivElement;
if (!scrollElement || !containerRef.current) {
return;
}
const offset = pageHeaderProps.offset || 0;
const scrollTop = scrollElement.scrollTop;
if (scrollTop > offset) {
containerRef.current.setAttribute('data-scrolled', 'true');
} else {
containerRef.current.setAttribute('data-scrolled', 'false');
}
}, 100);
const [initialize] = useOverlayScrollbars({
defer: false,
events: {
scroll: (_instance, e) => {
if (scrollHandlerRef.current) {
cancelAnimationFrame(scrollHandlerRef.current);
}
scrollHandlerRef.current = requestAnimationFrame(() => {
if (noHeader || !pageHeaderProps) {
return;
}
const scrollElement = e?.target as HTMLDivElement;
if (!scrollElement || !containerRef.current) {
return;
}
const offset = pageHeaderProps.offset || 0;
const scrollTop = scrollElement.scrollTop;
if (scrollTop > offset) {
containerRef.current.setAttribute('data-scrolled', 'true');
} else {
containerRef.current.setAttribute('data-scrolled', 'false');
}
});
scrollHandler(e);
},
},
options: {