diff --git a/app/vmui/packages/vmui/src/pages/ExploreLogs/ExploreLogs.tsx b/app/vmui/packages/vmui/src/pages/ExploreLogs/ExploreLogs.tsx
index f7d294773..b40a3d528 100644
--- a/app/vmui/packages/vmui/src/pages/ExploreLogs/ExploreLogs.tsx
+++ b/app/vmui/packages/vmui/src/pages/ExploreLogs/ExploreLogs.tsx
@@ -48,9 +48,8 @@ const ExploreLogs: FC = () => {
 
     const newPeriod = getPeriod();
     setPeriod(newPeriod);
-    fetchLogs(newPeriod).then(() => {
-      fetchLogHits(newPeriod);
-    }).catch(e => e);
+    fetchLogs(newPeriod);
+    fetchLogHits(newPeriod);
 
     setSearchParamsFromKeys( {
       query,
@@ -95,9 +94,10 @@ const ExploreLogs: FC = () => {
       {error && <Alert variant="error">{error}</Alert>}
       {!error && (
         <ExploreLogsBarChart
+          {...dataLogHits}
           query={query}
           period={period}
-          {...dataLogHits}
+          isLoading={isLoading ? false : dataLogHits.isLoading}
         />
       )}
       <ExploreLogsBody
diff --git a/app/vmui/packages/vmui/src/pages/ExploreLogs/ExploreLogsBarChart/ExploreLogsBarChart.tsx b/app/vmui/packages/vmui/src/pages/ExploreLogs/ExploreLogsBarChart/ExploreLogsBarChart.tsx
index 7609095ea..c95136348 100644
--- a/app/vmui/packages/vmui/src/pages/ExploreLogs/ExploreLogsBarChart/ExploreLogsBarChart.tsx
+++ b/app/vmui/packages/vmui/src/pages/ExploreLogs/ExploreLogsBarChart/ExploreLogsBarChart.tsx
@@ -9,6 +9,7 @@ import { AlignedData } from "uplot";
 import BarHitsChart from "../../../components/Chart/BarHitsChart/BarHitsChart";
 import Alert from "../../../components/Main/Alert/Alert";
 import { TimeParams } from "../../../types";
+import Spinner from "../../../components/Main/Spinner/Spinner";
 
 interface Props {
   query: string;
@@ -18,7 +19,7 @@ interface Props {
   isLoading: boolean;
 }
 
-const ExploreLogsBarChart: FC<Props> = ({ logHits, period, error }) => {
+const ExploreLogsBarChart: FC<Props> = ({ logHits, period, error, isLoading }) => {
   const { isMobile } = useDeviceDetect();
   const timeDispatch = useTimeDispatch();
 
@@ -56,6 +57,7 @@ const ExploreLogsBarChart: FC<Props> = ({ logHits, period, error }) => {
         "vm-block_mobile": isMobile,
       })}
     >
+      {isLoading && <Spinner containerStyles={{ position: "absolute" }}/>}
       {!error && noDataMessage && (
         <div className="vm-explore-logs-chart__empty">
           <Alert variant="info">{noDataMessage}</Alert>
diff --git a/app/vmui/packages/vmui/src/pages/ExploreLogs/hooks/useFetchLogHits.ts b/app/vmui/packages/vmui/src/pages/ExploreLogs/hooks/useFetchLogHits.ts
index 42eb0cefa..658ff3bc3 100644
--- a/app/vmui/packages/vmui/src/pages/ExploreLogs/hooks/useFetchLogHits.ts
+++ b/app/vmui/packages/vmui/src/pages/ExploreLogs/hooks/useFetchLogHits.ts
@@ -7,7 +7,7 @@ import { LOGS_BARS_VIEW } from "../../../constants/logs";
 
 export const useFetchLogHits = (server: string, query: string) => {
   const [logHits, setLogHits] = useState<LogHits[]>([]);
-  const [isLoading, setIsLoading] = useState(false);
+  const [isLoading, setIsLoading] = useState<{[key: number]: boolean;}>([]);
   const [error, setError] = useState<ErrorTypes | string>();
   const abortControllerRef = useRef(new AbortController());
 
@@ -36,7 +36,8 @@ export const useFetchLogHits = (server: string, query: string) => {
     abortControllerRef.current = new AbortController();
     const { signal } = abortControllerRef.current;
 
-    setIsLoading(true);
+    const id = Date.now();
+    setIsLoading(prev => ({ ...prev, [id]: true }));
     setError(undefined);
 
     try {
@@ -47,8 +48,8 @@ export const useFetchLogHits = (server: string, query: string) => {
         const text = await response.text();
         setError(text);
         setLogHits([]);
-        setIsLoading(false);
-        return Promise.reject(new Error(text));
+        setIsLoading(prev => ({ ...prev, [id]: false }));
+        return;
       }
 
       const data = await response.json();
@@ -56,25 +57,22 @@ export const useFetchLogHits = (server: string, query: string) => {
       if (!hits) {
         const error = "Error: No 'hits' field in response";
         setError(error);
-        return Promise.reject(new Error(error));
       }
 
-      setLogHits(hits);
+      setLogHits(!hits ? [] : hits);
     } catch (e) {
       if (e instanceof Error && e.name !== "AbortError") {
         setError(String(e));
         console.error(e);
         setLogHits([]);
       }
-      return Promise.reject(e);
-    } finally {
-      setIsLoading(false);
     }
+    setIsLoading(prev => ({ ...prev, [id]: false }));
   }, [url, query]);
 
   return {
     logHits,
-    isLoading,
+    isLoading: Object.values(isLoading).some(s => s),
     error,
     fetchLogHits,
   };
diff --git a/app/vmui/packages/vmui/src/pages/ExploreLogs/hooks/useFetchLogs.ts b/app/vmui/packages/vmui/src/pages/ExploreLogs/hooks/useFetchLogs.ts
index f91314991..8f8332c27 100644
--- a/app/vmui/packages/vmui/src/pages/ExploreLogs/hooks/useFetchLogs.ts
+++ b/app/vmui/packages/vmui/src/pages/ExploreLogs/hooks/useFetchLogs.ts
@@ -6,7 +6,7 @@ import dayjs from "dayjs";
 
 export const useFetchLogs = (server: string, query: string, limit: number) => {
   const [logs, setLogs] = useState<Logs[]>([]);
-  const [isLoading, setIsLoading] = useState(false);
+  const [isLoading, setIsLoading] = useState<{[key: number]: boolean;}>([]);
   const [error, setError] = useState<ErrorTypes | string>();
   const abortControllerRef = useRef(new AbortController());
 
@@ -39,7 +39,8 @@ export const useFetchLogs = (server: string, query: string, limit: number) => {
     abortControllerRef.current = new AbortController();
     const { signal } = abortControllerRef.current;
 
-    setIsLoading(true);
+    const id = Date.now();
+    setIsLoading(prev => ({ ...prev, [id]: true }));
     setError(undefined);
 
     try {
@@ -50,8 +51,8 @@ export const useFetchLogs = (server: string, query: string, limit: number) => {
       if (!response.ok || !response.body) {
         setError(text);
         setLogs([]);
-        setIsLoading(false);
-        return Promise.reject(new Error(text));
+        setIsLoading(prev => ({ ...prev, [id]: false }));
+        return;
       }
 
       const lines = text.split("\n").filter(line => line).slice(0, limit);
@@ -63,16 +64,13 @@ export const useFetchLogs = (server: string, query: string, limit: number) => {
         console.error(e);
         setLogs([]);
       }
-      return Promise.reject(e);
-    } finally {
-      setIsLoading(false);
     }
-    setIsLoading(false);
+    setIsLoading(prev => ({ ...prev, [id]: false }));
   }, [url, query, limit]);
 
   return {
     logs,
-    isLoading,
+    isLoading: Object.values(isLoading).some(s => s),
     error,
     fetchLogs,
   };
diff --git a/docs/VictoriaLogs/CHANGELOG.md b/docs/VictoriaLogs/CHANGELOG.md
index d5f7c3132..c50a36bd5 100644
--- a/docs/VictoriaLogs/CHANGELOG.md
+++ b/docs/VictoriaLogs/CHANGELOG.md
@@ -19,6 +19,8 @@ according to [these docs](https://docs.victoriametrics.com/victorialogs/quicksta
 
 ## tip
 
+* FEATURE: [web UI](https://docs.victoriametrics.com/victorialogs/querying/#web-ui): show a spinner on top of bar chart until user's request is finished. See [this issue](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/6558).
+
 ## [v0.27.1](https://github.com/VictoriaMetrics/VictoriaMetrics/releases/tag/v0.27.1-victorialogs)
 
 Released at 2024-07-05