muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 12:56:41 +07:00
Code Packages Activity Actions

render optimizations for slider

Browse source
This commit is contained in:
Fedor Katurov 2019-11-07 17:10:57 +07:00
parent 0a0abba7f9
commit a1227b658b
1 changed files with 9 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/components/node/NodeImageSlideBlock/index.tsx
View file

@ -8,6 +8,7 @@ import { NODE_SETTINGS } from '~/redux/node/constants';
import { getURL } from '~/utils/dom';
import { PRESETS } from '~/constants/urls';
import { LoaderCircle } from '~/components/input/LoaderCircle';
import { throttle } from 'throttle-debounce';
interface IProps {
is_loading: boolean;
@ -33,6 +34,8 @@ const NodeImageSlideBlock: FC<IProps> = ({ node, is_loading, updateLayout }) =>
const slide = useRef<HTMLDivElement>();
const wrap = useRef<HTMLDivElement>();
const setHeightThrottled = useCallback(throttle(100, setHeight), [setHeight]);
const images = useMemo(
() =>
(node && node.files && node.files.filter(({ type }) => type === UPLOAD_TYPES.IMAGE)) || [],
@ -89,8 +92,12 @@ const NodeImageSlideBlock: FC<IProps> = ({ node, is_loading, updateLayout }) =>
if (current !== Math.round(selected)) setCurrent(Math.round(selected));
if (!is_dragging) {
setHeight(now);
}, [wrap, offset, heights, max_height, images, is_loading]);
} else {
setHeightThrottled(now);
}
}, [is_dragging, wrap, offset, heights, max_height, images, is_loading]);
const onDrag = useCallback(
event => {