Hoist DottedMap constants to module scope, static-import above-fold components

DottedMap: move createMap, stagger helpers, and base dots path to module
scope so they compute once on module load and survive unmount/remount
cycles — eliminates all recomputation when switching tabs.

Dashboard: restore static imports for the 5 above-fold components
(Chart, ContentStats, TopReferrers, Locations, TechSpecs) now that
their heavy computations are memoized. Keeps below-fold components
(PerformanceStats, GoalStats, ScrollDepth, Campaigns, etc.) dynamic.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Usman Baig
2026-03-10 00:51:32 +01:00
parent 8c5b452f73
commit 88f02a244b
2 changed files with 63 additions and 62 deletions

View File

@@ -26,12 +26,12 @@ import dynamic from 'next/dynamic'
import { DashboardSkeleton, useMinimumLoading } from '@/components/skeletons'
import FilterBar from '@/components/dashboard/FilterBar'
import AddFilterDropdown, { type FilterSuggestion, type FilterSuggestions } from '@/components/dashboard/AddFilterDropdown'
import Chart from '@/components/dashboard/Chart'
import ContentStats from '@/components/dashboard/ContentStats'
import TopReferrers from '@/components/dashboard/TopReferrers'
import Locations from '@/components/dashboard/Locations'
import TechSpecs from '@/components/dashboard/TechSpecs'
const Chart = dynamic(() => import('@/components/dashboard/Chart'))
const ContentStats = dynamic(() => import('@/components/dashboard/ContentStats'))
const TopReferrers = dynamic(() => import('@/components/dashboard/TopReferrers'))
const Locations = dynamic(() => import('@/components/dashboard/Locations'))
const TechSpecs = dynamic(() => import('@/components/dashboard/TechSpecs'))
const PerformanceStats = dynamic(() => import('@/components/dashboard/PerformanceStats'))
const GoalStats = dynamic(() => import('@/components/dashboard/GoalStats'))
const ScrollDepth = dynamic(() => import('@/components/dashboard/ScrollDepth'))