diff --git a/web/app/_helpers/atoms/SystemBar.atom.ts b/web/app/_helpers/atoms/SystemBar.atom.ts
index fc1b777d4..6bec4471e 100644
--- a/web/app/_helpers/atoms/SystemBar.atom.ts
+++ b/web/app/_helpers/atoms/SystemBar.atom.ts
@@ -2,6 +2,6 @@ import { atom } from "jotai";
 
 export const systemBarVisibilityAtom = atom<boolean>(true);
 
-export const getSystemBarVisibilityAtom = atom((get) =>
-  get(systemBarVisibilityAtom)
-);
+export const getSystemBarVisibilityAtom = atom((get) => get(systemBarVisibilityAtom));
+
+export const totalRamAtom = atom<number>(0);
diff --git a/web/app/_hooks/useGetMostSuitableModelVersion.ts b/web/app/_hooks/useGetMostSuitableModelVersion.ts
index 455298a4d..8f8fc40e8 100644
--- a/web/app/_hooks/useGetMostSuitableModelVersion.ts
+++ b/web/app/_hooks/useGetMostSuitableModelVersion.ts
@@ -1,17 +1,13 @@
-import { executeSerial } from "@/_services/pluginService";
-import { SystemMonitoringService } from "@janhq/core";
 import { ModelVersion } from "@/_models/ModelVersion";
 import { useState } from "react";
+import { useAtomValue } from "jotai";
+import { totalRamAtom } from "@/_helpers/atoms/SystemBar.atom";
 
 export default function useGetMostSuitableModelVersion() {
   const [suitableModel, setSuitableModel] = useState<ModelVersion | undefined>();
+  const totalRam = useAtomValue(totalRamAtom);
 
   const getMostSuitableModelVersion = async (modelVersions: ModelVersion[]) => {
-    const resourceInfo = await executeSerial(
-      SystemMonitoringService.GetResourcesInfo
-    );
-    const totalRam = resourceInfo.mem.total;
-
     // find the model version with the highest required RAM that is still below the user's RAM by 80%
     const modelVersion = modelVersions.reduce((prev, current) => {
       if (current.maxRamRequired > prev.maxRamRequired) {
diff --git a/web/app/_hooks/useGetPerformanceTag.ts b/web/app/_hooks/useGetPerformanceTag.ts
index fedf1141d..822841263 100644
--- a/web/app/_hooks/useGetPerformanceTag.ts
+++ b/web/app/_hooks/useGetPerformanceTag.ts
@@ -1,8 +1,8 @@
-import { executeSerial } from "../../../electron/core/plugin-manager/execution/extension-manager";
-import { SystemMonitoringService } from "@janhq/core";
 import { useState } from "react";
 import { ModelVersion } from "@/_models/ModelVersion";
 import { ModelPerformance, TagType } from "@/_components/SimpleTag/TagType";
+import { useAtomValue } from "jotai";
+import { totalRamAtom } from "@/_helpers/atoms/SystemBar.atom";
 
 // Recommendation:
 // `Recommended (green)`: "Max RAM required" is 80% of users max  RAM.
@@ -11,12 +11,9 @@ import { ModelPerformance, TagType } from "@/_components/SimpleTag/TagType";
 
 export default function useGetPerformanceTag() {
   const [performanceTag, setPerformanceTag] = useState<TagType | undefined>();
+  const totalRam = useAtomValue(totalRamAtom);
 
   const getPerformanceForModel = async (modelVersion: ModelVersion) => {
-    const resourceInfo = await executeSerial(
-      SystemMonitoringService.GetResourcesInfo
-    );
-    const totalRam = resourceInfo.mem.total;
     const requiredRam = modelVersion.maxRamRequired;
     setPerformanceTag(calculateRamPerformance(requiredRam, totalRam));
   };
@@ -37,10 +34,7 @@ export default function useGetPerformanceTag() {
   return { performanceTag, title, getPerformanceForModel };
 }
 
-const calculateRamPerformance = (
-  requiredRamAmt: number,
-  totalRamAmt: number
-) => {
+const calculateRamPerformance = (requiredRamAmt: number, totalRamAmt: number) => {
   const percentage = requiredRamAmt / totalRamAmt;
 
   if (percentage < 0.8) {
diff --git a/web/app/_hooks/useGetSystemResources.ts b/web/app/_hooks/useGetSystemResources.ts
index 1160744e2..47733e14e 100644
--- a/web/app/_hooks/useGetSystemResources.ts
+++ b/web/app/_hooks/useGetSystemResources.ts
@@ -1,20 +1,19 @@
 import { useEffect, useState } from "react";
 import { executeSerial } from "../../../electron/core/plugin-manager/execution/extension-manager";
 import { SystemMonitoringService } from "@janhq/core";
-
+import { useSetAtom } from "jotai";
+import { totalRamAtom } from "@/_helpers/atoms/SystemBar.atom";
 export default function useGetSystemResources() {
   const [ram, setRam] = useState<number>(0);
   const [cpu, setCPU] = useState<number>(0);
+  const setTotalRam = useSetAtom(totalRamAtom);
 
   const getSystemResources = async () => {
-    const resourceInfor = await executeSerial(
-      SystemMonitoringService.GetResourcesInfo
-    );
-    const currentLoadInfor = await executeSerial(
-      SystemMonitoringService.GetCurrentLoad
-    );
-    const ram =
-      (resourceInfor?.mem?.active ?? 0) / (resourceInfor?.mem?.total ?? 1);
+    const resourceInfor = await executeSerial(SystemMonitoringService.GetResourcesInfo);
+    const currentLoadInfor = await executeSerial(SystemMonitoringService.GetCurrentLoad);
+    const ram = (resourceInfor?.mem?.active ?? 0) / (resourceInfor?.mem?.total ?? 1);
+    if (resourceInfor?.mem?.total) setTotalRam(resourceInfor.mem.total);
+
     setRam(Math.round(ram * 100));
     setCPU(Math.round(currentLoadInfor?.currentLoad ?? 0));
   };
@@ -25,7 +24,7 @@ export default function useGetSystemResources() {
     // Fetch interval - every 3s
     const intervalId = setInterval(() => {
       getSystemResources();
-    }, 3000);
+    }, 5000);
 
     // clean up
     return () => clearInterval(intervalId);