From c894fde09f22a2e103bf0c1f893b6b2b88b8e9d6 Mon Sep 17 00:00:00 2001
From: ccbikai <ccbikai@qq.com>
Date: Sat, 8 Jun 2024 17:15:25 +0800
Subject: [PATCH 1/2] perf: The map is not packaged into the code to reduce the
 server size

---
 .gitignore                                 |  2 +-
 components/dashboard/metrics/Locations.vue | 15 +++++++++++++--
 pages/dashboard/index.vue                  |  2 +-
 pages/dashboard/login.vue                  |  2 +-
 scripts/build-map.js                       |  2 +-
 5 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/.gitignore b/.gitignore
index bead600..585e78b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -25,4 +25,4 @@ logs
 .wrangler
 site
 cache
-assets/location/world-topo.json
+public/world.json
diff --git a/components/dashboard/metrics/Locations.vue b/components/dashboard/metrics/Locations.vue
index 4da8260..51cbc6f 100644
--- a/components/dashboard/metrics/Locations.vue
+++ b/components/dashboard/metrics/Locations.vue
@@ -1,14 +1,23 @@
 <script setup>
 import { VisSingleContainer, VisTopoJSONMap, VisTopoJSONMapSelectors } from '@unovis/vue'
-import WorldMapTopoJSON from '@/assets/location/world-topo.json' // https://github.com/apache/echarts/blob/master/test/data/map/json/world.json
 import { ChartTooltip } from '@/components/ui/chart'
 
 const id = inject('id')
 const startAt = inject('startAt')
 const endAt = inject('endAt')
 
+const worldMapTopoJSON = ref({})
 const areaData = ref([])
 
+async function getWorldMapJSON() {
+  const data = await $fetch('/world.json', {
+    query: {
+      type: 'world',
+    },
+  })
+  worldMapTopoJSON.value = data
+}
+
 async function getMapData() {
   areaData.value = []
   const { data } = await useAPI('/api/stats/metrics', {
@@ -30,6 +39,7 @@ async function getMapData() {
 const stopWatchTime = watch([startAt, endAt], getMapData)
 
 onMounted(() => {
+  getWorldMapJSON()
   getMapData()
 })
 
@@ -60,11 +70,12 @@ const Tooltip = {
     <CardContent class="flex-1 flex [&_[data-radix-aspect-ratio-wrapper]]:flex-1">
       <AspectRatio :ratio="65 / 30">
         <VisSingleContainer
+          v-if="worldMapTopoJSON.type"
           :data="{ areas: areaData }"
           class="h-full"
         >
           <VisTopoJSONMap
-            :topojson="WorldMapTopoJSON"
+            :topojson="worldMapTopoJSON"
             map-feature-name="states"
           />
           <ChartSingleTooltip
diff --git a/pages/dashboard/index.vue b/pages/dashboard/index.vue
index f808fe0..348cb9d 100644
--- a/pages/dashboard/index.vue
+++ b/pages/dashboard/index.vue
@@ -5,6 +5,6 @@ provide('id', ref())
 <template>
   <main class="space-y-6">
     <DashboardBreadcrumb title="Analysis" />
-    <LazyDashboard />
+    <Dashboard />
   </main>
 </template>
diff --git a/pages/dashboard/login.vue b/pages/dashboard/login.vue
index 3ff6d31..9494ee1 100644
--- a/pages/dashboard/login.vue
+++ b/pages/dashboard/login.vue
@@ -1,5 +1,5 @@
 <template>
   <main class="flex items-center justify-center h-full">
-    <LazyLogin />
+    <Login />
   </main>
 </template>
diff --git a/scripts/build-map.js b/scripts/build-map.js
index 8707e9d..115a099 100644
--- a/scripts/build-map.js
+++ b/scripts/build-map.js
@@ -16,4 +16,4 @@ WorldMapTopoJSON.objects.states.geometries.map((state) => {
   return state
 })
 
-writeFileSync(join(import.meta.dirname, '../assets/location/world-topo.json'), JSON.stringify(WorldMapTopoJSON), 'utf8')
+writeFileSync(join(import.meta.dirname, '../public/world.json'), JSON.stringify(WorldMapTopoJSON), 'utf8')

From 07c11954c72052004a58ad37dd6a165372d2b421 Mon Sep 17 00:00:00 2001
From: ccbikai <ccbikai@qq.com>
Date: Sat, 8 Jun 2024 17:20:10 +0800
Subject: [PATCH 2/2] perf: Optimize fetching of world map JSON

---
 components/dashboard/metrics/Locations.vue | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/components/dashboard/metrics/Locations.vue b/components/dashboard/metrics/Locations.vue
index 51cbc6f..280c5d0 100644
--- a/components/dashboard/metrics/Locations.vue
+++ b/components/dashboard/metrics/Locations.vue
@@ -10,11 +10,7 @@ const worldMapTopoJSON = ref({})
 const areaData = ref([])
 
 async function getWorldMapJSON() {
-  const data = await $fetch('/world.json', {
-    query: {
-      type: 'world',
-    },
-  })
+  const data = await $fetch('/world.json')
   worldMapTopoJSON.value = data
 }