diff --git a/apps/dashboard/src/components/overview/overview-latest-events/overview-latest-events.tsx b/apps/dashboard/src/components/overview/overview-latest-events/overview-latest-events.tsx
index 9e21200d..4594abed 100644
--- a/apps/dashboard/src/components/overview/overview-latest-events/overview-latest-events.tsx
+++ b/apps/dashboard/src/components/overview/overview-latest-events/overview-latest-events.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { ChartSwitch } from '@/components/report/chart';
+import { LazyChart } from '@/components/report/chart/LazyChart';
 import { useEventQueryFilters } from '@/hooks/useEventQueryFilters';
 import { cn } from '@/utils/cn';
 
@@ -120,7 +120,7 @@ export default function OverviewLatestEvents({
           </WidgetButtons>
         </WidgetHead>
         <WidgetBody>
-          <ChartSwitch hideID {...widget.chart} previous={false} />
+          <LazyChart hideID {...widget.chart} previous={false} />
         </WidgetBody>
       </Widget>
     </>
diff --git a/apps/dashboard/src/components/overview/overview-top-devices.tsx b/apps/dashboard/src/components/overview/overview-top-devices.tsx
index f89bc21f..4427f2ef 100644
--- a/apps/dashboard/src/components/overview/overview-top-devices.tsx
+++ b/apps/dashboard/src/components/overview/overview-top-devices.tsx
@@ -1,12 +1,12 @@
 'use client';
 
 import { useState } from 'react';
-import { ChartSwitch } from '@/components/report/chart';
 import { useEventQueryFilters } from '@/hooks/useEventQueryFilters';
 import { cn } from '@/utils/cn';
 
 import type { IChartType } from '@openpanel/validation';
 
+import { LazyChart } from '../report/chart/LazyChart';
 import { Widget, WidgetBody } from '../widget';
 import { OverviewChartToggle } from './overview-chart-toggle';
 import { WidgetButtons, WidgetHead } from './overview-widget';
@@ -198,7 +198,7 @@ export default function OverviewTopDevices({
           </WidgetButtons>
         </WidgetHead>
         <WidgetBody>
-          <ChartSwitch
+          <LazyChart
             hideID
             {...widget.chart}
             previous={false}
diff --git a/apps/dashboard/src/components/overview/overview-top-events/overview-top-events.tsx b/apps/dashboard/src/components/overview/overview-top-events/overview-top-events.tsx
index e5076eae..6971b340 100644
--- a/apps/dashboard/src/components/overview/overview-top-events/overview-top-events.tsx
+++ b/apps/dashboard/src/components/overview/overview-top-events/overview-top-events.tsx
@@ -2,6 +2,7 @@
 
 import { useState } from 'react';
 import { ChartSwitch } from '@/components/report/chart';
+import { LazyChart } from '@/components/report/chart/LazyChart';
 import { Button } from '@/components/ui/button';
 import { useEventQueryFilters } from '@/hooks/useEventQueryFilters';
 import { cn } from '@/utils/cn';
@@ -130,7 +131,7 @@ export default function OverviewTopEvents({
           </WidgetButtons>
         </WidgetHead>
         <WidgetBody>
-          <ChartSwitch hideID {...widget.chart} previous={false} />
+          <LazyChart hideID {...widget.chart} previous={false} />
         </WidgetBody>
       </Widget>
     </>
diff --git a/apps/dashboard/src/components/overview/overview-top-geo.tsx b/apps/dashboard/src/components/overview/overview-top-geo.tsx
index fe6cf34b..4c56646f 100644
--- a/apps/dashboard/src/components/overview/overview-top-geo.tsx
+++ b/apps/dashboard/src/components/overview/overview-top-geo.tsx
@@ -7,6 +7,7 @@ import { cn } from '@/utils/cn';
 
 import type { IChartType } from '@openpanel/validation';
 
+import { LazyChart } from '../report/chart/LazyChart';
 import { Widget, WidgetBody } from '../widget';
 import { OverviewChartToggle } from './overview-chart-toggle';
 import { WidgetButtons, WidgetHead } from './overview-widget';
@@ -136,7 +137,7 @@ export default function OverviewTopGeo({ projectId }: OverviewTopGeoProps) {
           </WidgetButtons>
         </WidgetHead>
         <WidgetBody>
-          <ChartSwitch
+          <LazyChart
             hideID
             {...widget.chart}
             previous={false}
diff --git a/apps/dashboard/src/components/overview/overview-top-pages.tsx b/apps/dashboard/src/components/overview/overview-top-pages.tsx
index 9b6f78bd..d5aa772c 100644
--- a/apps/dashboard/src/components/overview/overview-top-pages.tsx
+++ b/apps/dashboard/src/components/overview/overview-top-pages.tsx
@@ -1,12 +1,12 @@
 'use client';
 
 import { useState } from 'react';
-import { ChartSwitch } from '@/components/report/chart';
 import { useEventQueryFilters } from '@/hooks/useEventQueryFilters';
 import { cn } from '@/utils/cn';
 
 import type { IChartType } from '@openpanel/validation';
 
+import { LazyChart } from '../report/chart/LazyChart';
 import { Widget, WidgetBody } from '../widget';
 import { OverviewChartToggle } from './overview-chart-toggle';
 import { WidgetButtons, WidgetHead } from './overview-widget';
@@ -135,7 +135,7 @@ export default function OverviewTopPages({ projectId }: OverviewTopPagesProps) {
           </WidgetButtons>
         </WidgetHead>
         <WidgetBody>
-          <ChartSwitch
+          <LazyChart
             hideID
             {...widget.chart}
             previous={false}
diff --git a/apps/dashboard/src/components/overview/overview-top-sources.tsx b/apps/dashboard/src/components/overview/overview-top-sources.tsx
index 88477eb7..325bd4bc 100644
--- a/apps/dashboard/src/components/overview/overview-top-sources.tsx
+++ b/apps/dashboard/src/components/overview/overview-top-sources.tsx
@@ -1,12 +1,12 @@
 'use client';
 
 import { useState } from 'react';
-import { ChartSwitch } from '@/components/report/chart';
 import { useEventQueryFilters } from '@/hooks/useEventQueryFilters';
 import { cn } from '@/utils/cn';
 
 import type { IChartType } from '@openpanel/validation';
 
+import { LazyChart } from '../report/chart/LazyChart';
 import { Widget, WidgetBody } from '../widget';
 import { OverviewChartToggle } from './overview-chart-toggle';
 import { WidgetButtons, WidgetHead } from './overview-widget';
@@ -289,7 +289,7 @@ export default function OverviewTopSources({
           </WidgetButtons>
         </WidgetHead>
         <WidgetBody>
-          <ChartSwitch
+          <LazyChart
             hideID
             {...widget.chart}
             previous={false}
diff --git a/apps/dashboard/src/components/report/chart/Chart.tsx b/apps/dashboard/src/components/report/chart/Chart.tsx
index 3fc7d554..220b80d8 100644
--- a/apps/dashboard/src/components/report/chart/Chart.tsx
+++ b/apps/dashboard/src/components/report/chart/Chart.tsx
@@ -31,12 +31,17 @@ export function Chart({
   startDate,
   endDate,
 }: ReportChartProps) {
-  const [references] = api.reference.getChartReferences.useSuspenseQuery({
-    projectId,
-    startDate,
-    endDate,
-    range,
-  });
+  const [references] = api.reference.getChartReferences.useSuspenseQuery(
+    {
+      projectId,
+      startDate,
+      endDate,
+      range,
+    },
+    {
+      staleTime: 1000 * 60 * 5,
+    }
+  );
 
   const [data] = api.chart.chart.useSuspenseQuery(
     {