github-mirrors/VictoriaMetrics
1
0
Fork 0
mirror of https://github.com/VictoriaMetrics/VictoriaMetrics.git synced 2024-11-21 14:44:00 +00:00
Code Issues Projects Releases Packages Wiki Activity

vmui: optimize data fetching (#2584)

Browse source
This commit is contained in:
Yury Molodov 2022-05-17 14:13:45 +03:00 committed by GitHub
parent fcf4190d0b
commit c97c1fc1bf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 19 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
app/vmui/packages/vmui/src/hooks/useFetchQuery.ts
View file

@ -8,6 +8,8 @@ import {getAppModeEnable, getAppModeParams} from "../utils/app-mode";
import throttle from "lodash.throttle";
import {DisplayType} from "../components/CustomPanel/Configurator/DisplayTypeSwitch";
import {CustomStep} from "../state/graph/reducer";
import usePrevious from "./usePrevious";
import {arrayEquals} from "../utils/array";
interface FetchQueryParams {
predefinedQuery?: string[]
@ -48,7 +50,6 @@ export const useFetchQuery = ({predefinedQuery, visible, display, customStep}: F
const controller = new AbortController();
setFetchQueue([...fetchQueue, controller]);
setIsLoading(true);
try {
const responses = await Promise.all(fetchUrl.map(url => fetch(url, {signal: controller.signal})));
const tempData = [];
@ -114,12 +115,14 @@ export const useFetchQuery = ({predefinedQuery, visible, display, customStep}: F
},
[serverUrl, period, displayType, customStep]);
const prevFetchUrl = usePrevious(fetchUrl);
useEffect(() => {
fetchOptions();
}, [serverUrl]);
useEffect(() => {
if (!visible) return;
if (!visible || (fetchUrl && prevFetchUrl && arrayEquals(fetchUrl, prevFetchUrl))) return;
throttledFetchData(fetchUrl, fetchQueue, (display || displayType));
}, [fetchUrl, visible]);

10
app/vmui/packages/vmui/src/hooks/usePrevious.ts Normal file
View file

@ -0,0 +1,10 @@
import { useRef, useEffect } from "react";
export default (value: any) => {
const ref = useRef();
useEffect(() => {
ref.current = value;
}, [value]);
return ref.current;
};

4
app/vmui/packages/vmui/src/utils/array.ts Normal file
View file

@ -0,0 +1,4 @@
export const arrayEquals = (a: (string|number)[], b: (string|number)[]) => {
return a.length === b.length && a.every((val, index) => val === b[index]);
};