perf: The map is not packaged into the code to reduce the server size

.gitignore

@@ -25,4 +25,4 @@ logs
 .wrangler
 site
 cache
-assets/location/world-topo.json
+public/world.json

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

pages/dashboard/index.vue

@@ -5,6 +5,6 @@ provide('id', ref())
 <template>
   <main class="space-y-6">
     <DashboardBreadcrumb title="Analysis" />
-    <LazyDashboard />
+    <Dashboard />
   </main>
 </template>

pages/dashboard/login.vue

@@ -1,5 +1,5 @@
 <template>
   <main class="flex items-center justify-center h-full">
-    <LazyLogin />
+    <Login />
   </main>
 </template>

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')